diff --git a/.gitignore b/.gitignore index a39ac63..818eb88 100644 --- a/.gitignore +++ b/.gitignore @@ -61,4 +61,8 @@ testem.log # System Files .DS_Store Thumbs.db -.nx/cache \ No newline at end of file +.nx/cache +/test-results/ +/playwright-report/ +/blob-report/ +/playwright/.cache/ diff --git a/apps/qwik-app/src/components/demo-test/demo-test.spec.tsx b/apps/qwik-app/src/components/demo-test/demo-test.spec.tsx new file mode 100644 index 0000000..b124b40 --- /dev/null +++ b/apps/qwik-app/src/components/demo-test/demo-test.spec.tsx @@ -0,0 +1,10 @@ +// eslint-disable-next-line @nx/enforce-module-boundaries +import { test, expect } from '../../../../../dist/packages/playwright-ct-qwik/'; +import { DemoTest } from './demo-test'; + +test.use({ viewport: { width: 500, height: 500 } }); + +test('should work', async ({ mount }) => { + const component = await mount(); + await expect(component).toContainText('Hello from playwright-ct-qwik'); +}); diff --git a/apps/qwik-app/src/components/demo-test/demo-test.tsx b/apps/qwik-app/src/components/demo-test/demo-test.tsx new file mode 100644 index 0000000..e9501c0 --- /dev/null +++ b/apps/qwik-app/src/components/demo-test/demo-test.tsx @@ -0,0 +1,6 @@ +import { component$ } from "@builder.io/qwik"; + +export const DemoTest = component$(() => { + return (
Hello from playwright-ct-qwik
) +}) + diff --git a/package.json b/package.json index c6bd7e4..dd5ef22 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ "build": "nx build playwright-ct-qwik", "commit": "git-cz", "format:fix": "pretty-quick --staged", - "prepare": "husky install" + "prepare": "husky install", + "test-ct": "playwright test -c playwright-ct.config.ts" }, "devDependencies": { "@builder.io/qwik": "1.4.2", @@ -19,11 +20,11 @@ "@commitlint/config-angular": "^17.6.5", "@commitlint/config-conventional": "^17.6.5", "@jscutlery/semver": "^3.0.0", - "@nx/workspace": "17.2.8", - "@nx/vite": "17.2.8", - "@nx/js": "17.2.8", - "@nx/eslint-plugin": "17.2.8", "@nx/eslint": "17.2.8", + "@nx/eslint-plugin": "17.2.8", + "@nx/js": "17.2.8", + "@nx/vite": "17.2.8", + "@nx/workspace": "17.2.8", "@playwright/experimental-ct-core": "1.42.0-alpha-jan-18-2024", "@playwright/test": "1.41.1", "@types/eslint": "8.56.2", @@ -62,6 +63,5 @@ "qwik", "playwright", "component testing" - ], - "dependencies": {} + ] } diff --git a/packages/playwright-ct-qwik/tsconfig.json b/packages/playwright-ct-qwik/tsconfig.json index 05c3ce1..a3960a1 100644 --- a/packages/playwright-ct-qwik/tsconfig.json +++ b/packages/playwright-ct-qwik/tsconfig.json @@ -10,16 +10,17 @@ "allowSyntheticDefaultImports": true, "noFallthroughCasesInSwitch": true, "jsxImportSource": "@builder.io/qwik", - "jsx": "react-jsx" + "jsx": "react-jsx", + "esModuleInterop": true, }, "files": [], "include": [], "references": [ { - "path": "./tsconfig.lib.json" + "path": "./tsconfig.lib.json", }, { - "path": "./tsconfig.definition.json" - } - ] + "path": "./tsconfig.definition.json", + }, + ], } diff --git a/playwright-ct.config.ts b/playwright-ct.config.ts new file mode 100644 index 0000000..548e16d --- /dev/null +++ b/playwright-ct.config.ts @@ -0,0 +1,48 @@ + +// @ts-ignore +import { defineConfig, devices } from './dist/packages/playwright-ct-qwik' + +/** + * See https://playwright.dev/docs/test-configuration. + */ +export default defineConfig({ + testDir: './', + /* The base directory, relative to the config file, for snapshot files created with toMatchSnapshot and toHaveScreenshot. */ + snapshotDir: './__snapshots__', + /* Maximum time one test can run for. */ + timeout: 10 * 1000, + /* 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: { + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + + /* Port to use for Playwright component endpoint. */ + ctPort: 3100, + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { ...devices['Desktop Chrome'] }, + }, + { + name: 'firefox', + use: { ...devices['Desktop Firefox'] }, + }, + { + name: 'webkit', + use: { ...devices['Desktop Safari'] }, + }, + ], +}); diff --git a/playwright/index.html b/playwright/index.html new file mode 100644 index 0000000..610ddf8 --- /dev/null +++ b/playwright/index.html @@ -0,0 +1,12 @@ + + + + + + Testing Page + + +
+ + + diff --git a/playwright/index.tsx b/playwright/index.tsx new file mode 100644 index 0000000..ac6de14 --- /dev/null +++ b/playwright/index.tsx @@ -0,0 +1,2 @@ +// Import styles, initialize component theme here. +// import '../src/common.css'; diff --git a/tsconfig.base.json b/tsconfig.base.json index 8c9775c..431c0e0 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -14,6 +14,7 @@ "skipLibCheck": true, "skipDefaultLibCheck": true, "baseUrl": ".", + "esModuleInterop": true, "paths": { "playwright-ct-qwik": ["packages/playwright-ct-qwik/src/index.ts"] }