Upgrade Socket.IO to v4

client/package.json

@@ -74,7 +74,7 @@
     "resolve-url-loader": "^3.1.2",
     "sass": "^1.93.2",
     "sass-loader": "^10.5.2",
-    "socket.io-client": "^3.1.3",
+    "socket.io-client": "^4.8.3",
     "stackmat-signal-processor": "^0.1.0",
     "style-loader": "1.0.0",
     "terser-webpack-plugin": "^4.2.3",

cypress/e2e/local_stack.cy.js

@@ -9,8 +9,8 @@ describe('local app stack', () => {
   it('shows the lobby without a logged-in session', () => {
     cy.visit('/');
 
-    cy.contains('Public Rooms', { timeout: 10000 }).should('be.visible');
-    cy.contains('Private Rooms').should('be.visible');
+    cy.contains('Public Rooms', { timeout: 10000 }).should('exist');
+    cy.contains('Private Rooms').should('exist');
     cy.contains('Create Room').should('not.exist');
 
     cy.request({
@@ -55,7 +55,7 @@ describe('local app stack', () => {
 
     cy.visit('/');
     cy.contains('Public Rooms').should('be.visible');
-    cy.contains(roomName).should('be.visible');
+    cy.contains(roomName).scrollIntoView().should('be.visible');
   });
 
   it('sends and displays chat messages through the socket server', () => {

server/package.json

@@ -3,13 +3,15 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@socket.io/redis-adapter": "^8.3.0",
     "bcrypt": "5.0.0",
     "connect-mongo": "^3.2.0",
     "cors": "^2.8.5",
     "express": "^4.22.2",
     "express-session": "^1.19.0",
     "express-socket.io-session": "^1.3.5",
     "getconfig": "^4.5.0",
+    "ioredis": "^5.8.2",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
     "mongoose": "^6.13.9",
@@ -22,8 +24,7 @@
     "passport-wca": "^1.0.3",
     "rest-api-errors": "^1.2.1",
     "scrambow": "^1.8.1",
-    "socket.io": "^3.1.2",
-    "socket.io-redis": "^6.0.1",
+    "socket.io": "^4.8.3",
     "uuid": "^11.1.1",
     "winston": "3.2.1"
   },

server/socket/index.js

@@ -1,7 +1,8 @@
 const http = require('http');
 const config = require('getconfig');
-const socketIO = require('socket.io');
-const redis = require('socket.io-redis');
+const { Server } = require('socket.io');
+const { createAdapter } = require('@socket.io/redis-adapter');
+const Redis = require('ioredis');
 const expressSocketSession = require('express-socket.io-session');
 const session = require('../middlewares/session');
 const { connect } = require('../database');
@@ -29,7 +30,7 @@ const watchNamespaceErrors = (io, namespace) => {
 
 const init = async () => {
   const server = http.createServer();
-  const io = socketIO(server, {
+  const io = new Server(server, {
     cors: {
       origin: true,
       // config.cors.origin.map((o) => new RegExp(o)),
@@ -48,10 +49,16 @@ const init = async () => {
 
   const mongoose = await connect();
 
-  io.adapter(redis({
+  const pubClient = new Redis({
     host: 'localhost',
     port: 6379,
-  }));
+  });
+  const subClient = pubClient.duplicate();
+
+  pubClient.on('error', logSocketError('redis pub client'));
+  subClient.on('error', logSocketError('redis sub client'));
+
+  io.adapter(createAdapter(pubClient, subClient));
 
   const middlewares = [
     expressSocketSession(session(mongoose), {