Skip to content

Commit

Permalink
Merge branch 'dev' into improve-responsiveness
Browse files Browse the repository at this point in the history
  • Loading branch information
carolbgmm committed Apr 29, 2024
2 parents e48559a + df22f5d commit bc3c693
Show file tree
Hide file tree
Showing 11 changed files with 288 additions and 43 deletions.
60 changes: 30 additions & 30 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
Expand Up @@ -5,28 +5,28 @@ on:
types: [published]

jobs:
# unit-tests:
# runs-on: ubuntu-latest
# steps:
# - uses: actions/checkout@v4
# - uses: actions/setup-node@v4
# with:
# node-version: 20
# - run: npm --prefix users/authservice ci
# - run: npm --prefix users/userservice ci
# - run: npm --prefix gatewayservice ci
# - run: npm --prefix webapp ci
# - run: npm --prefix users/authservice test -- --coverage
# - run: npm --prefix users/userservice test -- --coverage
# - run: npm --prefix gatewayservice test -- --coverage
# - run: npm --prefix webapp test -- --coverage
# - name: Analyze with SonarCloud
# uses: sonarsource/sonarcloud-github-action@master
# env:
# GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
# SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
unit-tests:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: 20
- run: npm --prefix users/authservice ci
- run: npm --prefix users/userservice ci
- run: npm --prefix gatewayservice ci
- run: npm --prefix webapp ci
- run: npm --prefix users/authservice test -- --coverage
- run: npm --prefix users/userservice test -- --coverage
- run: npm --prefix gatewayservice test -- --coverage
- run: npm --prefix webapp test -- --coverage
- name: Analyze with SonarCloud
uses: sonarsource/sonarcloud-github-action@master
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
# e2e-tests:
# # needs: [unit-tests]
# needs: [unit-tests]
# runs-on: ubuntu-latest
# steps:
# - uses: actions/checkout@v4
Expand All @@ -38,14 +38,14 @@ jobs:
# - run: npm --prefix gatewayservice install
# - run: npm --prefix webapp install
# - run: npm --prefix webapp run build
#- run: npm --prefix webapp run test:e2e
# - run: npm --prefix webapp run test:e2e
docker-push-webapp:
name: Push webapp Docker Image to GitHub Packages
runs-on: ubuntu-latest
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -69,7 +69,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -87,7 +87,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -105,7 +105,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -123,7 +123,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -141,7 +141,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -162,7 +162,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand All @@ -180,7 +180,7 @@ jobs:
permissions:
contents: read
packages: write
#needs: [e2e-tests]
needs: [unit-tests]
steps:
- uses: actions/checkout@v4
- name: Publish to Registry
Expand Down
10 changes: 10 additions & 0 deletions gatewayservice/monitoring/grafana/Dockerfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
FROM grafana/grafana

# Copying the provisioning files
COPY ./provisioning /etc/grafana/provisioning

# Exposing Grafana server port
EXPOSE 9091

# Running Grafana server
CMD [ "grafana-server" ]
10 changes: 10 additions & 0 deletions gatewayservice/monitoring/prometheus/Dockerfile
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
FROM prom/prometheus

# Copying the configuration file
COPY prometheus.yml /etc/prometheus/prometheus.yml

# Exposing Prometheus server port
EXPOSE 9090

# Running Prometheus
ENTRYPOINT [ "prometheus", "--config.file=/etc/prometheus/prometheus.yml" ]
2 changes: 1 addition & 1 deletion webapp/e2e/jest.config.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
module.exports = {
testMatch: ["**/steps/*.js"],
testTimeout: 30000,
setupFilesAfterEnv: ["expect-puppeteer"]
setupFilesAfterEnv: ["expect-puppeteer"],
}
2 changes: 1 addition & 1 deletion webapp/src/components/game/multiplayer/GameMultiPlayer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ const GameMultiPlayer: FC<GameMultiPlayerProps> = () => {
<>
{stage === 1 && <MenuMultiplayer socket={socket} handleCurrentStage={handleCurrentStage} handlePartyCode={handlePartyCode}/>}
<Container>
{stage === 2 && <LobbyMultiPlayer socket={socket} handleCurrentStage={handleCurrentStage} partyCode={partyCode} users={users}/>}
{stage === 2 && <LobbyMultiPlayer data-testid="lobby-multiplayer" socket={socket} handleCurrentStage={handleCurrentStage} partyCode={partyCode} users={users}/>}
{stage === 3 && <PlayingGame socket={socket} setCurrentStage={handleCurrentStage} questions={questions} partyCode={partyCode}/>}
{stage === 4 && <ScoreboardGame userScoresMultiPlayer={sortedUsersByPoints}/>}
</Container>
Expand Down
50 changes: 50 additions & 0 deletions webapp/src/components/game/multiplayer/JoinParty.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
import React from 'react';
import { render, fireEvent, screen, waitFor } from '@testing-library/react';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import GameMultiPlayer from './GameMultiPlayer';

const mockAxios = new MockAdapter(axios);

describe('Multiplayer Lobby component', () => {

beforeEach(() => {
mockAxios.reset();
});

it('user creates a party', async () => {

const mockResponse = { data: [
{
uuid: '1',
question: '56*54-3',
correctAnswer: '3021',
incorrectAnswer1: '3000',
incorrectAnswer2: '3022',
incorrectAnswer3: '3031',
}
] };
mockAxios.onPost('http://localhost:8000/createGame/en').reply(200, mockResponse);

// Mock local storage
Object.defineProperty(window, 'localStorage', { value: {
getItem: jest.fn((key) => {
return key === 'username' ? 'userForTest' : key === 'score' ? '0' : key === 'uuid' ? '2222' : null;
}),
} });

const multiplayer = render(
<GameMultiPlayer/>
);
// Wait for the Snackbar to be open
await waitFor(() => {
expect(screen.getByTestId("menu-multiplayer")).toBeInTheDocument();
});


fireEvent.click(screen.getByTestId("multiplayer-create-party-button"));

expect(screen.getByTestId("lobby-multiplayer")).toBeInTheDocument();
});

})
13 changes: 7 additions & 6 deletions webapp/src/components/game/multiplayer/LobbyMultiPlayer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,10 @@ interface LobbyMultiPlayerProps {
}

const LobbyMultiPlayer: FC<LobbyMultiPlayerProps> = ({ socket, handleCurrentStage, partyCode, users }) => {

const [isFetched, setFetched] = useState<boolean>(true);

const uuid = localStorage.getItem("uuid");
console.log(uuid);

const { t } = useTranslation();

Expand All @@ -31,6 +31,7 @@ const LobbyMultiPlayer: FC<LobbyMultiPlayerProps> = ({ socket, handleCurrentStag

const lang = localStorage.getItem("lang")
const response = await axios.post(`${apiEndpoint}/createGame/${lang}`, requestData);
console.log(response);

socket.emit('updateQuestions', partyCode, response.data);
setFetched(true);
Expand All @@ -49,13 +50,13 @@ const LobbyMultiPlayer: FC<LobbyMultiPlayerProps> = ({ socket, handleCurrentStag
}

return (
<div className='lobby-container'>
<div className='lobby-container' data-testid="lobby-multiplayer">
<div className='lobby-title-container'>
<h2 className='lobby-title'>{t('lobby_multiplayer_title')}</h2>
<p>{t('lobby_multiplayer_party_code')}<b>{partyCode}</b></p>
</div>
{users.map((player) => (
<div key={player.uuid} className='player-item'>
<div key={player.uuid} className='player-item' data-testid="player-item">
<img src={"https://robohash.org/" + player.username + ".png"} alt={player.uuid} />
<p>{player.username}</p>
{player.isAdmin && <p>{t('lobby_multiplayer_admin')}</p>}
Expand All @@ -64,9 +65,9 @@ const LobbyMultiPlayer: FC<LobbyMultiPlayerProps> = ({ socket, handleCurrentStag
</div>
))}
<div className='button-container'>
<button className="exit-lobby-button" onClick={exitLobby}>{t('lobby_multiplayer_exit')}</button>
{isFetched && isAdmin() && <button className="start-game-button" onClick={fetchQuestions}>{t('lobby_multiplayer_start_game')}</button>}
{isFetched && !isAdmin() && <button className="start-game-button" onClick={fetchQuestions} disabled>{t('lobby_multiplayer_start_game')}</button>}
<button data-testid="exit-lobby-button" className="exit-lobby-button" onClick={exitLobby}>{t('lobby_multiplayer_exit')}</button>
{isFetched && isAdmin() && <button data-testid="start-game-button" className="start-game-button" onClick={fetchQuestions}>{t('lobby_multiplayer_start_game')}</button>}
{isFetched && !isAdmin() && <button data-testid="start-game-button" className="start-game-button" onClick={fetchQuestions} disabled>{t('lobby_multiplayer_start_game')}</button>}
{!isFetched && <button className="start-game-button" disabled>{t('lobby_multiplayer_loading_questions')}</button>}
</div>
</div>
Expand Down
74 changes: 74 additions & 0 deletions webapp/src/components/game/multiplayer/LobbyMultiplayer.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
import React from 'react';
import { render, fireEvent, screen, waitFor } from '@testing-library/react';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import LobbyMultiPlayer from './LobbyMultiPlayer';

// Mock Axios
const mockAxios = new MockAdapter(axios);

describe('LobbyMultiPlayer component', () => {
// Mock props
const mockProps = {
socket: { emit: jest.fn() },
handleCurrentStage: jest.fn(),
partyCode: '123456',
users: [{ uuid: '1', username: 'user1', totalPoints: 0, isAdmin: true }],
};

beforeEach(() => {
mockAxios.reset();
});

it('renders lobby with correct elements', async () => {
const {getAllByTestId} = render(<LobbyMultiPlayer {...mockProps} />);

// Ensure player items are rendered

const players = getAllByTestId("player-item");

// Check if there is one player
expect(players.length).toBeGreaterThan(0);

});

it('clicking exit lobby button calls handleCurrentStage', async () => {
render(<LobbyMultiPlayer {...mockProps} />);

fireEvent.click(screen.getByTestId("exit-lobby-button"));

expect(mockProps.handleCurrentStage).toHaveBeenCalledWith(1);
});

it('clicking start game button emits updateQuestions event', async () => {
const mockResponse = { data: [
{
uuid: '1',
question: '56*54-3',
correctAnswer: '3021',
incorrectAnswer1: '3000',
incorrectAnswer2: '3022',
incorrectAnswer3: '3031',
}
] };
mockAxios.onPost('http://localhost:8000/createGame/en').reply(200, mockResponse);
Object.defineProperty(window, 'localStorage', { value: {
getItem: jest.fn((key) => {
return key === 'uuid' ? "1" : key === 'lang' ? "en" : null;
}),
} });

render(<LobbyMultiPlayer {...mockProps} />);

await waitFor(() => {
expect(screen.getByTestId("start-game-button")).toBeInTheDocument();
});

fireEvent.click(screen.getByTestId("start-game-button"));

await waitFor(() => {
expect(mockProps.socket.emit).toHaveBeenCalledWith('updateQuestions', '123456', expect.any(Object));
});
});

});
46 changes: 46 additions & 0 deletions webapp/src/components/game/multiplayer/MenuMultiplayer.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import React from 'react';
import { render, fireEvent, screen, waitFor } from '@testing-library/react';
import MenuMultiplayer from './MenuMultiplayer';

describe('MenuMultiplayer component', () => {
// Mock props
const mockProps = {
socket: { emit: jest.fn() },
handleCurrentStage: jest.fn(),
handlePartyCode: jest.fn(),
};

beforeEach(() => {
jest.clearAllMocks();
localStorage.clear();
});

it('renders menu with correct elements', () => {
render(<MenuMultiplayer {...mockProps} />);

// Ensure header and buttons are rendered
expect(screen.getByTestId("title-menu-multiplayer")).toBeInTheDocument();
expect(screen.getByTestId("multiplayer-create-party-button")).toBeInTheDocument();
expect(screen.getByTestId("multiplayer-join-party-code")).toBeInTheDocument();
expect(screen.getByTestId("multiplayer-join-party-button" )).toBeInTheDocument();
});

it('calls createParty function when create party button is clicked', () => {
render(<MenuMultiplayer {...mockProps} />);

fireEvent.click(screen.getByTestId('multiplayer-create-party-button'));

expect(mockProps.handleCurrentStage).toHaveBeenCalledWith(2);
expect(mockProps.socket.emit).toHaveBeenCalledWith('createParty', expect.any(Object));
});

it('calls joinParty function with typed code when join party button is clicked', () => {
render(<MenuMultiplayer {...mockProps} />);

fireEvent.change(screen.getByTestId('multiplayer-join-party-code'), { target: { value: '123456' } });
fireEvent.click(screen.getByTestId('multiplayer-join-party-button'));

expect(mockProps.handlePartyCode).toHaveBeenCalledWith('123456');
expect(mockProps.socket.emit).toHaveBeenCalledWith('joinParty', '123456', expect.any(Object));
});
});
Loading

0 comments on commit bc3c693

Please sign in to comment.