Skip to content

Commit d093621

Browse files
KocalKocal
committed
Use Playwright to run E2E tests
1 parent a13d427 commit d093621

File tree

17 files changed

+209
-76
lines changed

17 files changed

+209
-76
lines changed

‎.github/workflows/browser-tests.yml‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,11 @@ jobs:
3636
src/**/package.json
3737
- run: pnpm install --frozen-lockfile
3838

39-
- name: Install browsers
39+
- name: Install custom browsers
4040
run: node ./bin/get_browsers.mjs
4141

42+
- name: Install browsers with Playwright
43+
run: pnpm exec playwright install firefox
44+
4245
# TODO: Install the E2E app + run webserver
4346
- run: pnpm run test:browser

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,3 +8,4 @@ node_modules
88
/vendor
99

1010
/browsers
11+
.last-run.json

‎bin/get_browsers.mjs‎

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {
33
Browser,
44
BrowserTag,
55
detectBrowserPlatform,
6-
install as installBrowser,
6+
install,
77
resolveBuildId,
88
} from '@puppeteer/browsers';
99

@@ -18,7 +18,7 @@ const installBrowserCommonOpts = {
1818
// see https://browsersl.ist/#q=defaults+and+fully+supports+es6-module
1919

2020
export const browsers = {
21-
'chrome@lowest': await installBrowser({
21+
'chrome@lowest': await install({
2222
...installBrowserCommonOpts,
2323
browser: Browser.CHROME,
2424
// The lowest version where:
@@ -28,21 +28,29 @@ export const browsers = {
2828
// @see https://raw.githubusercontent.com/GoogleChromeLabs/chrome-for-testing/refs/heads/main/data/known-good-versions-with-downloads.json
2929
buildId: '130.0.6669.0',
3030
}),
31-
'chrome@latest': await installBrowser({
32-
...installBrowserCommonOpts,
33-
browser: Browser.CHROME,
34-
buildId: await resolveBuildId(Browser.CHROME, platform, BrowserTag.STABLE),
35-
}),
36-
'firefox@lowest': await installBrowser({
37-
...installBrowserCommonOpts,
38-
browser: Browser.FIREFOX,
39-
buildId: 'stable_128.0',
40-
}),
41-
'firefox@latest': await installBrowser({
42-
...installBrowserCommonOpts,
43-
browser: Browser.FIREFOX,
44-
buildId: await resolveBuildId(Browser.FIREFOX, platform, BrowserTag.STABLE),
31+
32+
'chrome@latest': await install({
33+
...installBrowserCommonOpts,
34+
browser: Browser.CHROME,
35+
buildId: await resolveBuildId(Browser.CHROME, platform, BrowserTag.STABLE),
4536
}),
37+
38+
// TODO: I don't find a way to install a specific Firefox version and make it usable
39+
// with Playwright. It's surely related to patch things (https://playwright.dev/docs/browsers#firefox),
40+
// but even a non-branded version like Nightly doesn't work.
41+
42+
// 'firefox@lowest': await install({
43+
// ...installBrowserCommonOpts,
44+
// browser: Browser.FIREFOX,
45+
// buildId: '128.0a1',
46+
// baseUrl: 'https://ftp.mozilla.org/pub/firefox/nightly/2024/06/2024-06-01-09-33-40-mozilla-central'
47+
// }),
48+
//
49+
// 'firefox@latest': await install({
50+
// ...installBrowserCommonOpts,
51+
// browser: Browser.FIREFOX,
52+
// buildId: await resolveBuildId(Browser.FIREFOX, platform, BrowserTag.NIGHTLY),
53+
// }),
4654
};
4755

4856
if (import.meta.main) {

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,13 @@
1010
"build": "pnpm run --filter @symfony/ux-map build && pnpm run -r --aggregate-output build",
1111
"test": "pnpm run -r --workspace-concurrency=1 test",
1212
"test:unit": "pnpm run -r --aggregate-output test:unit",
13-
"test:browser": "pnpm run -r --workspace-concurrency=1 test:browser",
13+
"test:browser": "pnpm exec playwright test",
1414
"check": "biome check",
1515
"ci": "biome ci"
1616
},
1717
"devDependencies": {
1818
"@biomejs/biome": "^2.0.4",
19+
"@playwright/test": "^1.54.2",
1920
"@puppeteer/browsers": "^2.10.6",
2021
"@testing-library/dom": "^10.4.0",
2122
"@testing-library/jest-dom": "^6.6.3",

‎playwright.config.ts‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import { defineConfig, devices } from '@playwright/test';
2+
3+
import { browsers } from './bin/get_browsers.mjs';
4+
5+
export default defineConfig({
6+
testMatch:[
7+
'src/**/assets/test/browser/**/*.{test,spec}.ts',
8+
'src/**/assets/test/**/*.browser.{test,spec}.ts',
9+
],
10+
testIgnore: [
11+
// TODO: Temporary, as the Map tests require some TypeScript code to be compiled
12+
// and so fails (which is expected). To remove once the tests are real E2E.
13+
/Map/
14+
],
15+
16+
projects: [
17+
{
18+
name: 'chrome-lowest',
19+
use: {
20+
...devices['Desktop Chrome'],
21+
channel: 'chrome',
22+
launchOptions: {
23+
executablePath: browsers['chrome@lowest'].executablePath,
24+
// args: ['--no-sandbox', '--disable-dev-shm-usage'],
25+
}
26+
},
27+
},
28+
{
29+
name: 'chrome-latest',
30+
use: {
31+
...devices['Desktop Chrome'],
32+
channel: 'chrome',
33+
launchOptions: {
34+
executablePath: browsers['chrome@latest'].executablePath,
35+
// args: ['--no-sandbox', '--disable-dev-shm-usage'],
36+
}
37+
},
38+
},
39+
40+
// TODO: Until we found a way to run a specific version of Firefox
41+
//{
42+
// name: 'firefox-lowest',
43+
// use: {
44+
// ...devices['Desktop Firefox'],
45+
// launchOptions: {
46+
// executablePath: browsers['firefox@lowest'].executablePath,
47+
// }
48+
// },
49+
//},
50+
{
51+
name: 'firefox-latest',
52+
use: {
53+
...devices['Desktop Firefox'],
54+
},
55+
}
56+
],
57+
use: {
58+
baseURL: 'http://localhost:9876'
59+
},
60+
//webServer: {
61+
// command: 'cd test_apps/e2e-app && symfony serve',
62+
// url: 'http://localhost:9876',
63+
// reuseExistingServer: !process.env.CI,
64+
// stderr: 'pipe',
65+
//},
66+
});

‎pnpm-lock.yaml‎

Lines changed: 13 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/Autocomplete/assets/test/browser/placeholder.test.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
import { describe, expect, it } from 'vitest';
1+
import { expect, test } from '@playwright/test';
22

3-
describe('Placeholder', () => {
4-
it('pass', () => {
5-
expect(true).toBe(true);
6-
});
3+
test('get started link', async ({ page }) => {
4+
await page.goto('https://playwright.dev/');
5+
6+
// Click the get started link.
7+
await page.getByRole('link', { name: 'Get started' }).click();
8+
9+
// Expects page to have a heading with the name of Installation.
10+
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
711
});

‎src/Chartjs/assets/test/browser/placeholder.test.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
import { describe, expect, it } from 'vitest';
1+
import { expect, test } from '@playwright/test';
22

3-
describe('Placeholder', () => {
4-
it('pass', () => {
5-
expect(true).toBe(true);
6-
});
3+
test('get started link', async ({ page }) => {
4+
await page.goto('https://playwright.dev/');
5+
6+
// Click the get started link.
7+
await page.getByRole('link', { name: 'Get started' }).click();
8+
9+
// Expects page to have a heading with the name of Installation.
10+
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
711
});

‎src/Cropperjs/assets/test/browser/placeholder.test.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
import { describe, expect, it } from 'vitest';
1+
import { expect, test } from '@playwright/test';
22

3-
describe('Placeholder', () => {
4-
it('pass', () => {
5-
expect(true).toBe(true);
6-
});
3+
test('get started link', async ({ page }) => {
4+
await page.goto('https://playwright.dev/');
5+
6+
// Click the get started link.
7+
await page.getByRole('link', { name: 'Get started' }).click();
8+
9+
// Expects page to have a heading with the name of Installation.
10+
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
711
});

‎src/Dropzone/assets/test/browser/placeholder.test.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
import { describe, expect, it } from 'vitest';
1+
import { expect, test } from '@playwright/test';
22

3-
describe('Placeholder', () => {
4-
it('pass', () => {
5-
expect(true).toBe(true);
6-
});
3+
test('get started link', async ({ page }) => {
4+
await page.goto('https://playwright.dev/');
5+
6+
// Click the get started link.
7+
await page.getByRole('link', { name: 'Get started' }).click();
8+
9+
// Expects page to have a heading with the name of Installation.
10+
await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
711
});

0 commit comments

Comments
 (0)