From 921adf1312aebedf1ce91efbdd1bc3898e4dfdab Mon Sep 17 00:00:00 2001 From: Enoch Riese Date: Thu, 20 Apr 2023 13:28:00 -0400 Subject: [PATCH] add playwright to lab. set up future sites capabilities --- .gitignore | 3 ++ config/dependencies.yaml | 5 ++- config/scripts.yaml | 1 + package.json | 1 + sites/dev/package.json | 2 + sites/lab/e2e/lab.spec.js | 18 ++++++++ sites/lab/package.json | 3 ++ sites/lab/playwright.config.mjs | 9 ++++ sites/org/package.json | 2 + sites/shared/config/playwright.mjs | 68 ++++++++++++++++++++++++++++++ yarn.lock | 24 ++++++++++- 11 files changed, 134 insertions(+), 2 deletions(-) create mode 100644 sites/lab/e2e/lab.spec.js create mode 100644 sites/lab/playwright.config.mjs create mode 100644 sites/shared/config/playwright.mjs diff --git a/.gitignore b/.gitignore index e003a2658dd..aeeb510df61 100644 --- a/.gitignore +++ b/.gitignore @@ -137,3 +137,6 @@ scripts/verdaccio.sh !markdown/dev/reference/api/point/dist .test-failures.log + +# e2e test results +sites/*/playwright-report diff --git a/config/dependencies.yaml b/config/dependencies.yaml index 8a33642c4af..c1524a22eee 100644 --- a/config/dependencies.yaml +++ b/config/dependencies.yaml @@ -245,10 +245,12 @@ dev: 'remark-copy-linked-files': &remarkCopyLinkedFiles 'https://github.com/joostdecock/remark-copy-linked-files' 'remark-gfm': &remarkGfm '3.0.1' dev: &nextSiteDevDependencies + '@playwright/test': '^1.32.3' 'autoprefixer': '10.4.14' 'eslint-config-next': *next 'js-yaml': &jsYaml '4.1.0' 'postcss': &postcss '8.4.22' + 'playwright': '^1.32.3' 'remark-extract-frontmatter': '3.2.0' 'tailwindcss': &tailwindcss '3.3.1' 'yaml-loader': '0.8.0' @@ -294,7 +296,8 @@ lab: 'rehype-stringify': *rehypeStringify 'remark-copy-linked-files': *remarkCopyLinkedFiles 'remark-gfm': *remarkGfm - dev: *nextSiteDevDependencies + dev: + *nextSiteDevDependencies org: _: diff --git a/config/scripts.yaml b/config/scripts.yaml index 1a1f688cef3..a8f46c2bc56 100644 --- a/config/scripts.yaml +++ b/config/scripts.yaml @@ -80,6 +80,7 @@ lab: clean: 'rimraf pages/*.mjs && rimraf pages/*/*.mjs && rimraf pages/v/*/*.mjs' dev: *nextDev develop: *nextDev + e2e: &e2e 'yarn playwright test' lint: *nextLint prebuild: 'node --experimental-json-modules ../shared/prebuild/index.mjs' start: *nextStart diff --git a/package.json b/package.json index e0a8d516afc..76890ae2299 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "kickstart:windows": "npx lerna bootstrap && yarn wbuildall && yarn prepare && yarn tips", "cleanall": "lerna run clean", "test": "lerna run test", + "e2e": "lerna run e2e", "prettier": "npx prettier --write 'config/*' 'config/**/*' 'packages/**/src/*.mjs' 'packages/i18n/src/locales/**/*.*' 'packages/**/tests/*.mjs'", "reconfigure": "all-contributors generate && node --experimental-json-modules --no-warnings scripts/reconfigure.mjs", "prerelease": "lerna version --no-git-tag-version --no-push && yarn reconfigure && yarn buildall", diff --git a/sites/dev/package.json b/sites/dev/package.json index 3ddd997fc86..24d0ceba5d6 100644 --- a/sites/dev/package.json +++ b/sites/dev/package.json @@ -54,10 +54,12 @@ "remark-gfm": "3.0.1" }, "devDependencies": { + "@playwright/test": "^1.32.3", "autoprefixer": "10.4.14", "eslint-config-next": "13.3.0", "js-yaml": "4.1.0", "postcss": "8.4.22", + "playwright": "^1.32.3", "remark-extract-frontmatter": "3.2.0", "tailwindcss": "3.3.1", "yaml-loader": "0.8.0" diff --git a/sites/lab/e2e/lab.spec.js b/sites/lab/e2e/lab.spec.js new file mode 100644 index 00000000000..368ab329abb --- /dev/null +++ b/sites/lab/e2e/lab.spec.js @@ -0,0 +1,18 @@ +import { test, expect } from '@playwright/test' + +test('test', async ({ page }) => { + await page.goto('http://localhost:8000/') + await page.getByRole('button', { name: 'Designs' }).click() + await page.getByRole('link', { name: 'albert' }).click() + await page.goto('http://localhost:8000/albert') + await page + .getByRole('list') + .filter({ hasText: 'Size 28Size 30Size 32Size 34Size 36Size 38Size 40Size 42Size 44Size 46' }) + .getByRole('button', { name: 'Size 36' }) + .click() + await page.getByTitle('draftDesign').click() + + await expect(page.getByText('Something went wrong')).toHaveCount(0) + await expect(page.getByText('Unhandled Runtime Error')).toHaveCount(0) + await expect(page.getByRole('button', { name: '° Measurements' })).toBeVisible() +}) diff --git a/sites/lab/package.json b/sites/lab/package.json index 2365630cca3..b34e8470e0d 100644 --- a/sites/lab/package.json +++ b/sites/lab/package.json @@ -19,6 +19,7 @@ "clean": "rimraf pages/*.mjs && rimraf pages/*/*.mjs && rimraf pages/v/*/*.mjs", "dev": "next dev -p 8000", "develop": "next dev -p 8000", + "e2e": "yarn playwright test", "lint": "next lint", "prebuild": "node --experimental-json-modules ../shared/prebuild/index.mjs", "start": "yarn prebuild && yarn dev" @@ -59,10 +60,12 @@ "remark-gfm": "3.0.1" }, "devDependencies": { + "@playwright/test": "^1.32.3", "autoprefixer": "10.4.14", "eslint-config-next": "13.3.0", "js-yaml": "4.1.0", "postcss": "8.4.22", + "playwright": "^1.32.3", "remark-extract-frontmatter": "3.2.0", "tailwindcss": "3.3.1", "yaml-loader": "0.8.0" diff --git a/sites/lab/playwright.config.mjs b/sites/lab/playwright.config.mjs new file mode 100644 index 00000000000..d5f3e17ea65 --- /dev/null +++ b/sites/lab/playwright.config.mjs @@ -0,0 +1,9 @@ +import { createConfig } from '../shared/config/playwright.mjs' + +const config = createConfig({ + command: 'yarn start', + url: 'http://127.0.0.1:8000', + reuseExistingServer: !process.env.CI, +}) + +export default config diff --git a/sites/org/package.json b/sites/org/package.json index ccdd0fe7c55..cc008a32590 100644 --- a/sites/org/package.json +++ b/sites/org/package.json @@ -58,10 +58,12 @@ "yaml-loader": "0.8.0" }, "devDependencies": { + "@playwright/test": "^1.32.3", "autoprefixer": "10.4.14", "eslint-config-next": "13.3.0", "js-yaml": "4.1.0", "postcss": "8.4.22", + "playwright": "^1.32.3", "remark-extract-frontmatter": "3.2.0", "tailwindcss": "3.3.1", "yaml-loader": "0.8.0" diff --git a/sites/shared/config/playwright.mjs b/sites/shared/config/playwright.mjs new file mode 100644 index 00000000000..3ccf9de3ca9 --- /dev/null +++ b/sites/shared/config/playwright.mjs @@ -0,0 +1,68 @@ +import { defineConfig, devices } from '@playwright/test' + +export function createConfig(webServer) { + /** + * @see https://playwright.dev/docs/test-configuration + */ + return defineConfig({ + testDir: './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: 'http://127.0.0.1:3000', + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + }, + + webServer, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { ...devices['Desktop Chrome'] }, + }, + + // { + // 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' }, + // }, + ], + }) +} diff --git a/yarn.lock b/yarn.lock index 4603dab1382..339f3574f36 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3760,6 +3760,16 @@ tiny-glob "^0.2.9" tslib "^2.4.0" +"@playwright/test@^1.32.3": + version "1.32.3" + resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.32.3.tgz#75be8346d4ef289896835e1d2a86fdbe3d9be92a" + integrity sha512-BvWNvK0RfBriindxhLVabi8BRe3X0J9EVjKlcmhxjg4giWBD/xleLcg2dz7Tx0agu28rczjNIPQWznwzDwVsZQ== + dependencies: + "@types/node" "*" + playwright-core "1.32.3" + optionalDependencies: + fsevents "2.3.2" + "@polka/url@^1.0.0-next.20": version "1.0.0-next.21" resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.21.tgz#5de5a2385a35309427f6011992b544514d559aa1" @@ -9621,7 +9631,7 @@ fs.realpath@^1.0.0: resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f" integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw== -fsevents@~2.3.2: +fsevents@2.3.2, fsevents@~2.3.2: version "2.3.2" resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a" integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA== @@ -15749,6 +15759,18 @@ pkg-dir@^5.0.0: dependencies: find-up "^5.0.0" +playwright-core@1.32.3: + version "1.32.3" + resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.32.3.tgz#e6dc7db0b49e9b6c0b8073c4a2d789a96f519c48" + integrity sha512-SB+cdrnu74ZIn5Ogh/8278ngEh9NEEV0vR4sJFmK04h2iZpybfbqBY0bX6+BLYWVdV12JLLI+JEFtSnYgR+mWg== + +playwright@^1.32.3: + version "1.32.3" + resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.32.3.tgz#88583167880e42ca04fa8c4cc303680f4ff457d0" + integrity sha512-h/ylpgoj6l/EjkfUDyx8cdOlfzC96itPpPe8BXacFkqpw/YsuxkpPyVbzEq4jw+bAJh5FLgh31Ljg2cR6HV3uw== + dependencies: + playwright-core "1.32.3" + plur@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/plur/-/plur-5.1.0.tgz#bff58c9f557b9061d60d8ebf93959cf4b08594ae"