diff --git a/webapp/e2e/features/playGame.feature b/webapp/e2e/features/playGame.feature new file mode 100644 index 00000000..674842b8 --- /dev/null +++ b/webapp/e2e/features/playGame.feature @@ -0,0 +1,6 @@ +Feature: Playing classic game with default settings + +Scenario: The user plays a game with default settings + Given A logged user + When I play with configured settings(2 questions 2 answers) + Then 2 questions with 2 answers are asked \ No newline at end of file diff --git a/webapp/e2e/jest.config.js b/webapp/e2e/jest.config.js index db3be3d9..6e9de153 100644 --- a/webapp/e2e/jest.config.js +++ b/webapp/e2e/jest.config.js @@ -1,5 +1,5 @@ module.exports = { testMatch: ["**/steps/*.js"], - testTimeout: 30000, + testTimeout: 40000, setupFilesAfterEnv: ["expect-puppeteer"] } \ No newline at end of file diff --git a/webapp/e2e/steps/playGame.steps.js b/webapp/e2e/steps/playGame.steps.js new file mode 100644 index 00000000..105d7e45 --- /dev/null +++ b/webapp/e2e/steps/playGame.steps.js @@ -0,0 +1,77 @@ +const puppeteer = require('puppeteer'); +const { defineFeature, loadFeature }=require('jest-cucumber'); +const setDefaultOptions = require('expect-puppeteer').setDefaultOptions +const feature = loadFeature('./features/playGame.feature'); + +let page; +let browser; + +defineFeature(feature, test => { + + beforeAll(async () => { + browser = process.env.GITHUB_ACTIONS + ? await puppeteer.launch() + : await puppeteer.launch({ headless: false, slowMo: 100 }); + page = await browser.newPage(); + //Way of setting up the timeout + setDefaultOptions({ timeout: 10000 }) + + await page + .goto("http://localhost:3000", { + waitUntil: "networkidle0", + }) + .catch(() => {}); + }); + + test('The user plays a game with default settings', ({given,when,then}) => { + + given('A logged user', async () => { + await login(page); + }); + + when('I play with configured settings(2 questions 2 answers)', async () => { + await expect(page).toClick('button', { text: 'Clásico' }) + //await expect(page).toClick('button', {text: "-"}) + for(let i = 0; i < 7; i++){ + const button = await page.$(`#questionsSpinner-`); + button.click(); + //await expect(page).toClick('button', { id: 'questionsSpinner-' }) + } + + const button = await page.$(`#questionsSpinner-`); + await button.click(); + + await expect(page).toClick('button', { text: 'Comenzar Juego' }) + }); + + then('2 questions with 2 answers are asked', async () => { + for(let i = 0; i < 2; i++){//Dos preguntas + await expect(page).toMatchElement("div", { class: "questionStructure" });//Comprobamos que existe el div de la pregunta + + const button = await page.$(`#option-1`);//Comprobamos que existe la segunda opción + expect(button).not.toBeNull(); + + const noButton = await page.$(`#option-2`);//Comprobamos que no existe una tercera opción + expect(noButton).toBeNull(); + button.click();//Respondemos la segunda opción + + await new Promise((resolve) => setTimeout(resolve, 2100)); //Esperar a que se muestre la pregunta + } + + await expect(page).toMatchElement("h2", { text: "Modos de juego:" });//Volvemos al menú*/ + }); + }) + + afterAll(async ()=>{ + browser.close() + }) + +}); + +async function login(page) { + username = "pablo" + password = "pabloasw" + await expect(page).toFill('input[name="username"]', username); + await expect(page).toFill('input[name="password"]', password); + await expect(page).toClick('button', { text: 'Iniciar sesión' }) + } \ No newline at end of file diff --git a/webapp/e2e/steps/util/Util.js b/webapp/e2e/steps/util/Util.js new file mode 100644 index 00000000..3f922721 --- /dev/null +++ b/webapp/e2e/steps/util/Util.js @@ -0,0 +1,9 @@ +async function login(page) { + username = "pablo" + password = "pabloasw" + await expect(page).toFill('input[name="username"]', username); + await expect(page).toFill('input[name="password"]', password); + await expect(page).toClick('button', { text: 'Iniciar sesión' }) +} + +export default {login}; \ No newline at end of file diff --git a/webapp/src/components/game/GameConfiguration.css b/webapp/src/components/game/GameConfiguration.css index 67bf8f67..6489e15a 100644 --- a/webapp/src/components/game/GameConfiguration.css +++ b/webapp/src/components/game/GameConfiguration.css @@ -101,4 +101,8 @@ #numPreguntas{ width: 2rem; + } + + #config .border{ + margin-bottom: 10rem; } \ No newline at end of file diff --git a/webapp/src/components/game/GameConfiguration.js b/webapp/src/components/game/GameConfiguration.js index 5a2d88b8..4d262416 100644 --- a/webapp/src/components/game/GameConfiguration.js +++ b/webapp/src/components/game/GameConfiguration.js @@ -99,7 +99,7 @@ const GameConfiguration = () => { return ( <>