From fc144656b9c12776c11403d2933c9e8c02bdcd59 Mon Sep 17 00:00:00 2001 From: null Date: Sat, 28 Dec 2024 11:33:29 +0000 Subject: [PATCH] chore: update dependency lint-staged to v15.3.0 --- package-lock.json | 24 +++---------- package.json | 2 +- .../tests/core/data-list/data-list.pw.spec.ts | 35 ++++++++----------- .../action-bar/action-bar.mobile.pw.spec.ts | 10 +++++- .../kit/action-bar/action-bar.pw.spec.ts | 12 ++++++- .../legacy/combo-box/combobox.pw.spec.ts | 18 +++++++--- .../utils/scroll-to-example.ts | 10 ++++++ 7 files changed, 64 insertions(+), 47 deletions(-) create mode 100644 projects/demo-playwright/utils/scroll-to-example.ts diff --git a/package-lock.json b/package-lock.json index 3434542d7210..3fd7ea8d1ddf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -44,7 +44,7 @@ "@types/webpack-env": "1.18.5", "cpy-cli": "5.0.0", "husky": "9.1.7", - "lint-staged": "15.2.11", + "lint-staged": "15.3.0", "ng-morph": "4.8.4", "ng-packagr": "16.2.3", "ngx-highlightjs": "10.0.0", @@ -14014,7 +14014,6 @@ "integrity": "sha512-zgVZuo2WcZgfUEmsn6eO3kINexW8RAE4maiQ8QNs8CtpPCSyMiYsULR3HQYkm3w8FIA3SberyMJMSldGsW+U3w==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": "^12.17.0 || ^14.13 || >=16.0.0" }, @@ -27400,13 +27399,13 @@ } }, "node_modules/lint-staged": { - "version": "15.2.11", - "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-15.2.11.tgz", - "integrity": "sha512-Ev6ivCTYRTGs9ychvpVw35m/bcNDuBN+mnTeObCL5h+boS5WzBEC6LHI4I9F/++sZm1m+J2LEiy0gxL/R9TBqQ==", + "version": "15.3.0", + "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-15.3.0.tgz", + "integrity": "sha512-vHFahytLoF2enJklgtOtCtIjZrKD/LoxlaUusd5nh7dWv/dkKQJY74ndFSzxCdv7g0ueGg1ORgTSt4Y9LPZn9A==", "dev": true, "license": "MIT", "dependencies": { - "chalk": "~5.3.0", + "chalk": "~5.4.1", "commander": "~12.1.0", "debug": "~4.4.0", "execa": "~8.0.1", @@ -27469,19 +27468,6 @@ "url": "https://github.com/chalk/ansi-styles?sponsor=1" } }, - "node_modules/lint-staged/node_modules/chalk": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz", - "integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==", - "dev": true, - "license": "MIT", - "engines": { - "node": "^12.17.0 || ^14.13 || >=16.0.0" - }, - "funding": { - "url": "https://github.com/chalk/chalk?sponsor=1" - } - }, "node_modules/lint-staged/node_modules/cli-cursor": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz", diff --git a/package.json b/package.json index ff7fb7ba8250..26c25dbc08fd 100644 --- a/package.json +++ b/package.json @@ -174,7 +174,7 @@ "@types/webpack-env": "1.18.5", "cpy-cli": "5.0.0", "husky": "9.1.7", - "lint-staged": "15.2.11", + "lint-staged": "15.3.0", "ng-morph": "4.8.4", "ng-packagr": "16.2.3", "ngx-highlightjs": "10.0.0", diff --git a/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts b/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts index 59843279f108..8172e05a3330 100644 --- a/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts +++ b/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts @@ -2,6 +2,8 @@ import {DemoRoute} from '@demo/routes'; import {TuiDocumentationPagePO, tuiGoto} from '@demo-playwright/utils'; import {expect, test} from '@playwright/test'; +import {scrollToExample} from '../../../utils/scroll-to-example'; + test.describe('DataList', () => { test('Custom list', async ({page}) => { await tuiGoto(page, DemoRoute.DataList); @@ -9,7 +11,7 @@ test.describe('DataList', () => { const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#custom'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await example.locator('tui-select').click(); await page.locator('tui-dropdown [tuiOption]').nth(0).hover(); @@ -21,7 +23,7 @@ test.describe('DataList', () => { const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#links'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await example.locator('[tuiDropdownOpen]').click(); await page.locator('tui-dropdown [tuiOption]').nth(0).hover(); await page.waitForTimeout(300); @@ -42,7 +44,7 @@ test.describe('DataList', () => { const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#submenu'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await documentationPagePO.prepareBeforeScreenshot(); await example.locator('button').click(); @@ -93,40 +95,29 @@ test.describe('DataList', () => { await expect(page).toHaveScreenshot('03-8-data-list.png'); }); - test('Form control', async ({page, browserName}) => { - test.skip( - browserName !== 'chromium', - // TODO: why does this test keep failing in safari - 'This feature is only relevant in Chrome', - ); - + test('Form control', async ({page}) => { await tuiGoto(page, DemoRoute.DataList); const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#control'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await example.locator('button').first().click(); - await documentationPagePO.prepareBeforeScreenshot(); await expect(page.locator('tui-dropdown')).toHaveScreenshot('04-data-list.png'); }); - test('Complex', async ({page, browserName}) => { - test.skip( - browserName !== 'chromium', - // TODO: check later - 'This feature is only relevant in Chrome', - ); - + test('Complex', async ({page}) => { await page.setViewportSize({width: 1400, height: 500}); await tuiGoto(page, DemoRoute.DataList); const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#complex'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await example.locator('button').click(); + + await documentationPagePO.hideContent(); await documentationPagePO.prepareBeforeScreenshot(); await expect(page).toHaveScreenshot('05-data-list.png'); @@ -181,8 +172,10 @@ test.describe('DataList', () => { const documentationPagePO = new TuiDocumentationPagePO(page); const example = documentationPagePO.getExample('#long-text-options'); - await example.scrollIntoViewIfNeeded(); + await scrollToExample(page, example); await example.locator('button').click(); + + await documentationPagePO.hideContent(); await documentationPagePO.prepareBeforeScreenshot(); await expect(page).toHaveScreenshot('10-data-list.png'); diff --git a/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.pw.spec.ts b/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.pw.spec.ts index 7831652bfe51..1c03a14ee586 100644 --- a/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.pw.spec.ts +++ b/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.pw.spec.ts @@ -1,5 +1,5 @@ import {DemoRoute} from '@demo/routes'; -import {tuiGoto} from '@demo-playwright/utils'; +import {TuiDocumentationApiPagePO, tuiGoto} from '@demo-playwright/utils'; import {expect, test} from '@playwright/test'; import { @@ -19,18 +19,26 @@ test.describe('ActionBar', () => { test('works', async ({page}) => { await tuiGoto(page, DemoRoute.ActionBar); + + const api = new TuiDocumentationApiPagePO(page); const example = page.locator('#size--m'); const showActionBarButton = example.locator('label').first(); await showActionBarButton.click(); const actionBarExample = page.locator('tui-action-bar'); + await api.hideContent(); + await api.prepareBeforeScreenshot(); + await expect(actionBarExample).toHaveScreenshot('01-actions-bar-mobile.png'); const more = actionBarExample.locator('button:has-text("More")'); await more.click(); + await api.hideContent(); + await api.prepareBeforeScreenshot(); + await expect(actionBarExample).toHaveScreenshot( '01-action-bar-mobile-expanded.png', ); diff --git a/projects/demo-playwright/tests/kit/action-bar/action-bar.pw.spec.ts b/projects/demo-playwright/tests/kit/action-bar/action-bar.pw.spec.ts index 4c294464c93a..1fba1242f332 100644 --- a/projects/demo-playwright/tests/kit/action-bar/action-bar.pw.spec.ts +++ b/projects/demo-playwright/tests/kit/action-bar/action-bar.pw.spec.ts @@ -1,5 +1,5 @@ import {DemoRoute} from '@demo/routes'; -import {tuiGoto} from '@demo-playwright/utils'; +import {TuiDocumentationApiPagePO, tuiGoto} from '@demo-playwright/utils'; import {expect, test} from '@playwright/test'; test.describe('ActionBar', () => { @@ -9,23 +9,33 @@ test.describe('ActionBar', () => { test('works', async ({page}) => { await tuiGoto(page, DemoRoute.ActionBar); + + const api = new TuiDocumentationApiPagePO(page); const example = page.locator('#size--m'); const showActionBarButton = example.locator('label').first(); await showActionBarButton.click(); const actionBarExample = page.locator('tui-action-bar'); + await api.hideContent(); + await api.prepareBeforeScreenshot(); + await expect(actionBarExample).toHaveScreenshot('01-actions-bar.png'); }); test('should show on top', async ({page}) => { await tuiGoto(page, DemoRoute.ActionBar); + + const api = new TuiDocumentationApiPagePO(page); const example = page.locator('#top-position'); const showActionBarButton = example.getByTestId('open-table-bar-on-top').first(); await showActionBarButton.click(); const actionBarExample = page.locator('tui-action-bar'); + await api.hideContent(); + await api.prepareBeforeScreenshot(); + await expect(actionBarExample).toHaveScreenshot('02-actions-bar.png'); }); }); diff --git a/projects/demo-playwright/tests/legacy/combo-box/combobox.pw.spec.ts b/projects/demo-playwright/tests/legacy/combo-box/combobox.pw.spec.ts index 6d52dc6f53e5..0efda06b169d 100644 --- a/projects/demo-playwright/tests/legacy/combo-box/combobox.pw.spec.ts +++ b/projects/demo-playwright/tests/legacy/combo-box/combobox.pw.spec.ts @@ -1,7 +1,14 @@ import {DemoRoute} from '@demo/routes'; -import {TuiComboBoxPO, TuiDocumentationPagePO, tuiGoto} from '@demo-playwright/utils'; +import { + TuiComboBoxPO, + TuiDocumentationPagePO, + tuiGoto, + waitIcons, +} from '@demo-playwright/utils'; import {expect, test} from '@playwright/test'; +import {scrollToExample} from '../../../utils/scroll-to-example'; + test.describe('ComboBox', () => { test.use({viewport: {width: 500, height: 500}}); @@ -12,8 +19,7 @@ test.describe('ComboBox', () => { const example = documentationPage.getExample('#ignore-disabled'); const input = example.locator('tui-combo-box input[tuiTextfieldLegacy]'); - await example.scrollIntoViewIfNeeded(); - await page.waitForTimeout(300); // safari flaky + await scrollToExample(page, example); await input.click(); await expect(page).toHaveScreenshot('01-combobox-dont-allow-disabled-01.png'); @@ -23,6 +29,7 @@ test.describe('ComboBox', () => { await expect(page).toHaveScreenshot('01-combobox-dont-allow-disabled-02.png'); await page.click('body'); + await scrollToExample(page, example); await expect(page).toHaveScreenshot('01-combobox-dont-allow-disabled-03.png'); @@ -46,7 +53,10 @@ test.describe('ComboBox', () => { const comboBoxPO = new TuiComboBoxPO(apiPageExample); const textfield = comboBoxPO.textfield.first(); - await page.waitForTimeout(300); // safari flaky + await waitIcons({ + page, + icons: await page.locator('tui-icon >> visible=true').all(), + }); await expect(page).toHaveScreenshot( `search-should-not-be-reset-strict-${strict}.png`, diff --git a/projects/demo-playwright/utils/scroll-to-example.ts b/projects/demo-playwright/utils/scroll-to-example.ts new file mode 100644 index 000000000000..64fd956db9c0 --- /dev/null +++ b/projects/demo-playwright/utils/scroll-to-example.ts @@ -0,0 +1,10 @@ +import type {Locator, Page} from '@playwright/test'; + +export async function scrollToExample(page: Page, example: Locator): Promise { + await page.evaluate( + (view) => window.scrollTo({top: view?.y, behavior: 'auto'}), + await example.boundingBox(), + ); + + await page.waitForTimeout(500); // flaky +}