Merge pull request #216 from Arquisoft/E2E-testing

Two new e2e tests working

webapp/e2e/features/normal-game.feature

@@ -0,0 +1,7 @@
+Feature: Playing a normal game
+
+Scenario: Playing a normal game
+  Given A registered user
+  When I click the link to the normal game
+  Then The app enters a normal game
+

webapp/e2e/features/trivia-game.feature

@@ -0,0 +1,7 @@
+Feature: Playing a trivia game
+
+Scenario: Playing a trivia game
+  Given A registered user
+  When I click the link to the trivia game
+  Then The app enters a trivia game
+

webapp/e2e/steps/leaderboard.steps.js

@@ -30,12 +30,10 @@ defineFeature(feature, test => {
 
     let username;
     let password;
-    let id;
 
     given('A registered user', async () => {
       username = "test5"
       password = "test5"
-      id = "normalGame"
       await expect(page).toFill('input[id="Username"]', username);
       await expect(page).toFill('input[id="password"]', password);
       await expect(page).toClick('button', { text: 'Log in' });

webapp/e2e/steps/normal-game.steps.js

@@ -0,0 +1,63 @@
+const puppeteer = require('puppeteer');
+const { defineFeature, loadFeature }=require('jest-cucumber');
+const setDefaultOptions = require('expect-puppeteer').setDefaultOptions
+const feature = loadFeature('./features/normal-game.feature');
+const { registerUser } = require('../utils.js');
+
+let page;
+let browser;
+
+defineFeature(feature, test => {
+
+  beforeAll(async () => {
+    browser = process.env.GITHUB_ACTIONS
+      ? await puppeteer.launch()
+      : await puppeteer.launch({ headless: false, slowMo: 40 });
+    page = await browser.newPage();
+    //Way of setting up the timeout
+    setDefaultOptions({ timeout: 10000 })
+
+    await page
+      .goto("http://localhost:3000", {
+        waitUntil: "networkidle0",
+      })
+      .catch(() => {});
+
+    await registerUser('test6', 'test6@gmail.com', 'test6', page);
+  });
+
+  test('Playing a normal game', ({given,when,then}) => {
+
+    let username;
+    let password;
+
+    given('A registered user', async () => {
+      username = "test6"
+      password = "test6"
+      await expect(page).toFill('input[id="Username"]', username);
+      await expect(page).toFill('input[id="password"]', password);
+      await expect(page).toClick('button', { text: 'Log in' });
+    });
+
+    when('I click the link to the normal game', async () => {
+      await expect(page).toMatchElement("#normalGame", { text: "Normal Game" });
+      await expect(page).toMatchElement("#triviaGame", { text: "Trivia Game" });
+      await expect(page).toClick('#normalGame');
+    });
+
+    then('The app enters a normal game', async () => {
+      await expect(page).toMatchElement("text", { text: "1/10" });
+    });
+  })
+
+  afterEach(async () => {
+    await page.evaluate(() => {
+      localStorage.clear();
+    });
+  });
+
+  afterAll(async ()=>{
+    browser.close()
+  })
+
+});

webapp/e2e/steps/statistics.steps.js

@@ -30,12 +30,10 @@ defineFeature(feature, test => {
 
     let username;
     let password;
-    let id;
 
     given('A registered user', async () => {
       username = "test4"
       password = "test4"
-      id = "normalGame"
       await expect(page).toFill('input[id="Username"]', username);
       await expect(page).toFill('input[id="password"]', password);
       await expect(page).toClick('button', { text: 'Log in' });

webapp/e2e/steps/trivia-game.steps.js

@@ -0,0 +1,63 @@
+const puppeteer = require('puppeteer');
+const { defineFeature, loadFeature }=require('jest-cucumber');
+const setDefaultOptions = require('expect-puppeteer').setDefaultOptions
+const feature = loadFeature('./features/trivia-game.feature');
+const { registerUser } = require('../utils.js');
+
+let page;
+let browser;
+
+defineFeature(feature, test => {
+
+  beforeAll(async () => {
+    browser = process.env.GITHUB_ACTIONS
+      ? await puppeteer.launch()
+      : await puppeteer.launch({ headless: false, slowMo: 40 });
+    page = await browser.newPage();
+    //Way of setting up the timeout
+    setDefaultOptions({ timeout: 10000 })
+
+    await page
+      .goto("http://localhost:3000", {
+        waitUntil: "networkidle0",
+      })
+      .catch(() => {});
+
+    await registerUser('test7', 'test7@gmail.com', 'test7', page);
+  });
+
+  test('Playing a trivia game', ({given,when,then}) => {
+
+    let username;
+    let password;
+
+    given('A registered user', async () => {
+      username = "test7"
+      password = "test7"
+      await expect(page).toFill('input[id="Username"]', username);
+      await expect(page).toFill('input[id="password"]', password);
+      await expect(page).toClick('button', { text: 'Log in' });
+    });
+
+    when('I click the link to the trivia game', async () => {
+      await expect(page).toMatchElement("#normalGame", { text: "Normal Game" });
+      await expect(page).toMatchElement("#triviaGame", { text: "Trivia Game" });
+      await expect(page).toClick('#triviaGame');
+    });
+
+    then('The app enters a trivia game', async () => {
+      await expect(page).toMatchElement("div", { id: "cajaQuesitos" });
+    });
+  })
+
+  afterEach(async () => {
+    await page.evaluate(() => {
+      localStorage.clear();
+    });
+  });
+
+  afterAll(async ()=>{
+    browser.close()
+  })
+
+});

webapp/src/components/Game/Trivia/Cheese.tsx

@@ -11,7 +11,7 @@ export type props = {
 export const Cheese = (props : props) => {
 
   return (
-      <div className="caja-quesitos ">
+      <div id="cajaQuesitos" className="caja-quesitos ">
 
         <div className="caja">
         {props.showBlue && <div data-testid="quesito-azul" className="quesito-azul"></div>}