From 4b5843ed5d2f042c2b88b0d325bbaa5046c00e71 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 2 Mar 2022 09:23:18 -0500 Subject: [PATCH 01/11] test(): update other tests to use the new path update (#24841) --- core/src/components/action-sheet/test/test.utils.ts | 2 +- core/src/components/alert/test/test.utils.ts | 2 +- core/src/components/fab/test/test.utils.ts | 2 +- core/src/components/footer/test/translucent/e2e.ts | 2 +- core/src/components/header/test/translucent/e2e.ts | 2 +- core/src/components/loading/test/test.utils.ts | 2 +- core/src/components/menu/test/test.utils.ts | 2 +- core/src/components/picker-column/test/test.utils.ts | 2 +- core/src/components/popover/test/test.utils.ts | 2 +- core/src/components/reorder-group/test/interactive/e2e.ts | 2 +- core/src/components/reorder-group/test/test.utils.ts | 2 +- core/src/components/toast/test/test.utils.ts | 2 +- 12 files changed, 12 insertions(+), 12 deletions(-) diff --git a/core/src/components/action-sheet/test/test.utils.ts b/core/src/components/action-sheet/test/test.utils.ts index b0b9909d55..2079318ed3 100644 --- a/core/src/components/action-sheet/test/test.utils.ts +++ b/core/src/components/action-sheet/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testActionSheet = async ( type: string, diff --git a/core/src/components/alert/test/test.utils.ts b/core/src/components/alert/test/test.utils.ts index e7790d1ef7..a4d62a59d2 100644 --- a/core/src/components/alert/test/test.utils.ts +++ b/core/src/components/alert/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testAlert = async ( type: string, diff --git a/core/src/components/fab/test/test.utils.ts b/core/src/components/fab/test/test.utils.ts index f3aa9c5d6c..79e017800e 100644 --- a/core/src/components/fab/test/test.utils.ts +++ b/core/src/components/fab/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testFab = async ( type: string, diff --git a/core/src/components/footer/test/translucent/e2e.ts b/core/src/components/footer/test/translucent/e2e.ts index c70b74f68c..ee44d0fc2c 100644 --- a/core/src/components/footer/test/translucent/e2e.ts +++ b/core/src/components/footer/test/translucent/e2e.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { checkComponentModeClasses } from '../../../../utils/test/utils'; +import { checkComponentModeClasses } from '@utils/test'; test('footer: translucent', async () => { const page = await newE2EPage({ diff --git a/core/src/components/header/test/translucent/e2e.ts b/core/src/components/header/test/translucent/e2e.ts index 50bfd89931..3fe93c81a0 100644 --- a/core/src/components/header/test/translucent/e2e.ts +++ b/core/src/components/header/test/translucent/e2e.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { checkComponentModeClasses } from '../../../../utils/test/utils'; +import { checkComponentModeClasses } from '@utils/test'; test('header: translucent', async () => { const page = await newE2EPage({ diff --git a/core/src/components/loading/test/test.utils.ts b/core/src/components/loading/test/test.utils.ts index 05867f018b..ea410b87dc 100644 --- a/core/src/components/loading/test/test.utils.ts +++ b/core/src/components/loading/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testLoading = async ( type: string, diff --git a/core/src/components/menu/test/test.utils.ts b/core/src/components/menu/test/test.utils.ts index 34d0c1a7be..f303e29684 100644 --- a/core/src/components/menu/test/test.utils.ts +++ b/core/src/components/menu/test/test.utils.ts @@ -1,7 +1,7 @@ import { newE2EPage } from '@stencil/core/testing'; import { menuController } from '../../../utils/menu-controller'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testMenu = async ( type: string, diff --git a/core/src/components/picker-column/test/test.utils.ts b/core/src/components/picker-column/test/test.utils.ts index 894c9a0b93..05122cd376 100644 --- a/core/src/components/picker-column/test/test.utils.ts +++ b/core/src/components/picker-column/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { dragElementBy, generateE2EUrl, listenForEvent, waitForFunctionTestContext } from '../../../utils/test/utils'; +import { dragElementBy, generateE2EUrl, listenForEvent, waitForFunctionTestContext } from '@utils/test'; export const testPickerColumn = async ( type: string, diff --git a/core/src/components/popover/test/test.utils.ts b/core/src/components/popover/test/test.utils.ts index 44f17d96c1..32e6863a2a 100644 --- a/core/src/components/popover/test/test.utils.ts +++ b/core/src/components/popover/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testPopover = async ( type: string, diff --git a/core/src/components/reorder-group/test/interactive/e2e.ts b/core/src/components/reorder-group/test/interactive/e2e.ts index 0c2488fef3..66e3a593e0 100644 --- a/core/src/components/reorder-group/test/interactive/e2e.ts +++ b/core/src/components/reorder-group/test/interactive/e2e.ts @@ -1,7 +1,7 @@ import * as pd from '@stencil/core/dist/testing/puppeteer/puppeteer-declarations'; import { newE2EPage } from '@stencil/core/testing'; -import { getElementProperty, queryDeep } from '../../../../utils/test/utils'; +import { getElementProperty, queryDeep } from '@utils/test'; import { moveReorderItem } from '../test.utils'; test('reorder: interactive', async () => { diff --git a/core/src/components/reorder-group/test/test.utils.ts b/core/src/components/reorder-group/test/test.utils.ts index e437810465..d6a2a95d04 100644 --- a/core/src/components/reorder-group/test/test.utils.ts +++ b/core/src/components/reorder-group/test/test.utils.ts @@ -1,6 +1,6 @@ import * as pd from '@stencil/core/testing'; -import { dragElementBy, queryDeep } from '../../../utils/test/utils'; +import { dragElementBy, queryDeep } from '@utils/test'; /** * Moves a reorder item by simulating a drag event diff --git a/core/src/components/toast/test/test.utils.ts b/core/src/components/toast/test/test.utils.ts index e4835e7ac6..657d3dc162 100644 --- a/core/src/components/toast/test/test.utils.ts +++ b/core/src/components/toast/test/test.utils.ts @@ -1,6 +1,6 @@ import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '../../../utils/test/utils'; +import { generateE2EUrl } from '@utils/test'; export const testToast = async ( type: string, From 7131e449e52eb95ab5853878fda401f24209ddfc Mon Sep 17 00:00:00 2001 From: flroent <57233454+flroent@users.noreply.github.com> Date: Wed, 2 Mar 2022 18:13:57 +0100 Subject: [PATCH 02/11] docs(loading): remove extra script tag from vue example --- core/src/components/loading/readme.md | 2 -- core/src/components/loading/usage/vue.md | 2 -- 2 files changed, 4 deletions(-) diff --git a/core/src/components/loading/readme.md b/core/src/components/loading/readme.md index c788b02f11..f72094383d 100644 --- a/core/src/components/loading/readme.md +++ b/core/src/components/loading/readme.md @@ -289,8 +289,6 @@ export class LoadingExample { Show Loading - + + + + + + + + + + + + diff --git a/core/src/utils/test/utils.ts b/core/src/utils/test/utils.ts index 99f2c7dfe4..196535a745 100644 --- a/core/src/utils/test/utils.ts +++ b/core/src/utils/test/utils.ts @@ -77,26 +77,34 @@ export const listenForEvent = async (page: any, eventType: string, element: any, * @param page - The Puppeteer 'page' object * @param x: number - Amount to drag `element` by on the x-axis * @param y: number - Amount to drag `element` by on the y-axis + * @param startCoordinates (optional) - Coordinates of where to start the drag + * gesture. If not provided, the drag gesture will start in the middle of the + * element. */ -export const dragElementBy = async (element: any, page: any, x = 0, y = 0): Promise => { +export const dragElementBy = async ( + element: any, + page: any, + x = 0, + y = 0, + startCoordinates?: { x: number, y: number } +): Promise => { try { const boundingBox = await element.boundingBox(); - const startX = boundingBox.x + boundingBox.width / 2; - const startY = boundingBox.y + boundingBox.height / 2; + const startX = (startCoordinates?.x === undefined) ? boundingBox.x + boundingBox.width / 2 : startCoordinates.x; + const startY = (startCoordinates?.y === undefined) ? boundingBox.y + boundingBox.height / 2 : startCoordinates.y; + + const midX = startX + (x / 2); + const midY = startY + (y / 2); const endX = startX + x; const endY = startY + y; - const midX = endX / 2; - const midY = endY / 2; - await page.mouse.move(startX, startY); await page.mouse.down(); await page.mouse.move(midX, midY); await page.mouse.move(endX, endY); await page.mouse.up(); - } catch (err) { throw err; } From f6cde30d3efafa1b9df842894d858bcfd50d617a Mon Sep 17 00:00:00 2001 From: SirMathelot <62252088+SirMathelot@users.noreply.github.com> Date: Mon, 7 Mar 2022 15:24:05 +0100 Subject: [PATCH 10/11] docs(button): fix fill attribute typo (#24890) --- core/src/components/button/readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/components/button/readme.md b/core/src/components/button/readme.md index c280c8838a..d39d7eab3c 100644 --- a/core/src/components/button/readme.md +++ b/core/src/components/button/readme.md @@ -13,7 +13,7 @@ This attribute lets you specify how wide the button should be. By default, butto ## Fill -This attributes determines the background and border color of the button. By default, buttons have a solid background unless the button is inside of a toolbar, in which case it has a transparent background. +This attribute determines the background and border color of the button. By default, buttons have a solid background unless the button is inside of a toolbar, in which case it has a transparent background. | Value | Details | |----------------|------------------------------------------------------------------------------| From 8ed948e647cff0e67de3447b039a87cd895d6038 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 7 Mar 2022 11:05:30 -0500 Subject: [PATCH 11/11] docs(infinite-scroll): update typings for Vue example (#24892) Co-authored-by: ThomasHambach --- core/src/components/infinite-scroll/readme.md | 7 ++++--- core/src/components/infinite-scroll/usage/vue.md | 7 ++++--- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/core/src/components/infinite-scroll/readme.md b/core/src/components/infinite-scroll/readme.md index 9e6358f38b..6f7a35f30d 100644 --- a/core/src/components/infinite-scroll/readme.md +++ b/core/src/components/infinite-scroll/readme.md @@ -335,7 +335,8 @@ export class InfiniteScrollExample {