From dd647c7dd8acf47b2f26c83fcd18c1fa7da0cadf Mon Sep 17 00:00:00 2001 From: uo287841 Date: Mon, 8 Apr 2024 01:02:04 +0200 Subject: [PATCH 1/4] register 2e2 test --- webapp/e2e/features/register-form.feature | 2 +- webapp/e2e/steps/register-form.steps.js | 33 ++++++++++++++++++----- webapp/src/components/AddUser.jsx | 2 +- 3 files changed, 28 insertions(+), 9 deletions(-) diff --git a/webapp/e2e/features/register-form.feature b/webapp/e2e/features/register-form.feature index aad790a..ebce3d4 100644 --- a/webapp/e2e/features/register-form.feature +++ b/webapp/e2e/features/register-form.feature @@ -3,4 +3,4 @@ Feature: Registering a new user Scenario: The user is not registered in the site Given An unregistered user When I fill the data in the form and press submit - Then A confirmation message should be shown in the screen \ No newline at end of file + Then is taken to login diff --git a/webapp/e2e/steps/register-form.steps.js b/webapp/e2e/steps/register-form.steps.js index 172e196..d949ad4 100644 --- a/webapp/e2e/steps/register-form.steps.js +++ b/webapp/e2e/steps/register-form.steps.js @@ -3,6 +3,10 @@ const { defineFeature, loadFeature }=require('jest-cucumber'); const setDefaultOptions = require('expect-puppeteer').setDefaultOptions const feature = loadFeature('./features/register-form.feature'); +const axios = require('axios'); +const MockAdapter = require('axios-mock-adapter'); +const mockAxios = new MockAdapter(axios); + let page; let browser; @@ -11,7 +15,7 @@ defineFeature(feature, test => { beforeAll(async () => { browser = process.env.GITHUB_ACTIONS ? await puppeteer.launch() - : await puppeteer.launch({ headless: false, slowMo: 100 }); + : await puppeteer.launch({ headless: false, slowMo:5 }); page = await browser.newPage(); //Way of setting up the timeout setDefaultOptions({ timeout: 10000 }) @@ -21,27 +25,42 @@ defineFeature(feature, test => { waitUntil: "networkidle0", }) .catch(() => {}); + + + }); + + beforeEach(async () => { + // Reset any state or actions before each test + await page.reload({ waitUntil: 'networkidle0' }); }); test('The user is not registered in the site', ({given,when,then}) => { let username; let password; + let email given('An unregistered user', async () => { - username = "pablo" - password = "pabloasw" - await expect(page).toClick("button", { text: "Don't have an account? Register here." }); + username = "t1" + email = "t1email" + password = "t1pass" + + await expect(page).toClick("button", { text: "Create account" }); }); when('I fill the data in the form and press submit', async () => { await expect(page).toFill('input[name="username"]', username); + await expect(page).toFill('input[name="email"]', email); await expect(page).toFill('input[name="password"]', password); - await expect(page).toClick('button', { text: 'Add User' }) + await expect(page).toFill('input[name="cpassword"]', password); + + mockAxios.onPost('http://localhost:8000/adduser').reply(200, { username: "t1", email: "t1email", password: "t1pass" }); + + await expect(page).toClick('button', { text: 'Register' }) }); - then('A confirmation message should be shown in the screen', async () => { - await expect(page).toMatchElement("div", { text: "User added successfully" }); + then('is taken to login', async () => { + await expect(page).toMatchElement("div", { text: "Login" }); }); }) diff --git a/webapp/src/components/AddUser.jsx b/webapp/src/components/AddUser.jsx index 1e7225c..a464500 100644 --- a/webapp/src/components/AddUser.jsx +++ b/webapp/src/components/AddUser.jsx @@ -70,7 +70,7 @@ const AddUser = () => { onChange={(e) => setPassword(e.target.value)} /> Date: Mon, 8 Apr 2024 02:08:02 +0200 Subject: [PATCH 2/4] e2e login and register --- webapp/e2e/features/login-form.feature | 6 +++ webapp/e2e/steps/login-form.steps.js | 71 +++++++++++++++++++++++++ webapp/e2e/steps/register-form.steps.js | 4 +- webapp/src/components/Login.jsx | 2 + 4 files changed, 82 insertions(+), 1 deletion(-) create mode 100644 webapp/e2e/features/login-form.feature create mode 100644 webapp/e2e/steps/login-form.steps.js diff --git a/webapp/e2e/features/login-form.feature b/webapp/e2e/features/login-form.feature new file mode 100644 index 0000000..0060f6f --- /dev/null +++ b/webapp/e2e/features/login-form.feature @@ -0,0 +1,6 @@ +Feature: Registering a new user + +Scenario: The user is registered in the site + Given A registered user + When I fill the data in the form and press submit + Then is logged \ No newline at end of file diff --git a/webapp/e2e/steps/login-form.steps.js b/webapp/e2e/steps/login-form.steps.js new file mode 100644 index 0000000..0f30b9f --- /dev/null +++ b/webapp/e2e/steps/login-form.steps.js @@ -0,0 +1,71 @@ +const puppeteer = require('puppeteer'); +const { defineFeature, loadFeature }=require('jest-cucumber'); +const setDefaultOptions = require('expect-puppeteer').setDefaultOptions +const feature = loadFeature('./features/login-form.feature'); + +const axios = require('axios'); +const MockAdapter = require('axios-mock-adapter'); +const mockAxios = new MockAdapter(axios); + +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(() => {}); + + + }); + + beforeEach(async () => { + // Reset any state or actions before each test + await page.reload({ waitUntil: 'networkidle0' }); + }); + + test('The user is registered in the site', ({given,when,then}) => { + + let username; + let password; + let email + + given('A registered user', async () => { + username = "t1" + password = "t1pass" + + await expect(page).toClick("button", { text: "Create account" }); + }); + + when('I fill the data in the form and press submit', async () => { + await expect(page).toClick('a', { text: 'Already have an account? Log in here.' }); + + await expect(page).toFill('input[name="username"]', username); + await expect(page).toFill('input[name="password"]', password); + + mockAxios.onPost('http://localhost:8000/login').reply(200, { username:"t1",email:"t1email",createdAt: '2024-01-01T12:34:56Z',token: 'testToken'}); + + + await expect(page).toClick('button', { text: 'Login' }) + }); + + then('is logged', async () => { + await expect(page).toMatchElement("div", { text: "Welcome back, " + username + "!" }); + }); + }) + + afterAll(async ()=>{ + browser.close() + }) + + }); \ No newline at end of file diff --git a/webapp/e2e/steps/register-form.steps.js b/webapp/e2e/steps/register-form.steps.js index d949ad4..2118382 100644 --- a/webapp/e2e/steps/register-form.steps.js +++ b/webapp/e2e/steps/register-form.steps.js @@ -54,7 +54,9 @@ defineFeature(feature, test => { await expect(page).toFill('input[name="password"]', password); await expect(page).toFill('input[name="cpassword"]', password); - mockAxios.onPost('http://localhost:8000/adduser').reply(200, { username: "t1", email: "t1email", password: "t1pass" }); + // mockAxios.onPost('http://localhost:8000/adduser').reply(200, { username: "t1", email: "t1email", password: "t1pass" }); + mockAxios.onPost('http://localhost:8000/adduser').reply(200, { username:"t1",email:"t1email",password: 't1pass'}); + await expect(page).toClick('button', { text: 'Register' }) }); diff --git a/webapp/src/components/Login.jsx b/webapp/src/components/Login.jsx index 4c73cbe..d1d7132 100644 --- a/webapp/src/components/Login.jsx +++ b/webapp/src/components/Login.jsx @@ -66,6 +66,7 @@ const Login = () => { Login { onChange={(e) => setUsername(e.target.value)} /> Date: Mon, 8 Apr 2024 02:30:51 +0200 Subject: [PATCH 3/4] question.test new test --- webapp/src/components/Question.test.js | 27 +++++++++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git a/webapp/src/components/Question.test.js b/webapp/src/components/Question.test.js index dd59304..8dff1c0 100644 --- a/webapp/src/components/Question.test.js +++ b/webapp/src/components/Question.test.js @@ -38,4 +38,29 @@ describe('Question page', () => { imgs = screen.getAllByRole("button") expect(imgs.length).toBe(4) }); -}); \ No newline at end of file + + + it('should render a flags question if category is foods', async () => { + useAuthUser.mockReturnValue({ username: 'testUser' }); + + mockAxios.onGet('http://localhost:8000/imgs/foods/question').reply(200, + { + question: "Which of the following images corresponds to Tortilla?", + images:["TortillaImage","PaellaImage","CachopoImage","ChocoImage"] + }); + + render(); + + await waitFor(() => { + expect(screen.getByText(/Which of the following images corresponds to/i)).toBeInTheDocument(); + expect(screen.getByText(/Score/i)).toBeInTheDocument(); + }); + + let imgs = [] + imgs = screen.getAllByRole("button") + expect(imgs.length).toBe(4) + }); +}); + + + From 1a5e8440c5ae0d4656e547a389511ebba5034f42 Mon Sep 17 00:00:00 2001 From: uo287841 Date: Mon, 8 Apr 2024 02:31:53 +0200 Subject: [PATCH 4/4] new tets --- webapp/src/components/Question.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/components/Question.test.js b/webapp/src/components/Question.test.js index 8dff1c0..b7657c7 100644 --- a/webapp/src/components/Question.test.js +++ b/webapp/src/components/Question.test.js @@ -31,7 +31,7 @@ describe('Question page', () => { await waitFor(() => { expect(screen.getByText(/Which of the following flags belongs to/i)).toBeInTheDocument(); - expect(screen.getByText(/Score/i)).toBeInTheDocument(); + expect(screen.getByText(/Score/i)).toBeInTheDocument(); }); let imgs = []