Skip to content

Commit

Permalink
E2E Testing + Coverage tests
Browse files Browse the repository at this point in the history
New Test in question and e2e tests
  • Loading branch information
andrrsin authored Apr 8, 2024
2 parents 20088f5 + 443054b commit 90f732c
Show file tree
Hide file tree
Showing 7 changed files with 135 additions and 10 deletions.
6 changes: 6 additions & 0 deletions webapp/e2e/features/login-form.feature
Original file line number Diff line number Diff line change
@@ -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
2 changes: 1 addition & 1 deletion webapp/e2e/features/register-form.feature
Original file line number Diff line number Diff line change
Expand Up @@ -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
Then is taken to login
71 changes: 71 additions & 0 deletions webapp/e2e/steps/login-form.steps.js
Original file line number Diff line number Diff line change
@@ -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()
})

});
35 changes: 28 additions & 7 deletions webapp/e2e/steps/register-form.steps.js
Original file line number Diff line number Diff line change
Expand Up @@ -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;

Expand All @@ -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 })
Expand All @@ -21,27 +25,44 @@ 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" });
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" });
});
})

Expand Down
2 changes: 1 addition & 1 deletion webapp/src/components/AddUser.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ const AddUser = () => {
onChange={(e) => setPassword(e.target.value)}
/>
<TextField
name="password"
name="cpassword"

margin="normal"
fullWidth
Expand Down
2 changes: 2 additions & 0 deletions webapp/src/components/Login.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,13 +66,15 @@ const Login = () => {
Login
</Typography>
<TextField
name = "username"
margin="normal"
fullWidth
label="Username"
value={username}
onChange={(e) => setUsername(e.target.value)}
/>
<TextField
name = "password"
margin="normal"
fullWidth
label="Password"
Expand Down
27 changes: 26 additions & 1 deletion webapp/src/components/Question.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,36 @@ describe('Question page', () => {

await waitFor(() => {
expect(screen.getByText(/Which of the following flags belongs to/i)).toBeInTheDocument();
expect(screen.getByText(/Score/i)).toBeInTheDocument();
});

let imgs = []
imgs = screen.getAllByRole("button")
expect(imgs.length).toBe(4)
});


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(<Question type="imgs" category="foods"/>);

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)
});
});
});



0 comments on commit 90f732c

Please sign in to comment.