Skip to content

Commit

Permalink
test: added more e2e tests in playwright
Browse files Browse the repository at this point in the history
  • Loading branch information
ThomasWhittington committed Dec 12, 2024
1 parent 45e1afb commit 651c570
Show file tree
Hide file tree
Showing 16 changed files with 507 additions and 168 deletions.
8 changes: 7 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,12 +67,18 @@ This will pull in the exclusions such as the .cshtml files and will replicate co
End to end tests are ran using [Playwright](https://playwright.dev/).

To run the tests, run the following commands:
- Add some environment variables
```
WEBAPP_URL={URL OF THE HOME PAGE}
AUTH_SECRET={PASSWORD FOR ENVIRONMENT}
DOMAIN={DOMAIN FOR COOKIE TO BE ADDED TO (when local: localhost)}
```
- Run the local web app.
- Navigate to the correct folder, be it:
- ``cd tests/Dfe.EarlyYearsQualification.E2ETests/playwright`` for the E2E tests.
- ``cd tests/Dfe.EarlyYearsQualification.SmokeTests/playwright`` for the smoke tests.
- Tell Node Version Manager that you want the latest version with: ``nvm use node --lts``
- Run the tests with: ``npx playwright test``
- Run the tests with: ``npx playwright test`` (add --ui to run the tests in playwrights UI)

### Problems with Safari?
If you notice you are having issues with running Safari tests locally and them failing then there is a fix.
Expand Down
3 changes: 3 additions & 0 deletions tests/Dfe.EarlyYearsQualification.E2ETests/playwright/.env
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
WEBAPP_URL={URL OF THE HOME PAGE}
AUTH_SECRET={PASSWORD FOR ENVIRONMENT}
DOMAIN={DOMAIN FOR COOKIE TO BE ADDED TO (when local: localhost)}

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"description": "",
"devDependencies": {
"@playwright/test": "^1.49.0",
"@types/node": "^22.10.1"
"@types/node": "^22.10.1",
"dotenv": "^16.4.7"
}
}
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { defineConfig, devices } from '@playwright/test';
import {defineConfig, devices} from '@playwright/test';

/**
* Read environment variables from file.
Expand All @@ -11,69 +11,71 @@ import { defineConfig, devices } from '@playwright/test';
/**
* See https://playwright.dev/docs/test-configuration.
*/
require('dotenv').config();
export default defineConfig({
testDir: './tests',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: process.env.WEBAPP_URL,
testDir: './tests',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: process.env.WEBAPP_URL,

/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},

/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},

{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: {...devices['Desktop Chrome']},
},

{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
/*
{
name: 'firefox',
use: {...devices['Desktop Firefox']},
},
{
name: 'webkit',
use: {...devices['Desktop Safari']},
},
*/
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },

/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],

/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
/* Run your local dev server before starting the tests */
// webServer: {
// command: 'npm run start',
// url: 'http://127.0.0.1:3000',
// reuseExistingServer: !process.env.CI,
// },
],

/* Run your local dev server before starting the tests */
// webServer: {
// command: 'npm run start',
// url: 'http://127.0.0.1:3000',
// reuseExistingServer: !process.env.CI,
// },
});
Original file line number Diff line number Diff line change
@@ -1,110 +1,71 @@
import { test, expect } from '@playwright/test';
import {
test
} from '@playwright/test';

import {
startJourney,
checkUrl,
clickBackButton,
whereWasTheQualificationAwarded,
whenWasQualificationStarted,
whatLevelIsTheQualification,
whatIsTheAwardingOrganisation,
selectQualification,
confirmQualificiation,
processAdditionalRequirement,
confirmAdditonalRequirementsAnswers,
checkDetailsPage
} from '../shared/processLogic';

test.describe("A spec used to test the main back button route through the journey", () => {
// Mock details found in Dfe.EarlyYearsQualification.Mock.Content.MockContentfulService.
test("back buttons should all navigate to the appropriate pages in the main journey", async ({ page, context }) => {
await context.addCookies([
{ name: 'auth-secret', value: process.env.AUTH_SECRET, path: '/', domain: process.env.WEBAPP_URL }
]);

// home page
await page.goto("/");
await expect(page.locator("#start-now-button")).toHaveCount(1);
await page.locator("#start-now-button").click();

// where-was-the-qualification-awarded page - england selection moves us on
expect(page.url()).toContain("/questions/where-was-the-qualification-awarded");
await page.locator("#england").click();
await page.locator("#question-submit").click();

// when-was-the-qualification-started page - valid date moves us on
expect(page.url()).toContain("/questions/when-was-the-qualification-started");
await page.locator("#date-started-month").fill("6");
await page.locator("#date-started-year").fill("2022");
await page.locator("#question-submit").click();

// what-level-is-the-qualification page - valid level moves us on
expect(page.url()).toContain("/questions/what-level-is-the-qualification");
await page.locator("#3").click();
await page.locator("#question-submit").click();

// what-is-the-awarding-organisation page - valid awarding organisation moves us on
expect(page.url()).toContain("/questions/what-is-the-awarding-organisation");
await page.locator("#awarding-organisation-select").selectOption("1");
await page.locator("#question-submit").click();

// qualifications page - click a qualification in the list to move us on
expect(page.url()).toContain("/qualifications");
await page.locator("a[href=\"/confirm-qualification/EYQ-240\"]").click();

// check additional questions first page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/1");
await page.locator("#yes").click();
await page.locator("#additional-requirement-button").click();

// check additional questions second page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/2");
await page.locator("#no").click();
await page.locator("#additional-requirement-button").click();

// confirm answers page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/confirm-answers");
await page.locator("#confirm-answers").click();

// qualifications page
expect(page.url()).toContain("/qualifications/qualification-details/EYQ-240");

/// Time to go back through the journey!
await page.locator("#back-button").click();

// confirm answers page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/confirm-answers");
await page.locator("#back-button").click();

// answered additional questions, so back to second additional questions page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/2");
await page.locator("#back-button").click();

// answered additional questions, so back to first additional questions page
expect(page.url()).toContain("/qualifications/check-additional-questions/EYQ-240/1");
await page.locator("#back-button").click();

// qualifications page
expect(page.url()).toContain("/qualifications");
await page.locator("#back-button").click();

expect(page.url()).toContain("/questions/what-is-the-awarding-organisation");
await page.locator("#back-button").click();

expect(page.url()).toContain("/questions/what-level-is-the-qualification");
await page.locator("#back-button").click();

expect(page.url()).toContain("/questions/when-was-the-qualification-started");
await page.locator("#back-button").click();

expect(page.url()).toContain("/questions/where-was-the-qualification-awarded");
await page.locator("#back-button").click();

expect(page.url()).toBe(process.env.WEBAPP_URL + "/");
//Mock details found in Dfe.EarlyYearsQualification.Mock.Content.MockContentfulService.
test.beforeEach(async ({page, context}) => {
await startJourney(page, context);
});
test("back buttons should all navigate to the appropriate pages in the main journey", async ({page}) => {

await whereWasTheQualificationAwarded(page, "#england");
await whenWasQualificationStarted(page, "6", "2022");
await whatLevelIsTheQualification(page, 3);
await whatIsTheAwardingOrganisation(page, 1);
await selectQualification(page, "EYQ-240");
await confirmQualificiation(page, "#yes");
await processAdditionalRequirement(page, "EYQ-240", 1, "#yes");
await processAdditionalRequirement(page, "EYQ-240", 2, "#no");
await confirmAdditonalRequirementsAnswers(page, "EYQ-240");
checkDetailsPage(page, "EYQ-240");

await clickBackButton(page);
checkUrl(page, "/qualifications/check-additional-questions/EYQ-240/confirm-answers");
await clickBackButton(page);
checkUrl(page, "/qualifications/check-additional-questions/EYQ-240/2");
await clickBackButton(page);
checkUrl(page, "/qualifications/check-additional-questions/EYQ-240/1");
await clickBackButton(page);
checkUrl(page, "/qualifications");
await clickBackButton(page);
checkUrl(page, "/questions/what-is-the-awarding-organisation");
await clickBackButton(page);
checkUrl(page, "/questions/what-level-is-the-qualification");
await clickBackButton(page);
checkUrl(page, "/questions/when-was-the-qualification-started");
await clickBackButton(page);
checkUrl(page, "/questions/where-was-the-qualification-awarded");
await clickBackButton(page);
checkUrl(page, process.env.WEBAPP_URL + "/");
});

test.describe("back buttons should all navigate to the appropriate pages in the main journey", async () => {
test.beforeEach(async ({page, context}) => {
await context.addCookies([
{ name: 'auth-secret', value: process.env.AUTH_SECRET, path: '/', domain: process.env.WEBAPP_URL }
]);
});

test("the back button on the accessibility statement page navigates back to the home page", async ({ page, context }) => {
test("the back button on the accessibility statement page navigates back to the home page", async ({page}) => {
await page.goto("/accessibility-statement");
await page.locator("#back-button").click();
expect(page.url()).toBe(process.env.WEBAPP_URL + "/");
await clickBackButton(page);
checkUrl(page, process.env.WEBAPP_URL + "/");
});

test("the back button on the cookies preference page navigates back to the home page", async ({ page, context }) => {
test("the back button on the cookies preference page navigates back to the home page", async ({page}) => {
await page.goto("/cookies");
await page.locator("#back-button").click();
expect(page.url()).toBe(process.env.WEBAPP_URL + "/");
await clickBackButton(page);
checkUrl(page, process.env.WEBAPP_URL + "/");
});
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import {test} from '@playwright/test';
import {pagesThatRedirectIfDateMissing} from "../shared/urls-to-check";
import {startJourney, checkUrl} from '../shared/processLogic';

test.describe('A spec used to check that if the user skips entering the date of the qual, then they are redirected back to the date selection page', () => {

test.beforeEach(async ({
page,
context
}) => {
await startJourney(page, context);
});

pagesThatRedirectIfDateMissing.forEach((url) => {
test(`navigating to ${url} should redirect the user to the date selection page`, async ({page}) => {
await page.goto(url);
checkUrl(page, "/questions/when-was-the-qualification-started");
})
});
});
Loading

0 comments on commit 651c570

Please sign in to comment.