From 0a0730bad79ce75856d937df0890b117b076e436 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Alba=20Rinc=C3=B3n?= Date: Thu, 4 Apr 2024 17:13:06 +0200 Subject: [PATCH] [CYS] Stop relying on snapshot for footer and header tests (#46221) * Stop relying on snapshot for footer and header tests * Remove only * Add changefile(s) from automation for the following project(s): woocommerce --------- Co-authored-by: github-actions --- .../changelog/46221-fix-header-tests | 4 + .../customize-store/assembler/footer.spec.js | 19 ++--- .../cys-selected-footer-Chrome | 47 ------------ .../customize-store/assembler/header.spec.js | 26 +++---- .../cys-selected-header-Chrome | 76 ------------------- 5 files changed, 27 insertions(+), 145 deletions(-) create mode 100644 plugins/woocommerce/changelog/46221-fix-header-tests delete mode 100644 plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js-snapshots/cys-selected-footer-Chrome delete mode 100644 plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js-snapshots/cys-selected-header-Chrome diff --git a/plugins/woocommerce/changelog/46221-fix-header-tests b/plugins/woocommerce/changelog/46221-fix-header-tests new file mode 100644 index 00000000000..21496ccd8da --- /dev/null +++ b/plugins/woocommerce/changelog/46221-fix-header-tests @@ -0,0 +1,4 @@ +Significance: minor +Type: dev + +[CYS] Update footer and header test to not use snapshots. \ No newline at end of file diff --git a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js index 6aa413500fb..a944c959b09 100644 --- a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js +++ b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js @@ -109,12 +109,15 @@ test.describe( 'Assembler -> Footers', () => { assemblerPage, page, baseURL, - }, testInfo ) => { - testInfo.snapshotSuffix = ''; + } ) => { const assembler = await assemblerPage.getAssembler(); const footer = assembler .locator( '.block-editor-block-patterns-list__item' ) - .nth( 2 ); + .nth( 2 ) + .frameLocator( 'iframe' ) + .locator( '.wc-blocks-footer-pattern' ); + + const expectedFooterClass = extractFooterClass( await footer.getAttribute( 'class' ) ); await footer.click(); @@ -131,17 +134,15 @@ test.describe( 'Assembler -> Footers', () => { await waitResponse; await page.goto( baseURL ); - const footerHTML = await page.locator( 'footer' ).innerHTML(); - // The snapshot is created in headless mode. Please make sure the browser is in headless mode to ensure the snapshot is correct. - expect( footerHTML ).toMatchSnapshot( { - name: 'cys-selected-footer', - } ); + const selectedFooterClasses = await page.locator( 'footer div.wc-blocks-footer-pattern' ).getAttribute( 'class' ); + + expect( selectedFooterClasses ).toContain( expectedFooterClass ); } ); test( 'Picking a footer should trigger an update on the site preview', async ( { assemblerPage, - }, testInfo ) => { + } ) => { const assembler = await assemblerPage.getAssembler(); const editor = await assemblerPage.getEditor(); diff --git a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js-snapshots/cys-selected-footer-Chrome b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js-snapshots/cys-selected-footer-Chrome deleted file mode 100644 index 6b04612b3d9..00000000000 --- a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/footer.spec.js-snapshots/cys-selected-footer-Chrome +++ /dev/null @@ -1,47 +0,0 @@ - -
-
-
-
- - -
Join the community
- - - -

Learn about new products and discounts

- - - - -
-
- - - -
- - - -
- - - -
-
- - - -

WooCommerce Core E2E Test Suite

- - -

- Powered by WordPress with WooCommerce

-
-
diff --git a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js index c40aae3383f..16f4759cf12 100644 --- a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js +++ b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js @@ -105,16 +105,19 @@ test.describe( 'Assembler -> headers', () => { await expect( assembler.getByText( 'Done' ) ).toBeEnabled(); } ); - test.skip( 'The selected header should be applied on the frontend', async ( { + test( 'The selected header should be applied on the frontend', async ( { assemblerPage, page, baseURL, - }, testInfo ) => { - testInfo.snapshotSuffix = ''; + } ) => { const assembler = await assemblerPage.getAssembler(); - const header = assembler - .locator( '.block-editor-block-patterns-list__item' ) - .nth( 1 ); + const header = await assembler + .locator( '.block-editor-block-patterns-list__list-item' ) + .nth( 1 ) + .frameLocator( 'iframe' ) + .locator( '.wc-blocks-header-pattern' ); + + const expectedHeaderClass = extractHeaderClass( await header.getAttribute( 'class' ) ); await header.click(); @@ -131,17 +134,14 @@ test.describe( 'Assembler -> headers', () => { await waitResponse; await page.goto( baseURL ); - const headerHTML = await page.locator( 'header' ).innerHTML(); + const selectedHeaderClasses = await page.locator( 'header div.wc-blocks-header-pattern' ).getAttribute( 'class' ); - // The snapshot is created in headless mode. Please make sure the browser is in headless mode to ensure the snapshot is correct. - expect( headerHTML ).toMatchSnapshot( { - name: 'cys-selected-header', - } ); + expect( selectedHeaderClasses ).toContain( expectedHeaderClass ); } ); test( 'Picking a header should trigger an update on the site preview', async ( { assemblerPage, - }, testInfo ) => { + } ) => { const assembler = await assemblerPage.getAssembler(); const editor = await assemblerPage.getEditor(); @@ -168,7 +168,7 @@ test.describe( 'Assembler -> headers', () => { const expectedHeaderClass = extractHeaderClass( headerPickerClass ); const headerPattern = await editor.locator( - `header div.wc-blocks-header-pattern` + 'header div.wc-blocks-header-pattern' ); await expect( diff --git a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js-snapshots/cys-selected-header-Chrome b/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js-snapshots/cys-selected-header-Chrome deleted file mode 100644 index 216538eb5be..00000000000 --- a/plugins/woocommerce/tests/e2e-pw/tests/customize-store/assembler/header.spec.js-snapshots/cys-selected-header-Chrome +++ /dev/null @@ -1,76 +0,0 @@ - -
-
- - - -
-
- - -
- -
- - -
-