From 05d87b70abaac1fd8c08057d624bd331f9ce066d Mon Sep 17 00:00:00 2001 From: Nikita Barsukov Date: Wed, 26 Jul 2023 12:09:34 +0300 Subject: [PATCH] chore(demo-playwright): add `Playwright` --- .github/actions/variables/action.yml | 4 + .github/screenshot-bot.config.toml | 3 +- .github/workflows/e2e-summary.yml | 56 --------- .github/workflows/e2e.yml | 79 ++++++++----- .gitignore | 4 + package-lock.json | 106 ++++++++++++------ package.json | 1 + projects/demo-playwright/playwright.config.ts | 36 ++++++ projects/demo-playwright/project.json | 33 ++++++ .../demo-playwright/tests/example.spec.ts | 17 +++ .../mobile-calendar/examples/1/index.ts | 2 +- 11 files changed, 217 insertions(+), 124 deletions(-) delete mode 100644 .github/workflows/e2e-summary.yml create mode 100644 projects/demo-playwright/playwright.config.ts create mode 100644 projects/demo-playwright/project.json create mode 100644 projects/demo-playwright/tests/example.spec.ts diff --git a/.github/actions/variables/action.yml b/.github/actions/variables/action.yml index 5ac0e6f39c576..0d0b509105dcf 100644 --- a/.github/actions/variables/action.yml +++ b/.github/actions/variables/action.yml @@ -41,8 +41,10 @@ runs: export CYPRESS_failOnSnapshotDiff="0" export CYPRESS_API_URL="http://localhost:1234/" export SNAPSHOTS_PATH="./projects/demo-integrations/cypress/snapshots" + export PLAYWRIGHT_SNAPSHOTS_PATH="./projects/demo-playwright/tests-results" export SNAPSHOTS_CACHE_KEY="e2e-cache--${{ github.event.pull_request.head.sha || github.sha }}-${{ github.event.number }}" export SNAPSHOTS_ARTIFACTS_KEY="e2e-artifacts--${{ github.event.pull_request.head.sha || github.sha }}-${{ github.run_id }}-${{ github.event.number }}" + export PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY="playwright-e2e-artifacts--${{ github.event.pull_request.head.sha || github.sha }}-${{ github.run_id }}-${{ github.event.number }}" if [[ "$IS_FORK" == "false" && "$IS_DEPENDABOT" == "false" ]]; then export IS_OWNER_MODE="true" @@ -74,5 +76,7 @@ runs: echo "CYPRESS_failOnSnapshotDiff=$CYPRESS_failOnSnapshotDiff" >> $GITHUB_ENV echo "CYPRESS_API_URL=$CYPRESS_API_URL" >> $GITHUB_ENV echo "SNAPSHOTS_PATH=$SNAPSHOTS_PATH" >> $GITHUB_ENV + echo "PLAYWRIGHT_SNAPSHOTS_PATH=PLAYWRIGHT_SNAPSHOTS_PATH" >> $GITHUB_ENV echo "SNAPSHOTS_ARTIFACTS_KEY=$SNAPSHOTS_ARTIFACTS_KEY" >> $GITHUB_ENV + echo "PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY=PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY" >> $GITHUB_ENV echo "SNAPSHOTS_CACHE_KEY=$SNAPSHOTS_CACHE_KEY" >> $GITHUB_ENV diff --git a/.github/screenshot-bot.config.toml b/.github/screenshot-bot.config.toml index 6eccf2fffbf26..3bc59b8704f25 100644 --- a/.github/screenshot-bot.config.toml +++ b/.github/screenshot-bot.config.toml @@ -1,13 +1,14 @@ # array of RegExp strings to match workflow names # which should be watched by bot workflowWithTests = [ - '.*E2E Summary.*', # all workflows with sub-string "e2e" in their names will be watched by bot + '.*E2E*', # all workflows with sub-string "e2e" in their names will be watched by bot ] # array of RegExp strings to match images inside artifacts (by their path or file name) # which shows difference between two screenshot and which will be added to bot report comment screenshotsDiffsPaths = [ '.*__diff_output__.*', # it is default cypress folder name into which snapshot diffs are put + 'tests-results/.*-diff.png' ] # RegExp string to match images inside artifacts (by their path or file name) diff --git a/.github/workflows/e2e-summary.yml b/.github/workflows/e2e-summary.yml deleted file mode 100644 index c3b2f810fbc7f..0000000000000 --- a/.github/workflows/e2e-summary.yml +++ /dev/null @@ -1,56 +0,0 @@ -name: ⚙️ E2E Summary report -on: - pull_request: - -env: - NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }} - -jobs: - report: - runs-on: ubuntu-latest - if: ${{ !contains(github.head_ref , 'release/') }} - steps: - - uses: actions/checkout@v3.5.3 - - name: Setup global variables - uses: ./.github/actions/variables - - - name: Wait for e2e tests to succeed - uses: codex-/await-local-workflow-run@v1 - with: - token: ${{ github.token }} - workflow: e2e.yml - timeout_mins: 120 - poll_interval_ms: 60000 - - - name: Download cache / ${{ env.SNAPSHOTS_CACHE_KEY }} - uses: actions/cache/restore@v3.3.1 - with: - path: ${{ env.SNAPSHOTS_PATH }} - key: ${{ env.SNAPSHOTS_CACHE_KEY }} - - - name: Debug output - continue-on-error: true - run: tree ${{ env.SNAPSHOTS_PATH }} - - - name: Check if diff-output exists - id: diff-checker - run: | - echo "diff_exist=$(find ${{ env.SNAPSHOTS_PATH }} -regex '.*\.diff\.png$' | wc -l | sed -e 's/^[[:space:]]*//')" >> $GITHUB_OUTPUT - - - name: Upload artifacts / ${{ env.SNAPSHOTS_ARTIFACTS_KEY }} - if: ${{ steps.diff-checker.outputs.diff_exist != '0' }} - continue-on-error: true - uses: actions/upload-artifact@v3.1.2 - with: - name: ${{ env.SNAPSHOTS_ARTIFACTS_KEY }} - path: ${{ env.SNAPSHOTS_PATH }} - - - name: Fall with an error if diff-output exists - if: ${{ steps.diff-checker.outputs.diff_exist != '0' }} - run: | - find ${{ env.SNAPSHOTS_PATH }} -regex '.*\.diff\.png$' -exec echo "{}" \; - exit 1 - -concurrency: - group: e2e-${{ github.workflow }}-${{ github.ref }} - cancel-in-progress: true diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 356e02630a56f..1dbf5e0643df6 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -45,21 +45,7 @@ jobs: strategy: fail-fast: false matrix: - project: - [ - addon-doc, - addon-charts, - addon-commerce, - addon-mobile, - addon-preview, - addon-table, - addon-tablebars, - icons, - core, - deep, - demo, - kit, - ] + project: [addon-mobile] name: ${{ matrix.project }} steps: - uses: actions/checkout@v3.5.3 @@ -100,6 +86,10 @@ jobs: - name: Clean up resources run: npx kill-port --port ${{ env.NG_SERVER_PORT }} + - name: Debug output + continue-on-error: true + run: tree ${{ env.SNAPSHOTS_PATH }} + - name: Upload artifacts / ${{ env.SNAPSHOTS_ARTIFACTS_KEY }} uses: actions/upload-artifact@v3.1.2 with: @@ -108,32 +98,63 @@ jobs: if-no-files-found: ignore retention-days: 1 - result: + playwright: if: ${{ !contains(github.head_ref , 'release/') }} - name: result - needs: [cypress] runs-on: ubuntu-latest + needs: [build-demo] steps: - uses: actions/checkout@v3.5.3 - name: Setup global variables uses: ./.github/actions/variables + - name: Setup Node.js and Cache + uses: ./.github/actions/nodejs - - name: Download artifacts / ${{ env.SNAPSHOTS_ARTIFACTS_KEY }} - continue-on-error: true - uses: actions/download-artifact@v3.0.2 - with: - name: ${{ env.SNAPSHOTS_ARTIFACTS_KEY }} - path: ${{ env.SNAPSHOTS_PATH }} + - name: Install Playwright Browsers + run: npx playwright install --with-deps - - name: Upload cache / ${{ env.SNAPSHOTS_CACHE_KEY }} - uses: actions/cache/save@v3.3.1 + - name: Download cache / ${{ env.CACHE_DIST_KEY }} + uses: actions/cache/restore@v3.3.1 with: - path: ${{ env.SNAPSHOTS_PATH }} - key: ${{ env.SNAPSHOTS_CACHE_KEY }} + path: dist/demo + key: ${{ env.CACHE_DIST_KEY }} + + - name: Serve ${{ env.DIST }} in background + run: npx nx serve-compiled demo --path ${{ env.DIST }} --port ${{ env.NG_SERVER_PORT }} + + - name: Run screenshot tests on ${{ env.DIST }} + run: npx nx e2e demo-playwright + + - name: Clean up resources + run: npx kill-port --port ${{ env.NG_SERVER_PORT }} + + - name: Download ${{ env.DIST_NEXT }} for serve locally + run: | + git clone \ + --depth 1 \ + --branch snapshots/demo/next/${{ github.base_ref }} \ + https://github.com/Tinkoff/taiga-ui.git ${{ env.DIST_NEXT }} + + - name: Serve ${{ env.DIST_NEXT }} in background + run: npx nx serve-compiled demo --path ${{ env.DIST_NEXT }} --port ${{ env.NG_SERVER_PORT }} + + - name: Run screenshot tests on ${{ env.DIST_NEXT }} + continue-on-error: true + run: npx nx e2e demo-playwright + + - name: Clean up resources + run: npx kill-port --port ${{ env.NG_SERVER_PORT }} - name: Debug output continue-on-error: true - run: tree ${{ env.SNAPSHOTS_PATH }} + run: tree ${{ env.PLAYWRIGHT_SNAPSHOTS_PATH }} + + - name: Upload artifacts / ${{ env.PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY }} + uses: actions/upload-artifact@v3.1.2 + with: + path: ${{ env.PLAYWRIGHT_SNAPSHOTS_PATH }}/**/*-diff.png + name: ${{ env.PLAYWRIGHT_SNAPSHOTS_ARTIFACTS_KEY }} + if-no-files-found: ignore + retention-days: 1 concurrency: group: e2e-${{ github.workflow }}-${{ github.ref }} diff --git a/.gitignore b/.gitignore index ba6015e7f6d8e..f7026e28cc88f 100644 --- a/.gitignore +++ b/.gitignore @@ -34,3 +34,7 @@ dist RELEASE_BODY.md *tsbuildinfo .angular +/projects/demo-playwright/tests-results/ +/projects/demo-playwright/tests-report/ +/projects/demo-playwright/snapshots/ +/projects/demo-playwright/playwright/.cache/ diff --git a/package-lock.json b/package-lock.json index 78713dd6f100c..e47895c107d32 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,6 +45,7 @@ "@nx/jest": "16.5.5", "@nx/node": "16.5.5", "@nx/workspace": "16.5.5", + "@playwright/test": "^1.36.2", "@testing-library/cypress": "9.0.0", "@tinkoff/prettier-config": "1.52.1", "@tinkoff/stylelint-config": "1.52.1", @@ -6773,6 +6774,25 @@ "typescript": "^3 || ^4 || ^5" } }, + "node_modules/@playwright/test": { + "version": "1.36.2", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.36.2.tgz", + "integrity": "sha512-2rVZeyPRjxfPH6J0oGJqE8YxiM1IBRyM8hyrXYK7eSiAqmbNhxwcLa7dZ7fy9Kj26V7FYia5fh9XJRq4Dqme+g==", + "dev": true, + "dependencies": { + "@types/node": "*", + "playwright-core": "1.36.2" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=16" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, "node_modules/@popperjs/core": { "version": "2.11.8", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", @@ -30343,6 +30363,18 @@ "node": ">=8" } }, + "node_modules/playwright-core": { + "version": "1.36.2", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.36.2.tgz", + "integrity": "sha512-sQYZt31dwkqxOrP7xy2ggDfEzUxM1lodjhsQ3NMMv5uGTRDsLxU0e4xf4wwMkF2gplIxf17QMBCodSFgm6bFVQ==", + "dev": true, + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=16" + } + }, "node_modules/plist": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/plist/-/plist-3.1.0.tgz", @@ -40034,8 +40066,8 @@ "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", "@ng-web-apis/common": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "tslib": ">=2.0.0" } @@ -40052,9 +40084,9 @@ "@maskito/core": ">=1.3.0", "@maskito/kit": ">=1.3.0", "@ng-web-apis/common": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/i18n": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/i18n": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40079,10 +40111,10 @@ "@angular/forms": ">=12.0.0", "@angular/router": ">=12.0.0", "@ng-web-apis/common": ">=3.0.0", - "@taiga-ui/addon-mobile": ">=3.37.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/kit": ">=3.37.0", + "@taiga-ui/addon-mobile": ">=3.38.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/kit": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "tslib": ">=2.0.0" } @@ -40096,9 +40128,9 @@ "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", "@ng-web-apis/common": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/kit": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/kit": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40112,10 +40144,10 @@ "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", "@ng-web-apis/mutation-observer": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/i18n": ">=3.37.0", - "@taiga-ui/kit": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/i18n": ">=3.38.0", + "@taiga-ui/kit": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40129,10 +40161,10 @@ "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", "@ng-web-apis/intersection-observer": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/i18n": ">=3.37.0", - "@taiga-ui/kit": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/i18n": ">=3.38.0", + "@taiga-ui/kit": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40145,8 +40177,8 @@ "peerDependencies": { "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40186,7 +40218,7 @@ "version": "3.38.0", "license": "Apache-2.0", "dependencies": { - "@taiga-ui/i18n": "^3.38.0" + "@taiga-ui/i18n": "3.38.0" }, "peerDependencies": { "@angular/animations": ">=12.0.0", @@ -40197,8 +40229,8 @@ "@angular/router": ">=12.0.0", "@ng-web-apis/common": ">=3.0.0", "@ng-web-apis/mutation-observer": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/i18n": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/i18n": ">=3.38.0", "@tinkoff/ng-event-plugins": ">=3.1.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", @@ -40401,7 +40433,7 @@ "eslint-plugin-unicorn": "45.0.2" }, "peerDependencies": { - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "eslint": "*", "tslib": ">=2.0.0" } @@ -40412,7 +40444,7 @@ "license": "Apache-2.0", "peerDependencies": { "@angular/core": ">=12.0.0", - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "tslib": ">=2.0.0" } }, @@ -40430,7 +40462,7 @@ "tslib": "2.6.1" }, "peerDependencies": { - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "tslib": ">=2.0.0" } }, @@ -40459,9 +40491,9 @@ "@ng-web-apis/common": ">=3.0.0", "@ng-web-apis/mutation-observer": ">=3.0.0", "@ng-web-apis/resize-observer": ">=3.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", - "@taiga-ui/i18n": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", + "@taiga-ui/i18n": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40474,8 +40506,8 @@ "peerDependencies": { "@angular/common": ">=12.0.0", "@angular/core": ">=12.0.0", - "@taiga-ui/cdk": ">=3.37.0", - "@taiga-ui/core": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", + "@taiga-ui/core": ">=3.38.0", "@tinkoff/ng-polymorpheus": ">=4.0.0", "rxjs": ">=6.0.0", "tslib": ">=2.0.0" @@ -40485,7 +40517,7 @@ "name": "@taiga-ui/styles", "version": "3.38.0", "peerDependencies": { - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "tslib": ">=2.0.0" } }, @@ -40494,10 +40526,10 @@ "version": "3.38.0", "license": "Apache-2.0", "dependencies": { - "@taiga-ui/cdk": "^3.38.0" + "@taiga-ui/cdk": "3.38.0" }, "peerDependencies": { - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "tslib": ">=2.0.0" } }, @@ -40518,7 +40550,7 @@ "ts-jest": "29.1.1" }, "peerDependencies": { - "@taiga-ui/cdk": ">=3.37.0", + "@taiga-ui/cdk": ">=3.38.0", "tslib": ">=2.0.0" } } diff --git a/package.json b/package.json index 98e42350932eb..523c0c30889f1 100644 --- a/package.json +++ b/package.json @@ -101,6 +101,7 @@ "@nx/jest": "16.5.5", "@nx/node": "16.5.5", "@nx/workspace": "16.5.5", + "@playwright/test": "^1.36.2", "@testing-library/cypress": "9.0.0", "@tinkoff/prettier-config": "1.52.1", "@tinkoff/stylelint-config": "1.52.1", diff --git a/projects/demo-playwright/playwright.config.ts b/projects/demo-playwright/playwright.config.ts new file mode 100644 index 0000000000000..6790fcf478201 --- /dev/null +++ b/projects/demo-playwright/playwright.config.ts @@ -0,0 +1,36 @@ +import {defineConfig, devices} from '@playwright/test'; + +/** + * See https://playwright.dev/docs/test-configuration. + */ +export default defineConfig({ + testDir: __dirname, + testMatch: `**/*.spec.ts`, + outputDir: `tests-results`, + snapshotDir: `snapshots`, + reporter: process.env.CI ? `github` : [[`html`, {outputFolder: `tests-report`}]], + fullyParallel: true, + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + retries: process.env.CI ? 2 : 0, + use: { + baseURL: `http://localhost:${process.env.NG_SERVER_PORT || 3333}`, + trace: `on-first-retry`, + }, + projects: [ + { + name: `chromium`, + use: {...devices[`Desktop Chrome`]}, + }, + { + name: `webkit`, + use: {...devices[`Desktop Safari`]}, + }, + ], + expect: { + toHaveScreenshot: { + animations: `disabled`, + caret: `hide`, + }, + }, +}); diff --git a/projects/demo-playwright/project.json b/projects/demo-playwright/project.json new file mode 100644 index 0000000000000..58ec1fd14c1a3 --- /dev/null +++ b/projects/demo-playwright/project.json @@ -0,0 +1,33 @@ +{ + "name": "demo-playwright", + "$schema": "../../node_modules/nx/schemas/project-schema.json", + "sourceRoot": "projects/demo-playwright/cypress", + "projectType": "application", + "prefix": "app", + "targets": { + "lint": { + "executor": "nx:run-commands", + "options": { + "command": "eslint --no-error-on-unmatched-pattern \"**/projects/demo-playwright/**/*\"" + } + }, + "stylelint": { + "executor": "nx:run-commands", + "options": { + "command": "stylelint \"**/demo-playwright/**/*.{css,less}\" --allow-empty-input" + } + }, + "e2e": { + "executor": "nx:run-commands", + "options": { + "command": "npx playwright test --config projects/demo-playwright/playwright.config.ts" + } + }, + "e2e-ui": { + "executor": "nx:run-commands", + "options": { + "command": "npx nx e2e demo-playwright -- --ui" + } + } + } +} diff --git a/projects/demo-playwright/tests/example.spec.ts b/projects/demo-playwright/tests/example.spec.ts new file mode 100644 index 0000000000000..e4a14ba82d0d5 --- /dev/null +++ b/projects/demo-playwright/tests/example.spec.ts @@ -0,0 +1,17 @@ +import {expect, test} from '@playwright/test'; + +test(`has title`, async ({page}) => { + await page.goto(`/getting-started`); + + // Expect a title "to contain" a substring. + await expect(page).toHaveTitle(`Taiga UI: Getting started`); +}); + +test(`debug screenshot`, async ({page}) => { + await page.goto(`/components/mobile-calendar`); + await page.locator(`tui-mobile-calendar-example-1 button`).first().click(); + + await expect(page.locator(`tui-dialog tui-mobile-calendar`)).toHaveScreenshot( + `test-playwright-screenshot.png`, + ); +}); diff --git a/projects/demo/src/modules/components/mobile-calendar/examples/1/index.ts b/projects/demo/src/modules/components/mobile-calendar/examples/1/index.ts index 479402ffe083c..2dd04dc80dc02 100644 --- a/projects/demo/src/modules/components/mobile-calendar/examples/1/index.ts +++ b/projects/demo/src/modules/components/mobile-calendar/examples/1/index.ts @@ -18,7 +18,7 @@ import {map} from 'rxjs/operators'; encapsulation, }) export class TuiMobileCalendarExample1 { - private readonly control = new FormControl(new TuiDay(2024, 9, 3)); + private readonly control = new FormControl(new TuiDay(2021, 9, 3)); private readonly dialog$: Observable;