(
22 | "react-router-dom"
23 | );
24 | return {
25 | ...mod,
26 | useNavigate: () => mockedUseNavigate,
27 | };
28 | });
29 |
30 | describe('Player View', () => {
31 | it('renders view correctly', () => {
32 | const { getByText } = render(
33 |
34 |
35 |
37 |
38 | );
39 | expect(getByText("Submit Response")).toBeInTheDocument()
40 | });
41 |
42 | it('renders spinning card', async () => {
43 | const mockState = {
44 | socket: undefined,
45 | uid: '',
46 | users: [],
47 | rooms: {
48 | "room1": ["a", "b", "c"],
49 | "room2": ["a", "b", "c"],
50 | "room3": ["a", "b", "c"],
51 | },
52 | white_card: new Map([
53 | ['player1', 'card1'],
54 | ['player2', 'card2'],
55 | ['player3', 'card3']
56 | ]),
57 | czarSocketId: "",
58 | black_card: "",
59 | score: new Map(),
60 | new_turn: false
61 | };
62 |
63 | const mockNavigate = vi.fn();
64 | const state = { roomName: 'room1', isCzar: false };
65 | const socketProvider = ({ children }) => (
66 |
67 | { } }}>
68 |
69 | {children}
70 |
71 |
72 |
73 | )
74 | render(
105 | { } }}>
106 |
107 | {children}
108 |
109 |
110 |
111 | )
112 | render(
142 | { } }}>
143 |
144 | {children}
145 |
146 |
147 |
148 | )
149 | render(
2 |
4 |
5 |
6 | Cards Against Humanity ⚫️🃏⚪️
7 |
8 |
9 |
10 |
12 |
13 |
14 |
15 |
16 | :book: Table of Contents
17 |
18 |
19 | Table of Contents
20 |
21 | ➤ About The Project ➤ Overview ➤ Getting Started ➤ Authors
26 |
27 |
28 | 
29 |
30 |
31 | :pencil: About The Project
32 |
33 |
34 |
35 | Cards Against Humanity: `fill in the blank` Edition is a fill-in-the-blank party game. Each
36 | round, one player asks the group a question from a black card. These cards consist of inside jokes, memories, and more.
37 |
38 | One random player begins as the `Czar` and draws a black card.
39 |
40 | The Czar reads the black card out loud. Everyone else then answers the
41 | question (or fills in the blank) by passing one white card, face down, to the Czar.
42 |
43 | The Czar then shuffles all the white cards and re-reads the black card out loud
44 | with each one. Finally, the Czar picks the funniest combination, and whoever
45 | played it gets one point/the black card.
46 |
47 |
48 |
49 |
50 | 
51 |
52 |
53 | :cloud: Overview
54 |
55 |
56 | Cards Against Humanity: Fill in the Blank Edition takes the outrageous and irreverent gameplay of the original party game to new levels of hilarity. Designed to bring friends, families, and acquaintances closer through laughter, this game provides a perfect platform for creating inside jokes, recalling funny memories, and engaging in twisted humor.
57 |
58 | ### Gameplay:
59 | The game starts with one player being randomly selected as the Czar for the round. The Czar draws a black card, which contains a question or a statement with one or more blanks. The black cards often touch on taboo subjects, current events, or the darkest corners of our collective humor.
60 |
61 | The Czar reads the black card aloud, and the other players must select a white card from their hand to fill in the blank(s) or provide a humorous response. The white cards contain various phrases, words, or combinations that can be absurd, witty, or downright outrageous.
62 |
63 | Once everyone has chosen a white card, they pass it face-down to the Czar. The Czar then shuffles all the white cards to maintain anonymity and proceeds to read the black card out loud again, replacing the blank(s) with the responses provided by the players.
64 |
65 | At this point, the Czar becomes the ultimate judge of comedic value and reads each combination aloud. The goal is to select the funniest or most clever response from the mix of white cards. The player who played the chosen white card earns a point, representing their victory for that round.
66 |
67 | ### Unleash Your Dark Humor:
68 | Cards Against Humanity: Fill in the Blank Edition encourages players to let loose and embrace their darkest sense of humor. The game thrives on the unexpected, pushing boundaries, and exploring the unspoken. It allows players to express their creativity and wit by providing unique answers to the prompts, often leading to hilarious or cringe-worthy results.
69 |
70 | ### Inside Jokes and Memories:
71 | As players continue to engage with the game over time, they develop a shared set of inside jokes and memories. The game becomes a catalyst for creating new hilarious moments and referencing past experiences, making it an excellent choice for gatherings with close friends or long-standing groups.
72 |
73 |
74 |
75 | 
76 |
77 | 
78 |
79 |
80 | :book: Getting Started
81 |
82 | Via GitHub Desktop clone this repository then to run the server and client, you need to have Node.js `v18.15.0` or higher installed on your system.
83 |
84 | `Server`:
85 | To run the server locally, follow these steps:
86 |
87 | - Navigate to the server folder of the project.
88 | - Run the command `npm install` to install all the necessary dependencies.
89 | - Run the command `npm run dev` to start the server.
90 |
91 | The server will be listening at `http://localhost:3000`.
92 |
93 | `Client`:
94 | To run the client locally, follow these steps:
95 |
96 | - Navigate to the client folder of the project.
97 | - Run the command `npm install` to install all the necessary dependencies.
98 | - Run the command `npm run dev` or `npm run host` to start the client.
99 |
100 | The client will be running at `http://localhost:5173`.
101 |
102 |
103 |
104 | 
105 |
106 |
107 |
108 | :scroll: Authors
109 |
110 | Emanuele Dall'Ara
111 |
112 | [](https://github.com/LeleDallas)
113 | [](https://www.linkedin.com/in/emanuele-dall-ara-40b3311a7/)
114 |
115 | Nicholas Ricci
116 |
117 | [](https://www.github.com/Piccio98)
118 | [](https://www.linkedin.com/in/nicholas-ricci-6b89ab1b7/)
119 |
120 |
121 |
122 |
--------------------------------------------------------------------------------
/client/test/Game.test.tsx:
--------------------------------------------------------------------------------
1 | import '@testing-library/jest-dom';
2 | import React from 'react';
3 | import { expect, it, describe, vi } from 'vitest'
4 | import { fireEvent, render, screen } from '@testing-library/react'
5 | import { BrowserRouter, MemoryRouter } from 'react-router-dom';
6 | import Game from '../src/Pages/Game/Game';
7 | import { act } from 'react-dom/test-utils';
8 | import { Provider } from 'react-redux';
9 | import { store } from '../src/store/store';
10 | import { SocketContextProvider } from '../src/context/SocketContext';
11 |
12 | const mockedUseNavigate = vi.fn();
13 | vi.mock("react-router-dom", async () => {
14 | const mod = await vi.importActual(
15 | "react-router-dom"
16 | );
17 | return {
18 | ...mod,
19 | useNavigate: () => mockedUseNavigate,
20 | };
21 | });
22 |
23 | describe('Game', () => {
24 | const navigate = vi.fn();
25 | const socket = { on: vi.fn(), emit: vi.fn() };
26 | const socketState = { socket, rooms: { ["test-room"]: ["a", "b", "c"] } };
27 | const socketContext = { socketState };
28 |
29 | it('renders without errors', async () => {
30 | const { getByText } = render(
31 |
32 |
33 |
35 |
36 | )
37 | expect(getByText("Go to the homepage")).toBeInTheDocument()
38 | fireEvent.click(getByText("Go to the homepage"));
39 | expect(mockedUseNavigate).toHaveBeenCalledTimes(1)
40 | })
41 |
42 | it('renders player game', async () => {
43 | const socket = { on: vi.fn(), emit: vi.fn() };
44 | const mockState = {
45 | socket: undefined,
46 | uid: '',
47 | users: [],
48 | rooms: {
49 | "room1": ["a", "b", "c"],
50 | "room2": ["a", "b", "c"],
51 | "room3": ["a", "b", "c"],
52 | },
53 | white_card: new Map([
54 | ['player1', 'card1'],
55 | ['player2', 'card2'],
56 | ['player3', 'card3']
57 | ]),
58 | czarSocketId: "",
59 | black_card: "",
60 | score: new Map(),
61 | new_turn: false
62 | };
63 |
64 | const mockNavigate = vi.fn();
65 | const state = { roomName: 'room1', isCzar: false };
66 | const socketProvider = ({ children }) => (
67 |
68 | { } }}>
69 |
70 | {children}
71 |
72 |
73 |
74 | )
75 | render(
111 | { } }}>
112 |
113 | {children}
114 |
115 |
116 |
117 | )
118 | render(
152 | { } }}>
153 |
154 | {children}
155 |
156 |
157 |
158 | )
159 | render( | undefined,
13 | roomName: string,
14 | navigate: NavigateFunction
15 | ) => {
16 | if (roomName.length === 0) {
17 | message.error("Insert a Lobby name")
18 | return
19 | }
20 | socket?.emit("create_room", roomName, (response: SocketRoomResponse) => {
21 | if (response.success) {
22 | navigate("/waiting", { state: { roomName: response.data.roomName, type: "admin" } })
23 | }
24 | })
25 | }
26 |
27 | export const joinRoom = (
28 | socket: Socket | undefined,
29 | roomName: string,
30 | navigate: NavigateFunction
31 | ) => {
32 | socket?.emit("join_room", roomName, (response: any) => {
33 | if (response.success) {
34 | navigate("/waiting", { state: { roomName, type: "user" } })
35 | }
36 | })
37 | }
38 |
39 | export const drawBlackCard = (black: Array): Cards =>
40 | black[Math.floor(Math.random() * black.length)];
41 |
42 | export const drawWhiteCards = (white: Array, quantity: number): Array =>
43 | [...white].sort(() => 0.5 - Math.random()).slice(0, quantity);
44 |
45 |
46 | export const drawNew = (
47 | socket: Socket | undefined,
48 | czarSocketId: string,
49 | playerHand: Array,
50 | selected: string,
51 | white: any,
52 | setSelected: (string: string) => void,
53 | setPlayerHand: React.Dispatch>,
54 | setHasPlayed: (userSelected: boolean) => void,
55 | ) => {
56 | if (socket)
57 | sendWhiteResponse(socket!, czarSocketId, selected, socket?.id)
58 | setPlayerHand(playerHand.filter((card, _) => card.title !== selected))
59 | setPlayerHand((oldHand: Array) => [...oldHand, ...drawWhiteCards(white, 1)]);
60 | setSelected("")
61 | setHasPlayed(true)
62 | }
63 |
64 | export const setCurrentSolution = (
65 | solution: string,
66 | selected: string,
67 | userSelected: string,
68 | setSelected: (string: string) => void,
69 | setSolution: (isSelected: boolean) => void,
70 | setSelectedUser: (userSelected: string) => void
71 | ) => {
72 | if (solution !== selected && selected !== solution) {
73 | setSelected(solution)
74 | setSolution(true)
75 | setSelectedUser(userSelected)
76 | }
77 | else {
78 | setSelected("")
79 | setSelectedUser("")
80 | setSolution(false)
81 | }
82 | }
83 |
84 | export const sendBlack = (
85 | socket: Socket | undefined,
86 | card: string,
87 | roomName: string
88 | ) => {
89 | socket?.emit("send_black_card", card, roomName, socket.id, (response: SocketGameStartResponse) => { })
90 | }
91 |
92 | export const sendWhiteResponse = (
93 | socket: Socket | undefined,
94 | czarSocketId: string,
95 | card: string,
96 | user: string
97 | ) => {
98 | socket?.emit("send_white_card", czarSocketId, card, user, (response: SocketGameStartResponse) => { })
99 | }
100 |
101 | const updateScore = (oldScore: Map, userKey: string) => {
102 | if (userKey === "")
103 | return oldScore
104 | const newScore = new Map();
105 | oldScore.forEach((item: any) => newScore.set(item[0], item[1]));
106 | newScore.set(userKey, newScore.get(userKey)! + 1);
107 | return newScore
108 | }
109 |
110 | export const onConfirm = (
111 | socket: Socket | undefined,
112 | roomName: string,
113 | oldScore: Map,
114 | newCzarId: string,
115 | hasPlayed: boolean
116 | ) => {
117 | socket?.emit("request_update_score", roomName, Array.from(updateScore(oldScore, newCzarId)))
118 | socket?.emit("reset_turn", roomName, hasPlayed, (response: SocketGameStartResponse) => { })
119 | }
120 |
121 | export const resetWhite = (socket: Socket | undefined, czarSocketId: string) => {
122 | socket?.emit("reset_white", czarSocketId, (response: SocketGameStartResponse) => {
123 | })
124 | }
125 |
126 | export const resetScore = (
127 | socket: Socket | undefined,
128 | roomName: string) => {
129 | socket?.emit("request_reset_score", roomName)
130 | }
131 |
132 | export const startGame = (
133 | socket: Socket | undefined,
134 | roomName: string,
135 | navigate: NavigateFunction
136 | ) => {
137 | socket?.emit("request_start_game", roomName, (response: SocketGameStartResponse) => {
138 | if (response?.success) {
139 | message.success("Game started!")
140 | navigate("/game", {
141 | state: {
142 | isCzar: response.isCzar,
143 | roomName: roomName
144 | }
145 | })
146 | }
147 | else
148 | message.error("This room has not reach the minimum people to start a game!")
149 | })
150 | }
151 |
152 | export const nextCzar = (
153 | socket: Socket | undefined,
154 | roomName: string,
155 | navigate: NavigateFunction,
156 | newCzarId: string,
157 | exit: boolean = false
158 | ) => {
159 | socket?.emit("update_turn", roomName, newCzarId, (response: SocketGameStartResponse) => {
160 | if (response?.success && !exit) {
161 | navigate("/game", {
162 | state: {
163 | isCzar: response.isCzar,
164 | roomName: roomName
165 | }
166 | })
167 | }
168 | })
169 | }
170 |
171 | export const deleteRoom = (
172 | socket: Socket | undefined,
173 | roomName: string,
174 | navigate: NavigateFunction
175 | ) => {
176 | socket?.emit("delete_room", roomName, (response: SocketRoomResponse) =>
177 | response?.success && navigate("/"))
178 | }
179 |
180 | export const leaveRoom = (
181 | socket: Socket | undefined,
182 | roomName: string,
183 | inGame: boolean,
184 | lobbyType: string,
185 | navigate: NavigateFunction,
186 | score?: Map
187 | ) => {
188 | socket?.emit("leave_room", roomName, inGame, (response: SocketRoomResponse) =>
189 | response?.success && navigate("/"))
190 | if (lobbyType === "czar")
191 | nextCzar(socket, roomName, navigate, "", true)
192 | if (score) {
193 | let newScore = new Map(score)
194 | socket != undefined && newScore.delete(socket.id)
195 | socket?.emit("request_update_score", roomName, Array.from(updateScore(newScore, "")))
196 | }
197 | }
198 |
199 | export const checkScore = (players: Array) => {
200 | let res = players.filter(playerStatus => playerStatus.score > 5)
201 | return { status: res.length > 0, res }
202 | }
203 |
204 | export const fetchCards = (dispatch: Dispatch) => {
205 | fetch('http://localhost:3000/cards/', { mode: 'cors' })
206 | .then((res) => res.json())
207 | .then((data) => {
208 | dispatch(updateBlack(data.filter((card: Cards) => card.isBlack)));
209 | dispatch(updateWhite(data.filter((card: Cards) => !card.isBlack)));
210 | })
211 | .catch((err) => {
212 | console.log(err.message);
213 | });
214 | }
215 |
--------------------------------------------------------------------------------
/server/utils/utils.ts:
--------------------------------------------------------------------------------
1 |
2 | import { Socket, Server } from 'socket.io';
3 | import { user } from "../types/user";
4 | import { v4 } from 'uuid';
5 |
6 | export const getRooms = (availableRooms: Map>,) => {
7 | const filteredRooms = new Map>();
8 |
9 | for (const [roomId, users] of availableRooms.entries()) {
10 | if (roomId.startsWith("room")) {
11 | filteredRooms.set(roomId, [...users]);
12 | }
13 | }
14 | return filteredRooms;
15 | };
16 |
17 | export const getUsersInRoom = (io: Server, roomName: string) => io.sockets.adapter.rooms.get(roomName)
18 |
19 | export const getCurrentRoom = (roomName: string, users: Set | undefined) => {
20 | if (!users)
21 | return {
22 | data: {
23 | roomName,
24 | users: JSON.stringify([])
25 | }
26 | }
27 | else
28 | return {
29 | data: {
30 | roomName,
31 | users: JSON.stringify(users && [...users])
32 | }
33 | }
34 | };
35 |
36 | export const getUidFromSocketID = (users: user, id: string) =>
37 | Object.keys(users).find((uid) => users[uid] === id);
38 |
39 | export const sendMessage = (messageType: string, users: string[], io: Server, payload?: Object) => {
40 | console.info(`Emitting event: ${messageType} to`, users);
41 | users.forEach((id) => (payload ? io.to(id)?.emit(messageType, payload) : io.to(id)?.emit(messageType)));
42 | };
43 |
44 | var host = new Map()
45 | var roomState = new Map()
46 | var czars = new Map()
47 |
48 | export const startListeners = (io: Server, socket: Socket, socketUsers: user) => {
49 | console.info('Message received from socketId: ' + socket.id);
50 | socket.on('handshake', (callback: (uid: string, users: string[]) => void) => {
51 | console.info('Handshake received from: ' + socket.id);
52 | const reconnected = Object.values(socketUsers).includes(socket.id);
53 | if (reconnected) {
54 | console.info('This user has reconnected.');
55 | const uid = getUidFromSocketID(socketUsers, socket.id);
56 | const users = Object.values(socketUsers);
57 | if (uid) {
58 | console.info('Sending callback for reconnect ...');
59 | callback(uid, users);
60 | return;
61 | }
62 | }
63 |
64 | const uid = v4();
65 | socketUsers[uid] = socket.id;
66 | const users = Object.values(socketUsers);
67 | console.info('Sending callback ...');
68 | callback(uid, users);
69 |
70 | sendMessage(
71 | 'user_connected',
72 | users.filter((id) => id !== socket.id),
73 | io,
74 | users
75 | );
76 | });
77 |
78 | socket.on('disconnect', () => {
79 | console.info('Disconnect received from: ' + socket.id);
80 |
81 | const uid = getUidFromSocketID(socketUsers, socket.id);
82 | let newScore = new Map()
83 |
84 | if (uid) {
85 | io.sockets.adapter.rooms.forEach((room, roomName) => {
86 | if (roomName.includes("room")) {
87 | if (host.get(roomName) === socket.id) {
88 | room.forEach((socketId) => {
89 | io.sockets.sockets.get(socketId)?.leave(roomName)
90 | });
91 | }
92 | if (roomState.get(roomName)) {
93 | let done = false
94 | room.forEach(player => {
95 | if (player != socket.id && !done && czars.get(roomName) === socket.id) {
96 | socket.to(player)?.emit("start_game", "czar", roomName)
97 | done = true
98 | }
99 | })
100 | }
101 | }
102 | });
103 | delete socketUsers[uid];
104 | const users = Object.values(socketUsers);
105 | const rooms = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
106 | sendMessage('user_disconnected', users, io, { uid: socket.id, rooms, users });
107 | }
108 | });
109 |
110 | socket.on('create_room', (value, callback) => {
111 | if (io.sockets.adapter.rooms.has("room_" + value)) return
112 | socket.join("room_" + value);
113 | host.set("room_" + value, socket.id)
114 | roomState.set("room_" + value, false)
115 | const response = { success: true, ...getCurrentRoom("room_" + value, getUsersInRoom(io, "room_" + value)) };
116 | const response2 = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
117 |
118 | io.emit("update_rooms", response2);
119 | callback(response);
120 | });
121 |
122 | socket.on('delete_room', (value, callback) => {
123 | console.info(`User ${socket.id} want to delete a room ${value}`);
124 | io.sockets.in(value).socketsLeave(value)
125 | const response = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
126 | io.emit("update_rooms", response);
127 | callback(response);
128 | });
129 |
130 | socket.on('get_rooms', (callback) => {
131 | const response = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
132 | io.emit("update_rooms", response);
133 | callback(response);
134 | });
135 |
136 | socket.on('join_room', (value, callback) => {
137 | if (!io.sockets.adapter.rooms.has(value)) return
138 | console.info(`User ${socket.id} want to join room ${value}`);
139 | socket.join(value);
140 | const response = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
141 | io.emit("update_rooms", response);
142 | callback(response);
143 | });
144 |
145 | socket.on('leave_room', (roomName, inGame, callback) => {
146 | console.info(`User ${socket.id} want to leave room ${roomName}`);
147 | socket.leave(roomName);
148 | let roomPlayers = io.sockets.adapter.rooms.get(roomName)?.size
149 | if (roomPlayers && roomPlayers < 3 && inGame) {
150 | io.sockets.adapter.rooms.get(roomName)?.forEach((socketId) => {
151 | io.sockets.sockets.get(socketId)?.leave(roomName)
152 | });
153 | }
154 | const response = { success: true, data: Object.fromEntries([...getRooms(io.sockets.adapter.rooms)]) };
155 | callback(response);
156 | io.emit("update_rooms", response);
157 | });
158 |
159 | socket.on('request_start_game', (roomName, callback) => {
160 | roomState.set(roomName, true)
161 | if (!io.sockets.adapter.rooms.has(roomName)) return
162 | let roomPlayers = io.sockets.adapter.rooms.get(roomName)?.size
163 | if (roomPlayers && roomPlayers < 3) {
164 | callback({ success: false })
165 | return
166 | }
167 | let randomCzar = roomPlayers && Math.floor(Math.random() * roomPlayers)
168 | let index = 0
169 | let isCzar = "user"
170 | let userScore = new Map()
171 |
172 | io.sockets.adapter.rooms.get(roomName)?.forEach((socketId) => {
173 | userScore.set(socketId, 0)
174 | if (index === randomCzar) {
175 | socket.to(socketId)?.emit("start_game", "czar", roomName)
176 | czars.set(roomName, socketId)
177 | if (socketId === socket.id)
178 | isCzar = "czar"
179 | }
180 | else
181 | socket.to(socketId)?.emit("start_game", "user", roomName)
182 | index++
183 | })
184 | socket.nsp.to(roomName).emit("update_score", Array.from([...userScore]))
185 |
186 | const response = { success: true, isCzar };
187 | callback(response);
188 | });
189 |
190 | socket.on('update_turn', (roomName, newCzarId, callback) => {
191 | if (!io.sockets.adapter.rooms.has(roomName)) return
192 | let roomPlayers = io.sockets.adapter.rooms.get(roomName)?.size
193 | if (roomPlayers && roomPlayers < 3) {
194 | callback({ success: false })
195 | return
196 | }
197 | let done = false
198 | io.sockets.adapter.rooms.get(roomName)?.forEach((socketId) => {
199 | if (newCzarId === "" && !done) {
200 | done = true
201 | socket.to(socketId)?.emit("start_game", "czar", roomName)
202 | czars.set(roomName, socketId)
203 | }
204 | else
205 | if (socketId === newCzarId) {
206 | socket.to(socketId)?.emit("start_game", "czar", roomName)
207 | czars.set(roomName, socketId)
208 | }
209 | else
210 | socket.to(socketId)?.emit("start_game", "user", roomName)
211 | })
212 | callback({ success: true });
213 | });
214 |
215 | socket.on('request_update_score', (roomName: string, userScore: any) => {
216 | socket.nsp.to(roomName)?.emit("update_score", userScore)
217 | })
218 |
219 | socket.on('request_reset_score', (roomName: string) => {
220 | socket.nsp.to(roomName)?.emit("reset_score")
221 | })
222 |
223 | socket.on('send_black_card', (cardTitle, roomName, czarSocket, callback) => {
224 | console.info(`The card is ${cardTitle}`);
225 | io.sockets.adapter.rooms.get(roomName)?.forEach((socketId) => {
226 | socket.to(socketId)?.emit("get_black_card", cardTitle, czarSocket)
227 | })
228 | callback({ success: true });
229 | });
230 |
231 | socket.on('send_white_card', (cZarSocketId, card, user, callback) => {
232 | console.info(`The white card is ${card}`);
233 | socket.to(cZarSocketId)?.emit("get_white_card", card, user)
234 | callback({ success: true });
235 | });
236 |
237 | socket.on('reset_white', (cZarSocketId, callback) => {
238 | console.info(`Reset White Cards`);
239 | socket.to(cZarSocketId)?.emit("reset_white_card")
240 | callback({ success: true });
241 | });
242 |
243 | socket.on('reset_turn', (roomName, hasPlayed, callback) => {
244 | io.sockets.adapter.rooms.get(roomName)?.forEach((socketId) => {
245 | socket.to(socketId)?.emit("new_turn", hasPlayed)
246 | })
247 | callback({ success: true });
248 | });
249 |
250 | };
251 |
--------------------------------------------------------------------------------
/server/test/utils.test.ts:
--------------------------------------------------------------------------------
1 | import { afterAll, beforeAll, beforeEach, describe, expect, it, test, vi } from "vitest";
2 | import { getCurrentRoom, getRooms, getUidFromSocketID, sendMessage, startListeners } from "../utils/utils";
3 | import { io as Client } from "socket.io-client";
4 | import { Server } from "socket.io";
5 | import http from 'http';
6 | import dotenv from 'dotenv';
7 | import { user } from "../types/user";
8 |
9 | dotenv.config();
10 | const port = process.env.PORT;
11 | let io: any, serverSocket: any, clientSocket: any;
12 |
13 | beforeAll((done: any) => {
14 | const httpServer = http.createServer();
15 | io = new Server(httpServer);
16 | httpServer.listen(() => {
17 | clientSocket = Client(`http://localhost:${port}`);
18 | io.on("connection", (socket: any) => {
19 | serverSocket = socket;
20 | });
21 | clientSocket?.on("connect", done);
22 | });
23 | });
24 |
25 | afterAll(() => {
26 | io.close();
27 | clientSocket?.close();
28 | });
29 |
30 |
31 | describe('Server utils', () => {
32 | const user1 = 'user1';
33 | const user2 = 'user2';
34 | const user3 = 'user3';
35 | it('should get empty length on no rooms', () => {
36 | const roomId1 = 'a';
37 | const roomId2 = 'b';
38 | const availableRooms = new Map>([
39 | [roomId1, new Set([user1, user2])],
40 | [roomId2, new Set([user3])]
41 | ]);
42 | expect(getRooms(availableRooms)).toHaveLength(0)
43 | })
44 |
45 | it('should get length of rooms', () => {
46 | const roomId1 = 'room_a';
47 | const roomId2 = 'room_b';
48 | const availableRooms = new Map>([
49 | [roomId1, new Set([user1, user2])],
50 | [roomId2, new Set([user3])]
51 | ]);
52 | expect(getRooms(availableRooms)).toHaveLength(2)
53 | })
54 |
55 | it('should get empty or room length', () => {
56 | const roomId1 = 'room_a';
57 | const failedRoom = 'failed_test';
58 | const users = new Set();
59 | expect(getCurrentRoom(failedRoom, users)).toStrictEqual(
60 | {
61 | "data": {
62 | "roomName": "failed_test",
63 | "users": "[]",
64 | },
65 | }
66 |
67 | )
68 | expect(getCurrentRoom(failedRoom, undefined)).toStrictEqual(
69 | {
70 | "data": {
71 | "roomName": "failed_test",
72 | "users": "[]",
73 | },
74 | }
75 |
76 | )
77 | users.add("1");
78 | users.add("2");
79 | users.add("3");
80 | expect(getCurrentRoom(failedRoom, users)).toStrictEqual(
81 | {
82 | "data": {
83 | "roomName": "failed_test",
84 | "users": '["1","2","3"]',
85 | },
86 | }
87 | )
88 | })
89 |
90 | it('should getUidFromSocketID', () => {
91 | const roomId1 = 'room_a';
92 | const failedRoom = 'failed_test';
93 | const users = new Set();
94 | expect(getCurrentRoom(failedRoom, users)).toStrictEqual(
95 | {
96 | "data": {
97 | "roomName": "failed_test",
98 | "users": "[]",
99 | },
100 | }
101 |
102 | )
103 | expect(getCurrentRoom(failedRoom, undefined)).toStrictEqual(
104 | {
105 | "data": {
106 | "roomName": "failed_test",
107 | "users": "[]",
108 | },
109 | }
110 |
111 | )
112 | users.add("1");
113 | users.add("2");
114 | users.add("3");
115 | expect(getCurrentRoom(failedRoom, users)).toStrictEqual(
116 | {
117 | "data": {
118 | "roomName": "failed_test",
119 | "users": '["1","2","3"]',
120 | },
121 | }
122 | )
123 | })
124 |
125 | it('should return the correct uid', () => {
126 | const users = { 'uid1': 'socket1', 'uid2': 'socket2', 'uid3': 'socket3' };
127 | const socketId = 'socket2';
128 | expect(getUidFromSocketID(users, socketId)).toEqual('uid2');
129 | });
130 |
131 | it('should return undefined if the socket id is not found', () => {
132 | const users = { 'uid1': 'socket1', 'uid2': 'socket2', 'uid3': 'socket3' };
133 | const socketId = 'socket4';
134 | expect(getUidFromSocketID(users, socketId)).toBeUndefined();
135 | });
136 |
137 | it('should emit the event to all users', () => {
138 | const users = ['socket1', 'socket2', 'socket3'];
139 | const messageType = 'testEvent';
140 | const io2 = {
141 | ...io,
142 | to: vi.fn().mockReturnThis(),
143 | emit: vi.fn()
144 | };
145 | sendMessage(messageType, users, io2);
146 | expect(io2.to).toHaveBeenCalledTimes(3);
147 | expect(io2.to).toHaveBeenCalledWith('socket1');
148 | expect(io2.to).toHaveBeenCalledWith('socket2');
149 | expect(io2.to).toHaveBeenCalledWith('socket3');
150 | expect(io2.emit).toHaveBeenCalledTimes(3);
151 | expect(io2.to('socket1').emit).toHaveBeenCalledWith(messageType);
152 | expect(io2.to('socket2').emit).toHaveBeenCalledWith(messageType);
153 | expect(io2.to('socket3').emit).toHaveBeenCalledWith(messageType);
154 | });
155 |
156 | it('should emit the event with the payload to all users', () => {
157 | const users = ['socket1', 'socket2', 'socket3'];
158 | const messageType = 'testEvent';
159 | const payload = { data: 'testData' };
160 | const io2 = {
161 | ...io,
162 | to: vi.fn().mockReturnThis(),
163 | emit: vi.fn()
164 | };
165 | sendMessage(messageType, users, io2, payload);
166 | expect(io2.to).toHaveBeenCalledTimes(3);
167 | expect(io2.to).toHaveBeenCalledWith('socket1');
168 | expect(io2.to).toHaveBeenCalledWith('socket2');
169 | expect(io2.to).toHaveBeenCalledWith('socket3');
170 | expect(io2.emit).toHaveBeenCalledTimes(3);
171 | expect(io2.to('socket1').emit).toHaveBeenCalledWith(messageType, payload);
172 | expect(io2.to('socket2').emit).toHaveBeenCalledWith(messageType, payload);
173 | expect(io2.to('socket3').emit).toHaveBeenCalledWith(messageType, payload);
174 | })
175 | });
176 |
177 | describe('startListeners', () => {
178 | let ioMock = {
179 | ...io,
180 |
181 | };
182 |
183 | let socketMock = {
184 | ...serverSocket,
185 | id: 'socket-id',
186 |
187 | };
188 |
189 | let socketUsersMock: user = {
190 | 'user1': 'Alice',
191 | };
192 |
193 | beforeEach(() => {
194 | vi.clearAllMocks();
195 | ioMock = {
196 | ...io,
197 | on: vi.fn(),
198 | emit: vi.fn(),
199 | join: vi.fn(),
200 | leave: vi.fn(),
201 | to: vi.fn(),
202 | nsp: {
203 | to: vi.fn(),
204 | },
205 | };
206 |
207 | socketMock = {
208 | ...serverSocket,
209 | id: 'socket-id',
210 | on: vi.fn(),
211 | emit: vi.fn(),
212 | join: vi.fn(),
213 | leave: vi.fn(),
214 | to: vi.fn(),
215 | nsp: {
216 | to: vi.fn(),
217 | },
218 | };
219 |
220 | socketUsersMock = {
221 | 'user1': 'Alice',
222 | };
223 | });
224 |
225 | it('should set up handshake and disconnect listeners on the socket', () => {
226 | startListeners(ioMock, socketMock, socketUsersMock);
227 | expect(socketMock.on).toHaveBeenCalledWith('handshake', expect.any(Function));
228 | expect(socketMock.on).toHaveBeenCalledWith('disconnect', expect.any(Function));
229 | expect(socketMock.on).toHaveBeenCalledWith('create_room', expect.any(Function));
230 | expect(socketMock.on).toHaveBeenCalledWith('delete_room', expect.any(Function));
231 | expect(socketMock.on).toHaveBeenCalledWith('get_rooms', expect.any(Function));
232 | expect(socketMock.on).toHaveBeenCalledWith('join_room', expect.any(Function));
233 | expect(socketMock.on).toHaveBeenCalledWith('leave_room', expect.any(Function));
234 | expect(socketMock.on).toHaveBeenCalledWith('request_start_game', expect.any(Function));
235 | expect(socketMock.on).toHaveBeenCalledWith('update_turn', expect.any(Function));
236 | expect(socketMock.on).toHaveBeenCalledWith('request_update_score', expect.any(Function));
237 | expect(socketMock.on).toHaveBeenCalledWith('request_reset_score', expect.any(Function));
238 | expect(socketMock.on).toHaveBeenCalledWith('send_black_card', expect.any(Function));
239 | expect(socketMock.on).toHaveBeenCalledWith('send_white_card', expect.any(Function));
240 | expect(socketMock.on).toHaveBeenCalledWith('reset_white', expect.any(Function));
241 | expect(socketMock.on).toHaveBeenCalledWith('reset_turn', expect.any(Function));
242 | expect(socketMock.on).toHaveBeenCalledTimes(15);
243 | });
244 |
245 | it('should handle handshake event for reconnected socket', () => {
246 | const uid = 'user1';
247 | socketUsersMock[uid] = socketMock.id;
248 | const callbackMock = vi.fn();
249 | startListeners(ioMock, socketMock, socketUsersMock);
250 |
251 | // Trigger handshake event
252 | const [eventName, eventHandler] = socketMock.on.mock.calls[0];
253 | eventHandler(callbackMock);
254 |
255 | expect(callbackMock).toHaveBeenCalledTimes(1);
256 | expect(callbackMock).toHaveBeenCalledWith(uid, [socketMock.id]);
257 | expect(socketMock.emit).toHaveBeenCalledTimes(0);
258 | });
259 |
260 | it('should handle disconnect event', () => {
261 | const uid = 'user1';
262 | socketUsersMock[uid] = socketMock.id;
263 | startListeners(ioMock, socketMock, socketUsersMock);
264 |
265 | const [eventName, eventHandler] = socketMock.on.mock.calls[1];
266 | eventHandler();
267 | expect(socketUsersMock).not.toHaveProperty(uid);
268 | expect(socketMock.emit).toHaveBeenCalledTimes(0);
269 | });
270 |
271 | it('should handle create_room event', () => {
272 | const uid = 'user1';
273 | socketUsersMock[uid] = socketMock.id;
274 | startListeners(ioMock, socketMock, socketUsersMock);
275 | const callbackMock = vi.fn();
276 | const roomName = 'test-room';
277 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
278 | eventHandler(roomName, callbackMock);
279 | expect(socketMock.join).toHaveBeenCalledTimes(1);
280 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
281 | expect(callbackMock).toHaveBeenCalledTimes(1);
282 | expect(callbackMock).toHaveBeenCalledWith({
283 | "data": {
284 | "roomName": "room_test-room",
285 | "users": "[]",
286 | },
287 | "success": true,
288 | });
289 | });
290 |
291 | it('should handle delete_room event', () => {
292 | const uid = 'user1';
293 | socketUsersMock[uid] = socketMock.id;
294 | startListeners(ioMock, socketMock, socketUsersMock);
295 | const callbackMock = vi.fn();
296 | const roomName = 'delete_room';
297 | const [eventName, eventHandler] = socketMock.on.mock.calls[3];
298 | eventHandler(roomName, callbackMock);
299 | expect(callbackMock).toHaveBeenCalledTimes(1);
300 | expect(callbackMock).toHaveBeenCalledWith({
301 | "data": {},
302 | "success": true,
303 | });
304 | });
305 |
306 | it('should handle get_rooms event', () => {
307 | const uid = 'user1';
308 | socketUsersMock[uid] = socketMock.id;
309 | startListeners(ioMock, socketMock, socketUsersMock);
310 | const callbackMock = vi.fn();
311 | const [eventName, eventHandler] = socketMock.on.mock.calls[5];
312 | eventHandler(callbackMock);
313 | expect(callbackMock).toHaveBeenCalledTimes(0);
314 | });
315 |
316 | it('should handle join_room/leave_room event', () => {
317 | const uid = 'user1';
318 | socketUsersMock[uid] = socketMock.id;
319 | startListeners(ioMock, socketMock, socketUsersMock);
320 | const callbackMock = vi.fn();
321 | const roomName = 'test-room';
322 | const [eventName, eventHandler] = socketMock.on.mock.calls[6];
323 | const [eventCreate, createHandler] = socketMock.on.mock.calls[2];
324 | const [eventLeave, leaveHandler] = socketMock.on.mock.calls[7];
325 | createHandler(roomName, callbackMock);
326 | expect(socketMock.join).toHaveBeenCalledTimes(1);
327 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
328 | expect(callbackMock).toHaveBeenCalledWith({
329 | "data": {
330 | "roomName": "room_test-room",
331 | "users": "[]",
332 | },
333 | "success": true,
334 | });
335 | socketUsersMock[uid] = socketMock.id;
336 | eventHandler(roomName, callbackMock, callbackMock);
337 | expect(socketMock.join).toHaveBeenCalledTimes(1);
338 | expect(callbackMock).toHaveBeenCalledTimes(2);
339 | leaveHandler(roomName, callbackMock)
340 | expect(callbackMock).toHaveBeenCalledWith({
341 | "data": {},
342 | "success": true,
343 | });
344 | });
345 |
346 |
347 | it('should trigger game actions', () => {
348 | console.log("THIS")
349 | startListeners(ioMock, socketMock, socketUsersMock);
350 | const uid = 'user1';
351 | socketUsersMock[uid] = socketMock.id;
352 | const socketIds = ['socket1', 'socket2', 'socket3', 'socket4'];
353 | const callbackMock = vi.fn();
354 | const roomName = 'room_test-room';
355 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
356 | const [create, createRoomHandler] = socketMock.on.mock.calls[2];
357 | const [join, joinHandler] = socketMock.on.mock.calls[5];
358 | const [start, startHandler] = socketMock.on.mock.calls[8];
359 | createRoomHandler(roomName, callbackMock, callbackMock,);
360 | joinHandler(roomName, callbackMock, callbackMock);
361 | joinHandler(roomName, callbackMock, callbackMock);
362 | joinHandler(roomName, callbackMock, callbackMock);
363 | startHandler(roomName, callbackMock, callbackMock)
364 | expect(ioMock.to).toHaveBeenCalledTimes(0);
365 |
366 | expect(ioMock.nsp.to).toHaveBeenCalledTimes(0);
367 |
368 | expect(callbackMock).toHaveBeenCalledTimes(5);
369 | expect(callbackMock).toHaveBeenCalledWith({
370 | success: true,
371 | data: {
372 | "room_test-room": [
373 | "socket1",
374 | "socket2",
375 | "socket3",
376 | "socket4",
377 | ],
378 | },
379 | });
380 | });
381 |
382 | it('should return a failure response if the room does not exist', () => {
383 | startListeners(ioMock, socketMock, socketUsersMock);
384 | const callbackMock = vi.fn();
385 | const roomName = 'test-room';
386 | const [start, startHandler] = socketMock.on.mock.calls[8];
387 | ioMock.sockets.adapter.rooms = new Map();
388 | startHandler(roomName, callbackMock, callbackMock)
389 | expect(ioMock.to).not.toHaveBeenCalled();
390 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
391 | expect(callbackMock).toHaveBeenCalledTimes(0);
392 | });
393 |
394 | it('should return a failure response if the room has less than 3 players', () => {
395 | startListeners(ioMock, socketMock, socketUsersMock);
396 | const socketIds = ['socket1', 'socket2'];
397 | const callbackMock = vi.fn();
398 | const roomName = 'test-room';
399 | const [start, startHandler] = socketMock.on.mock.calls[8];
400 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
401 | startHandler(roomName, callbackMock, callbackMock)
402 | expect(ioMock.to).not.toHaveBeenCalled();
403 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
404 | expect(callbackMock).toHaveBeenCalledTimes(1);
405 | expect(callbackMock).toHaveBeenCalledWith({
406 | success: false,
407 | });
408 | });
409 |
410 | it('should update score', () => {
411 | startListeners(ioMock, socketMock, socketUsersMock);
412 | const socketIds = ['socket1', 'socket2'];
413 | const callbackMock = vi.fn();
414 | const roomName = 'test-room';
415 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
416 | eventHandler(roomName, callbackMock);
417 | expect(socketMock.join).toHaveBeenCalledTimes(1);
418 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
419 | expect(callbackMock).toHaveBeenCalledTimes(1);
420 | const [start, updateHandler] = socketMock.on.mock.calls[9];
421 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
422 | updateHandler('room_' + roomName, new Map(), callbackMock, callbackMock)
423 | expect(ioMock.to).not.toHaveBeenCalled();
424 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
425 | expect(callbackMock).toHaveBeenCalledTimes(1);
426 | });
427 |
428 | it('should reset score', () => {
429 | startListeners(ioMock, socketMock, socketUsersMock);
430 | const socketIds = ['socket1', 'socket2'];
431 | const callbackMock = vi.fn();
432 | const roomName = 'test-room';
433 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
434 | eventHandler(roomName, callbackMock);
435 | expect(socketMock.join).toHaveBeenCalledTimes(1);
436 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
437 | expect(callbackMock).toHaveBeenCalledTimes(1);
438 | const [start, updateHandler] = socketMock.on.mock.calls[10];
439 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
440 | updateHandler('room_' + roomName, callbackMock, callbackMock)
441 | expect(ioMock.to).not.toHaveBeenCalled();
442 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
443 | expect(callbackMock).toHaveBeenCalledTimes(1);
444 | });
445 |
446 | it('should send black card', () => {
447 | startListeners(ioMock, socketMock, socketUsersMock);
448 | const socketIds = ['socket1', 'socket2'];
449 | const callbackMock = vi.fn();
450 | const roomName = 'test-room';
451 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
452 | eventHandler(roomName, callbackMock);
453 | expect(socketMock.join).toHaveBeenCalledTimes(1);
454 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
455 | expect(callbackMock).toHaveBeenCalledTimes(1);
456 | const [start, updateHandler] = socketMock.on.mock.calls[11];
457 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
458 | updateHandler("test-card", roomName, 'socket1', callbackMock, callbackMock)
459 | expect(ioMock.to).not.toHaveBeenCalled();
460 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
461 | expect(callbackMock).toHaveBeenCalledTimes(2);
462 | });
463 |
464 | it('should send white cards', () => {
465 | startListeners(ioMock, socketMock, socketUsersMock);
466 | const socketIds = ['socket1', 'socket2'];
467 | const callbackMock = vi.fn();
468 | const roomName = 'test-room';
469 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
470 | eventHandler(roomName, callbackMock);
471 | expect(socketMock.join).toHaveBeenCalledTimes(1);
472 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
473 | expect(callbackMock).toHaveBeenCalledTimes(1);
474 | const [start, updateHandler] = socketMock.on.mock.calls[12];
475 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
476 | updateHandler("test-card", roomName, 'socket1', callbackMock, callbackMock)
477 | expect(ioMock.to).not.toHaveBeenCalled();
478 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
479 | expect(callbackMock).toHaveBeenCalledTimes(2);
480 | });
481 |
482 | it('should reset white cards', () => {
483 | startListeners(ioMock, socketMock, socketUsersMock);
484 | const socketIds = ['socket1', 'socket2'];
485 | const callbackMock = vi.fn();
486 | const roomName = 'test-room';
487 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
488 | eventHandler(roomName, callbackMock);
489 | expect(socketMock.join).toHaveBeenCalledTimes(1);
490 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
491 | expect(callbackMock).toHaveBeenCalledTimes(1);
492 | const [start, updateHandler] = socketMock.on.mock.calls[13];
493 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
494 | updateHandler('socket1', callbackMock, callbackMock)
495 | expect(ioMock.to).not.toHaveBeenCalled();
496 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
497 | expect(callbackMock).toHaveBeenCalledTimes(2);
498 | });
499 |
500 | it('should reset turn', () => {
501 | startListeners(ioMock, socketMock, socketUsersMock);
502 | const socketIds = ['socket1', 'socket2'];
503 | const callbackMock = vi.fn();
504 | const roomName = 'test-room';
505 | const [eventName, eventHandler] = socketMock.on.mock.calls[2];
506 | eventHandler(roomName, callbackMock);
507 | expect(socketMock.join).toHaveBeenCalledTimes(1);
508 | expect(socketMock.join).toHaveBeenCalledWith('room_' + roomName);
509 | expect(callbackMock).toHaveBeenCalledTimes(1);
510 | const [start, updateHandler] = socketMock.on.mock.calls[14];
511 | ioMock.sockets.adapter.rooms = new Map([[roomName, new Set(socketIds)]]);
512 | updateHandler(roomName, true, callbackMock, callbackMock)
513 | expect(ioMock.to).not.toHaveBeenCalled();
514 | expect(ioMock.nsp.to).not.toHaveBeenCalled();
515 | expect(callbackMock).toHaveBeenCalledTimes(2);
516 | expect(callbackMock).toHaveBeenCalledWith({
517 | success: true,
518 | });
519 | });
520 |
521 | })
522 |
--------------------------------------------------------------------------------
/client/src/assets/icon.svg:
--------------------------------------------------------------------------------
1 |
2 |
7 |
--------------------------------------------------------------------------------
66 | {berryImg}
67 | 
68 | 
69 | {jazzImg}
70 | 
71 |