gmatte/EvalueTonSavoir
1
0
Fork 0
mirror of https://github.com/ets-cfuhrman-pfe/EvalueTonSavoir.git synced 2025-08-11 21:23:54 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Clean up ENV variables

Browse source 
Define one for SOCKET url (testing), if it's not defined socket.io defaults to window.location.host
This commit is contained in:
C. Fuhrman 2024-10-31 11:31:26 -04:00
parent e2c4e5cba2
commit 3712464873
7 changed files with 31 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
client/jest.setup.cjs
View file

@ -1,7 +1,2 @@
global.import = { process.env.VITE_BACKEND_URL = 'http://localhost:4000/';
meta: { process.env.VITE_BACKEND_SOCKET_URL = 'https://ets-glitch-backend.glitch.me/';
env: {
VITE_BACKEND_URL: 'https://ets-glitch-backend.glitch.me/'
}
}
};

24
client/src/__tests__/services/WebsocketService.test.tsx
View file

@ -5,11 +5,11 @@ import { ENV_VARIABLES } from '../../constants';
jest.mock('socket.io-client'); jest.mock('socket.io-client');
jest.mock('../../constants', () => ({ // jest.mock('../../constants', () => ({
ENV_VARIABLES: { // ENV_VARIABLES: {
VITE_BACKEND_URL: 'https://ets-glitch-backend.glitch.me/' // VITE_BACKEND_SOCKET_URL: 'https://ets-glitch-backend.glitch.me/'
} // }
})); // }));
describe('WebSocketService', () => { describe('WebSocketService', () => {
let mockSocket: Partial<Socket>; let mockSocket: Partial<Socket>;
@ -29,13 +29,13 @@ describe('WebSocketService', () => {
}); });
test('connect should initialize socket connection', () => { test('connect should initialize socket connection', () => {
WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
expect(io).toHaveBeenCalled(); expect(io).toHaveBeenCalled();
expect(WebsocketService['socket']).toBe(mockSocket); expect(WebsocketService['socket']).toBe(mockSocket);
}); });
test('disconnect should terminate socket connection', () => { test('disconnect should terminate socket connection', () => {
mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
expect(WebsocketService['socket']).toBeTruthy(); expect(WebsocketService['socket']).toBeTruthy();
WebsocketService.disconnect(); WebsocketService.disconnect();
expect(mockSocket.disconnect).toHaveBeenCalled(); expect(mockSocket.disconnect).toHaveBeenCalled();
@ -43,7 +43,7 @@ describe('WebSocketService', () => {
}); });
test('createRoom should emit create-room event', () => { test('createRoom should emit create-room event', () => {
WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
WebsocketService.createRoom(); WebsocketService.createRoom();
expect(mockSocket.emit).toHaveBeenCalledWith('create-room'); expect(mockSocket.emit).toHaveBeenCalledWith('create-room');
}); });
@ -52,7 +52,7 @@ describe('WebSocketService', () => {
const roomName = 'testRoom'; const roomName = 'testRoom';
const question = { id: 1, text: 'Sample Question' }; const question = { id: 1, text: 'Sample Question' };
mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
WebsocketService.nextQuestion(roomName, question); WebsocketService.nextQuestion(roomName, question);
expect(mockSocket.emit).toHaveBeenCalledWith('next-question', { roomName, question }); expect(mockSocket.emit).toHaveBeenCalledWith('next-question', { roomName, question });
}); });
@ -61,7 +61,7 @@ describe('WebSocketService', () => {
const roomName = 'testRoom'; const roomName = 'testRoom';
const questions = [{ id: 1, text: 'Sample Question' }]; const questions = [{ id: 1, text: 'Sample Question' }];
mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
WebsocketService.launchStudentModeQuiz(roomName, questions); WebsocketService.launchStudentModeQuiz(roomName, questions);
expect(mockSocket.emit).toHaveBeenCalledWith('launch-student-mode', { expect(mockSocket.emit).toHaveBeenCalledWith('launch-student-mode', {
roomName, roomName,
@ -72,7 +72,7 @@ describe('WebSocketService', () => {
test('endQuiz should emit end-quiz event with correct parameters', () => { test('endQuiz should emit end-quiz event with correct parameters', () => {
const roomName = 'testRoom'; const roomName = 'testRoom';
mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
WebsocketService.endQuiz(roomName); WebsocketService.endQuiz(roomName);
expect(mockSocket.emit).toHaveBeenCalledWith('end-quiz', { roomName }); expect(mockSocket.emit).toHaveBeenCalledWith('end-quiz', { roomName });
}); });
@ -81,7 +81,7 @@ describe('WebSocketService', () => {
const enteredRoomName = 'testRoom'; const enteredRoomName = 'testRoom';
const username = 'testUser'; const username = 'testUser';
mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); mockSocket = WebsocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
WebsocketService.joinRoom(enteredRoomName, username); WebsocketService.joinRoom(enteredRoomName, username);
expect(mockSocket.emit).toHaveBeenCalledWith('join-room', { enteredRoomName, username }); expect(mockSocket.emit).toHaveBeenCalledWith('join-room', { enteredRoomName, username });
}); });

4
client/src/constants.tsx
View file

@ -1,9 +1,11 @@
// constants.tsx // constants.tsx
const ENV_VARIABLES = { const ENV_VARIABLES = {
MODE: 'production', MODE: 'production',
VITE_BACKEND_URL: process.env.VITE_BACKEND_URL || "" VITE_BACKEND_URL: process.env.VITE_BACKEND_URL || "",
VITE_BACKEND_SOCKET_URL: process.env.VITE_BACKEND_SOCKET_URL || "",
}; };
console.log(`ENV_VARIABLES.VITE_BACKEND_URL=${ENV_VARIABLES.VITE_BACKEND_URL}`); console.log(`ENV_VARIABLES.VITE_BACKEND_URL=${ENV_VARIABLES.VITE_BACKEND_URL}`);
console.log(`ENV_VARIABLES.VITE_BACKEND_SOCKET_URL=${ENV_VARIABLES.VITE_BACKEND_SOCKET_URL}`);
export { ENV_VARIABLES }; export { ENV_VARIABLES };

4
client/src/pages/Student/JoinRoom/JoinRoom.tsx
View file

@ -34,8 +34,8 @@ const JoinRoom: React.FC = () => {
}, []); }, []);
const handleCreateSocket = () => { const handleCreateSocket = () => {
console.log(`JoinRoom: handleCreateSocket: ${ENV_VARIABLES.VITE_BACKEND_URL}`); console.log(`JoinRoom: handleCreateSocket: ${ENV_VARIABLES.VITE_BACKEND_SOCKET_URL}`);
const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
socket.on('join-success', () => { socket.on('join-success', () => {
setIsWaitingForTeacher(true); setIsWaitingForTeacher(true);

2
client/src/pages/Teacher/ManageRoom/ManageRoom.tsx
View file

@ -83,7 +83,7 @@ const ManageRoom: React.FC = () => {
const createWebSocketRoom = () => { const createWebSocketRoom = () => {
console.log('Creating WebSocket room...'); console.log('Creating WebSocket room...');
setConnectingError(''); setConnectingError('');
const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_URL); const socket = webSocketService.connect(ENV_VARIABLES.VITE_BACKEND_SOCKET_URL);
socket.on('connect', () => { socket.on('connect', () => {
webSocketService.createRoom(); webSocketService.createRoom();

13
client/src/services/WebsocketService.tsx
View file

@ -21,13 +21,14 @@ class WebSocketService {
private socket: Socket | null = null; private socket: Socket | null = null;
connect(backendUrl: string): Socket { connect(backendUrl: string): Socket {
console.log(`WebSocketService.connect(${backendUrl})`); console.log(`WebSocketService.connect('${backendUrl}')`);
// Ensure the URL uses wss: if the URL starts with https: // // Ensure the URL uses wss: if the URL starts with https:
const protocol = backendUrl.startsWith('https:') ? 'wss:' : 'ws:'; // const protocol = backendUrl.startsWith('https:') ? 'wss:' : 'ws:';
console.log(`WebSocketService.connect: protocol=${protocol}`); // console.log(`WebSocketService.connect: protocol=${protocol}`);
const url = backendUrl.replace(/^http(s):/, protocol); // const url = backendUrl.replace(/^http(s):/, protocol);
console.log(`WebSocketService.connect: changed url=${url}`); // console.log(`WebSocketService.connect: changed url=${url}`);
const url = backendUrl || window.location.host;
this.socket = io(url, { this.socket = io(url, {
transports: ['websocket'], transports: ['websocket'],

4
docker-compose.yaml
View file

@ -5,6 +5,10 @@ services:
container_name: frontend container_name: frontend
ports: ports:
- "5173:5173" - "5173:5173"
environment:
VITE_BACKEND_URL: "http://localhost:4400"
# don't define VITE_BACKEND_SOCKET_URL so it will default to window.location.host
# VITE_BACKEND_SOCKET_URL: ""
restart: always restart: always
backend: backend: