Skip to content

Commit a494bd5

Browse files
pvunderinkYousefED
pvunderink
and
YousefED
authored
Setup playwright (#291)
* Setup playwright for the editor package with two basic tests * Edit playwright ci config * Try different playwright config * Switch order * Fix playwright CI * Even longer timeout for server startup * Reconfigure playwright and CI * Add missing folder * Add dummy test to pass CI * simpler ci for playwright (#297) * simpler ci for playwright * small fixes * fix jest * fix tests Co-authored-by: Yousef <[email protected]>
1 parent cf661cf commit a494bd5

File tree

13 files changed

+1711
-2013
lines changed

13 files changed

+1711
-2013
lines changed

‎.github/workflows/build.yaml

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,31 @@ jobs:
6363
env:
6464
CI: true
6565

66+
- name: Run server
67+
run: npm start & npx wait-on http://localhost:3000
68+
env:
69+
CI: true
70+
71+
- name: Install Playwright
72+
run: npm run install-playwright
73+
74+
- name: Run Playwright tests
75+
run: npm run playwright
76+
77+
- uses: actions/upload-artifact@v2
78+
if: always()
79+
with:
80+
name: playwright-report-editor
81+
path: packages/editor/playwright-report/
82+
retention-days: 30
83+
84+
- uses: actions/upload-artifact@v2
85+
if: always()
86+
with:
87+
name: playwright-report-engine
88+
path: packages/engine/playwright-report/
89+
retention-days: 30
90+
6691
- name: Run Tests
6792
run: npm run test
6893
env:

‎package-lock.json

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

‎package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"devDependencies": {
55
"lerna": "^4.0.0",
66
"patch-package": "^6.4.7",
7-
"jest": "26.6.0",
7+
"jest": "^26.6.0",
8+
"playwright": "^1.18.1",
89
"ts-jest": "^26.5.4",
910
"npm-run-all": "^4.1.5"
1011
},
@@ -13,6 +14,8 @@
1314
"install-lerna": "npm install --no-package-lock",
1415
"bootstrap": "lerna bootstrap --hoist --ci && patch-package",
1516
"install-new-packages": "lerna bootstrap --hoist && patch-package",
17+
"playwright": "lerna run playwright",
18+
"install-playwright": "lerna run install-playwright",
1619
"test": "jest --coverage=true --config=jest.config.js && lerna run test-no-watch",
1720
"build": "lerna run build --concurrency 1",
1821
"build-react": "lerna run build-react --concurrency 1 --stream",

‎packages/editor/.gitignore

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,6 @@
11
build
2-
public/_docs
2+
public/_docs
3+
4+
# Playwright
5+
test-results/
6+
playwright-report/

‎packages/editor/package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,8 @@
125125
"build": "tsc -v && npm run copytypes && npm run copy-docs",
126126
"build-react": "cross-env NODE_OPTIONS=--max_old_space_size=8192 CI=true craco build",
127127
"build-react-stats": "npm run build-react -- --stats && npx webpack-bundle-analyzer build/bundle-stats.json",
128+
"install-playwright": "npx playwright install --with-deps",
129+
"playwright": "npx playwright test",
128130
"lint": "eslint src",
129131
"test": "craco test",
130132
"test-no-watch": "craco test --watchAll=false",
@@ -182,6 +184,7 @@
182184
"glob": "^7.2.0",
183185
"patch-package": "^6.4.7",
184186
"rimraf": "^3.0.2",
185-
"ts-node": "^10.1.0"
187+
"ts-node": "^10.1.0",
188+
"@playwright/test": "^1.18.1"
186189
}
187190
}

‎packages/editor/playwright.config.ts

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
import type { PlaywrightTestConfig } from "@playwright/test";
2+
import { devices } from "@playwright/test";
3+
4+
/**
5+
* See https://playwright.dev/docs/test-configuration.
6+
*/
7+
const config: PlaywrightTestConfig = {
8+
testDir: "./tests",
9+
10+
/* Maximum time one test can run for. */
11+
timeout: 30 * 1000,
12+
13+
expect: {
14+
/**
15+
* Maximum time expect() should wait for the condition to be met.
16+
* For example in `await expect(locator).toHaveText();`
17+
*/
18+
timeout: 5000,
19+
},
20+
21+
/* Fail the build on CI if you accidentally left test.only in the source code. */
22+
forbidOnly: !!process.env.CI,
23+
24+
/* Retry on CI only */
25+
retries: process.env.CI ? 2 : 0,
26+
27+
/* Opt out of parallel tests on CI. */
28+
workers: process.env.CI ? 1 : undefined,
29+
30+
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
31+
reporter: "html",
32+
33+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
34+
use: {
35+
/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
36+
actionTimeout: 0,
37+
38+
/* Base URL to use in actions like `await page.goto('/')`. */
39+
baseURL: "http://localhost:3000",
40+
41+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
42+
trace: "on-first-retry",
43+
},
44+
45+
/* Configure projects for major browsers */
46+
projects: [
47+
{
48+
name: "chromium",
49+
50+
/* Project-specific settings. */
51+
use: {
52+
...devices["Desktop Chrome"],
53+
},
54+
},
55+
56+
// {
57+
// name: "firefox",
58+
// use: {
59+
// ...devices["Desktop Firefox"],
60+
// },
61+
// },
62+
63+
{
64+
name: "webkit",
65+
use: {
66+
...devices["Desktop Safari"],
67+
},
68+
},
69+
70+
/* Test against mobile viewports. */
71+
// {
72+
// name: 'Mobile Chrome',
73+
// use: {
74+
// ...devices['Pixel 5'],
75+
// },
76+
// },
77+
// {
78+
// name: 'Mobile Safari',
79+
// use: {
80+
// ...devices['iPhone 12'],
81+
// },
82+
// },
83+
84+
/* Test against branded browsers. */
85+
// {
86+
// name: 'Microsoft Edge',
87+
// use: {
88+
// channel: 'msedge',
89+
// },
90+
// },
91+
// {
92+
// name: 'Google Chrome',
93+
// use: {
94+
// channel: 'chrome',
95+
// },
96+
// },
97+
],
98+
99+
/* Folder for test artifacts such as screenshots, videos, traces, etc. */
100+
// outputDir: 'test-results/',
101+
102+
/* Run your local dev server before starting the tests */
103+
// webServer: {
104+
// command: "npm start",
105+
// reuseExistingServer: !process.env.CI,
106+
// timeout: 60 * 1000,
107+
// port: 3000,
108+
// },
109+
};
110+
export default config;

‎packages/editor/src/app/main/components/ProfilePopup.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ export const ProfilePopup = observer(
3030
shouldFlip
3131
trigger={
3232
<Profile
33+
testId="profile-button"
3334
icon={
3435
<Avatar
3536
name={getStoreService().sessionStore.loggedInUserId?.substring(

‎packages/editor/tests/end-to-end/login.spec.ts

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { test, expect } from "@playwright/test";
2+
3+
test("Sign in button exists", async ({ page }) => {
4+
await page.goto("/");
5+
const button = page.locator("header button");
6+
await expect(button).toHaveText("Sign in");
7+
});
8+
9+
test("Sign in by email", async ({ page }) => {
10+
await page.goto("/");
11+
const button = page.locator("button", { hasText: "Sign in" });
12+
13+
await button.click();
14+
15+
const email = page.locator("input[name=email]");
16+
const password = page.locator("input[type=password]");
17+
18+
await email.type("[email protected]");
19+
await password.type("AyKq4j?xoGrdmp5N");
20+
21+
const continueButton = page.locator("button[type=submit]", {
22+
hasText: "Continue",
23+
});
24+
25+
await continueButton.click();
26+
27+
const profileButton = await page.locator(
28+
"button[data-testid='profile-button']"
29+
);
30+
31+
await expect(profileButton).toBeVisible();
32+
});

‎packages/engine/jest.config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ module.exports = {
99
roots: ["<rootDir>"],
1010
modulePaths: ["<rootDir>"],
1111
testMatch: ["**/__tests__/**/*.ts?(x)", "**/?(*.)+(spec|test).ts?(x)"],
12+
testPathIgnorePatterns: ["/node_modules/", "/tests/end-to-end/"],
1213
moduleNameMapper: {
1314
"@typecell-org/common": "<rootDir>/../common/src",
1415
"^lib0/([a-zA-Z-]*)$": "<rootDir>/../../node_modules/lib0/dist/$1.cjs",

‎packages/engine/package.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@
1010
"vscode-lib": "^0.1.0"
1111
},
1212
"devDependencies": {
13+
"@types/jest": "^26.0.22",
1314
"jest": "26.6.0",
1415
"rimraf": "^3.0.2",
15-
"typescript": "4.3.2"
16+
"typescript": "4.3.2",
17+
"@playwright/test": "^1.18.1"
1618
},
1719
"source": "src/index.ts",
1820
"types": "types/index.d.ts",
@@ -21,6 +23,8 @@
2123
"clean": "rimraf dist && rimraf types",
2224
"build": "npm run clean && tsc -p tsconfig.json",
2325
"watch": "tsc --watch",
26+
"install-playwright": "npx playwright install --with-deps",
27+
"playwright": "npx playwright test",
2428
"test": "jest --coverage=true --config=jest.config.js"
2529
},
2630
"jest": {

0 commit comments

Comments
 (0)