Skip to content

Commit

Permalink
Migration/dpm 130 performance testing playwright (#6991)
Browse files Browse the repository at this point in the history
* Made Playwright work with SSO (#6984)
* Basic E2E tests
* Update documentation
---------

Co-authored-by: Peter Hudec <[email protected]>
  • Loading branch information
marijnkampf and peterhudec authored Jul 11, 2024
1 parent 5a8cd17 commit 33ca3d6
Show file tree
Hide file tree
Showing 14 changed files with 528 additions and 3 deletions.
27 changes: 27 additions & 0 deletions .github/workflows/playwright.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
name: Playwright Tests
on:
push:
branches: [ main, master ]
pull_request:
branches: [ main, master ]
jobs:
test:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: lts/*
- name: Install dependencies
run: npm ci
- name: Install Playwright Browsers
run: npx playwright install --with-deps
- name: Run Playwright tests
run: npx playwright test
- uses: actions/upload-artifact@v4
if: always()
with:
name: playwright-report
path: playwright-report/
retention-days: 30
7 changes: 7 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -91,3 +91,10 @@ yalc.lock

# Ignore gh pages for Storybook
storybook-static/

playwright/.auth
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
.auth/
15 changes: 15 additions & 0 deletions docs/Running tests.md
Original file line number Diff line number Diff line change
Expand Up @@ -196,6 +196,21 @@ or

`$ npm run test:e2e:dit -- --spec test/end-to-end/cypress/specs/DIT/local-nav-spec.js`

# Performance E2E tests
The performance E2E tests use Playwright. Any current tests should only run non-mutating, non-destructive tests.

In `playwright.config.ts` you can define which environment to run it against by settings the `baseURL`.

To run against your local environment spin it assumes it is running already (`npm run develop`).

If this is the first time running playwright you may need to run `npm install` to ensure you've got everything you need.

Run tests headless:
`npx playwright test`

Run tests in Playwright Test UI:
`npx playwright test --ui`

## Accessibility tests

The aim of this suite is to ensure our HTML pages are usable by as many people as possible.
Expand Down
121 changes: 118 additions & 3 deletions package-lock.json

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

2 changes: 2 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -164,12 +164,14 @@
"@chromatic-com/storybook": "^1.6.1",
"@cypress/code-coverage": "^3.12.41",
"@faker-js/faker": "^8.3.1",
"@playwright/test": "^1.45.1",
"@storybook/addon-a11y": "^8.1.11",
"@storybook/addon-essentials": "^8.1.11",
"@storybook/addon-webpack5-compiler-babel": "^3.0.3",
"@storybook/manager-api": "^8.1.11",
"@storybook/react": "^8.1.11",
"@storybook/react-webpack5": "^8.1.11",
"@types/node": "^20.14.10",
"babel-loader": "^9.1.3",
"babel-plugin-istanbul": "7.0.0",
"chai": "^4.4.1",
Expand Down
112 changes: 112 additions & 0 deletions playwright.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
import { defineConfig, devices } from '@playwright/test';
import { BASE_URLS } from './tests/e2e/utils';

/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// import dotenv from 'dotenv';
// dotenv.config({ path: path.resolve(__dirname, '.env') });

/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
// globalSetup: './tests/e2e/auth.setup',
testDir: './tests/e2e',
/* 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: BASE_URLS.LOCALHOST,

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

/* Configure projects for major browsers */
projects: [
/**
* This "project" contains only a single test which doesn't test anything,
* but opens a browser where we can manually go through the SSO OAuth flow,
* at the end of which, the test preserves the session (cookies) in the
* ./.auth/user.json file
*/
{
name: 'auth',
testMatch: 'auth.ts',
timeout: 1000 * 60 * 100,
},
{
name: 'foo',
testMatch: '**/*.spec.ts',
use: {
...devices['Desktop Chrome'],
storageState: './.auth/user.json',
},
/**
* We make the "auth" project a dependency of this project.
* The Playwright UI allows turning projects on and off.
* When we run this project for the first time,
* it will run "auth" first so we can manually go through the OAuth flow.
* After the OAuth flow succeeds, the tests in this project will be run with
* the authenticated context.
* If we run the tests again, we will have to go through the OAuth flow again,
* but we can toggle the "auth" project off in the UI and we can only run
* tests in this project still with the authenticated context.
* Should our session expire, we can just toggle "auth" back on and
* go through the OAuth flow again.
* Or alternatively, we can manually add a record for the "datahub.sid"
* session cookie to the ./.auth/user.json file?
*/
dependencies: ['auth'],
},

// {
// 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 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,
// },
});
Loading

0 comments on commit 33ca3d6

Please sign in to comment.