diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml index b92813b1..61347a99 100644 --- a/.github/workflows/playwright.yml +++ b/.github/workflows/playwright.yml @@ -1,27 +1,48 @@ -name: Playwright Tests +name: E2E Tests + on: pull_request: - branches: [main] + branches: + - main + - dev + + merge_group: {} + + workflow_dispatch: + +concurrency: + group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }} + cancel-in-progress: true + 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 pnpm uses: pnpm/action-setup@v4 - - name: Install dependencies - run: pnpm install + + - name: Set node + uses: actions/setup-node@v4 + with: + node-version: 20 + cache: pnpm + + - name: Install + run: pnpm i + - name: Install Playwright Browsers run: pnpm install:browser + - name: Run Playwright tests run: pnpm test + - uses: actions/upload-artifact@v4 - if: always() + if: ${{ !cancelled() }} with: name: playwright-report - path: playwright-report/ + path: packages/docs/playwright-report/ retention-days: 30 + if-no-files-found: warn diff --git a/packages/docs/fluent-editor/demos/i18n-custom.spec.ts b/packages/docs/fluent-editor/demos/i18n-custom.spec.ts index 308987ca..a383ab11 100644 --- a/packages/docs/fluent-editor/demos/i18n-custom.spec.ts +++ b/packages/docs/fluent-editor/demos/i18n-custom.spec.ts @@ -1,4 +1,12 @@ -import { expect, test } from '@playwright/test' +import { type Locator, expect, test } from '@playwright/test' + +async function hoverUntilTipVisible(button: Locator, tip: Locator) { + await button.evaluate(el => el.scrollIntoView({ block: 'center', inline: 'nearest' })) + await expect(async () => { + await button.hover() + await expect(tip).toBeVisible({ timeout: 1_000 }) + }).toPass({ timeout: 15_000 }) +} test('uses custom i18n tip texts and switches locale', async ({ page }) => { await page.goto('/tiny-editor/docs/demo/i18n') @@ -10,15 +18,15 @@ test('uses custom i18n tip texts and switches locale', async ({ page }) => { const switchBtn = block.getByRole('button', { name: /switch between Chinese and English/i }) const tip = page.locator('.toolbar-tip__tooltip:visible') + await expect(page.locator('.vp-raw').first().locator('.ql-toolbar')).toBeVisible({ timeout: 30_000 }) await expect(toolbar).toBeVisible({ timeout: 30_000 }) await expect(editor).toBeVisible({ timeout: 30_000 }) await expect(boldBtn).toBeVisible() - await boldBtn.hover() - await expect(tip).toBeVisible({ timeout: 5_000 }) + await hoverUntilTipVisible(boldBtn, tip) await expect(tip).toHaveText('替换粗体文本') await switchBtn.click() - await boldBtn.hover() + await hoverUntilTipVisible(boldBtn, tip) await expect(tip).toHaveText('Replace bold text') }) diff --git a/packages/docs/fluent-editor/demos/toolbar-tip.spec.ts b/packages/docs/fluent-editor/demos/toolbar-tip.spec.ts index d2837881..16b3f72e 100644 --- a/packages/docs/fluent-editor/demos/toolbar-tip.spec.ts +++ b/packages/docs/fluent-editor/demos/toolbar-tip.spec.ts @@ -1,4 +1,12 @@ -import { expect, test } from '@playwright/test' +import { type Locator, expect, test } from '@playwright/test' + +async function hoverUntilTipVisible(button: Locator, tip: Locator) { + await button.evaluate(el => el.scrollIntoView({ block: 'center', inline: 'nearest' })) + await expect(async () => { + await button.hover() + await expect(tip).toBeVisible({ timeout: 1_000 }) + }).toPass({ timeout: 15_000 }) +} test('has toolbar and shows tip on hover', async ({ page }) => { await page.goto('/tiny-editor/docs/demo/toolbar-tip') @@ -6,13 +14,12 @@ test('has toolbar and shows tip on hover', async ({ page }) => { const toolbar = page.locator('.ql-toolbar').first() const editor = page.locator('.ql-editor').first() const boldBtn = toolbar.locator('.ql-bold') + const tip = page.locator('.toolbar-tip__tooltip:visible') await expect(toolbar).toBeVisible({ timeout: 30_000 }) await expect(editor).toBeVisible({ timeout: 30_000 }) await expect(boldBtn).toBeVisible() - await boldBtn.hover() - const tip = page.locator('.toolbar-tip__tooltip:visible') - await expect(tip).toBeVisible({ timeout: 5_000 }) + await hoverUntilTipVisible(boldBtn, tip) await expect(tip).toContainText(/Bold|粗体/) }) diff --git a/packages/docs/package.json b/packages/docs/package.json index bac92502..f2392ef3 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -8,7 +8,7 @@ "build": "vitepress build fluent-editor", "build:v3": "node --env-file=fluent-editor/.env.v3 ./node_modules/vitepress/bin/vitepress.js build fluent-editor", "preview": "vitepress preview fluent-editor", - "install:browser": "pnpm exec playwright install --with-deps chromium firefox", + "install:browser": "pnpm exec playwright install --with-deps chromium", "test": "pnpm exec playwright test", "test:ui": "pnpm exec playwright test --ui", "report": "pnpm exec playwright show-report" diff --git a/packages/docs/playwright.config.ts b/packages/docs/playwright.config.ts index c4549057..8eab22da 100644 --- a/packages/docs/playwright.config.ts +++ b/packages/docs/playwright.config.ts @@ -1,77 +1,23 @@ import { defineConfig, devices } from '@playwright/test' -/** - * 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({ testDir: './', testMatch: '*.spec.ts', - /* 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 : 2, - /* 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. */ + reporter: process.env.CI ? [['html'], ['github']] : 'html', 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', }, - - /* 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' }, - // }, ], - timeout: 120 * 1000, - /* Run your local dev server before starting the tests */ webServer: { command: 'pnpm dev', port: 5173,