From 304ac645b408af7383032bc983abef631bf702b4 Mon Sep 17 00:00:00 2001 From: Mario Santos Date: Mon, 3 Jun 2024 13:57:05 +0200 Subject: [PATCH 1/3] Use `openPreviewPage` instead of `publishPost` --- .../editor/various/block-bindings.spec.js | 116 +++++++----------- 1 file changed, 46 insertions(+), 70 deletions(-) diff --git a/test/e2e/specs/editor/various/block-bindings.spec.js b/test/e2e/specs/editor/various/block-bindings.spec.js index 87e5b2f2e10b1..3e49902e685b1 100644 --- a/test/e2e/specs/editor/various/block-bindings.spec.js +++ b/test/e2e/specs/editor/various/block-bindings.spec.js @@ -1170,7 +1170,6 @@ test.describe( 'Block bindings', () => { test.describe( 'Paragraph', () => { test( 'should show the value of the custom field when exists', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/paragraph', @@ -1195,19 +1194,14 @@ test.describe( 'Block bindings', () => { ); // Check the frontend shows the value of the custom field. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); + const previewPage = await editor.openPreviewPage(); await expect( - page.locator( '#paragraph-binding' ) - ).toBeVisible(); - await expect( page.locator( '#paragraph-binding' ) ).toHaveText( - 'Value of the text_custom_field' - ); + previewPage.locator( '#paragraph-binding' ) + ).toHaveText( 'Value of the text_custom_field' ); } ); test( "should show the value of the key when custom field doesn't exist", async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/paragraph', @@ -1237,16 +1231,14 @@ test.describe( 'Block bindings', () => { ); // Check the frontend doesn't show the content. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - await expect( page.locator( '#paragraph-binding' ) ).toHaveText( - 'fallback value' - ); + const previewPage = await editor.openPreviewPage(); + await expect( + previewPage.locator( '#paragraph-binding' ) + ).toHaveText( 'fallback value' ); } ); test( 'should not show the value of a protected meta field', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/paragraph', @@ -1268,16 +1260,14 @@ test.describe( 'Block bindings', () => { } ); await expect( paragraphBlock ).toHaveText( '_protected_field' ); // Check the frontend doesn't show the content. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - await expect( page.locator( '#paragraph-binding' ) ).toHaveText( - 'fallback value' - ); + const previewPage = await editor.openPreviewPage(); + await expect( + previewPage.locator( '#paragraph-binding' ) + ).toHaveText( 'fallback value' ); } ); test( 'should not show the value of a meta field with `show_in_rest` false', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/paragraph', @@ -1301,11 +1291,10 @@ test.describe( 'Block bindings', () => { 'show_in_rest_false_field' ); // Check the frontend doesn't show the content. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - await expect( page.locator( '#paragraph-binding' ) ).toHaveText( - 'fallback value' - ); + const previewPage = await editor.openPreviewPage(); + await expect( + previewPage.locator( '#paragraph-binding' ) + ).toHaveText( 'fallback value' ); } ); test( 'should add empty paragraph block when pressing enter', async ( { @@ -1412,7 +1401,6 @@ test.describe( 'Block bindings', () => { test.describe( 'Heading', () => { test( 'should show the value of the custom field', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/heading', @@ -1437,14 +1425,10 @@ test.describe( 'Block bindings', () => { ); // Check the frontend shows the value of the custom field. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); + const previewPage = await editor.openPreviewPage(); await expect( - page.locator( '#heading-binding' ) - ).toBeVisible(); - await expect( page.locator( '#heading-binding' ) ).toHaveText( - 'Value of the text_custom_field' - ); + previewPage.locator( '#heading-binding' ) + ).toHaveText( 'Value of the text_custom_field' ); } ); test( 'should add empty paragraph block when pressing enter', async ( { @@ -1498,7 +1482,6 @@ test.describe( 'Block bindings', () => { test.describe( 'Button', () => { test( 'should show the value of the custom field when text is bound', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/buttons', @@ -1533,10 +1516,10 @@ test.describe( 'Block bindings', () => { ); // Check the frontend shows the value of the custom field. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - const buttonDom = page.locator( '#button-text-binding a' ); - await expect( buttonDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const buttonDom = previewPage.locator( + '#button-text-binding a' + ); await expect( buttonDom ).toHaveText( 'Value of the text_custom_field' ); @@ -1548,7 +1531,6 @@ test.describe( 'Block bindings', () => { test( 'should use the value of the custom field when url is bound', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/buttons', @@ -1573,10 +1555,10 @@ test.describe( 'Block bindings', () => { } ); // Check the frontend shows the original value of the custom field. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - const buttonDom = page.locator( '#button-url-binding a' ); - await expect( buttonDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const buttonDom = previewPage.locator( + '#button-url-binding a' + ); await expect( buttonDom ).toHaveText( 'button default text' ); await expect( buttonDom ).toHaveAttribute( 'href', @@ -1586,7 +1568,6 @@ test.describe( 'Block bindings', () => { test( 'should use the values of the custom fields when text and url are bound', async ( { editor, - page, } ) => { await editor.insertBlock( { name: 'core/buttons', @@ -1615,10 +1596,10 @@ test.describe( 'Block bindings', () => { } ); // Check the frontend uses the values of the custom fields. - const postId = await editor.publishPost(); - await page.goto( `/?p=${ postId }` ); - const buttonDom = page.locator( '#button-multiple-bindings a' ); - await expect( buttonDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const buttonDom = previewPage.locator( + '#button-multiple-bindings a' + ); await expect( buttonDom ).toHaveText( 'Value of the text_custom_field' ); @@ -1701,8 +1682,6 @@ test.describe( 'Block bindings', () => { } ); test( 'should show the value of the custom field when url is bound', async ( { editor, - page, - BlockBindingsUtils, } ) => { await editor.insertBlock( { name: 'core/image', @@ -1732,10 +1711,10 @@ test.describe( 'Block bindings', () => { ); // Check the frontend uses the value of the custom field. - const postId = await BlockBindingsUtils.updatePost(); - await page.goto( `/?p=${ postId }` ); - const imageDom = page.locator( '#image-url-binding img' ); - await expect( imageDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const imageDom = previewPage.locator( + '#image-url-binding img' + ); await expect( imageDom ).toHaveAttribute( 'src', imageCustomFieldSrc @@ -1753,7 +1732,6 @@ test.describe( 'Block bindings', () => { test( 'should show value of the custom field in the alt textarea when alt is bound', async ( { editor, page, - BlockBindingsUtils, } ) => { await editor.insertBlock( { name: 'core/image', @@ -1793,10 +1771,10 @@ test.describe( 'Block bindings', () => { expect( altValue ).toBe( 'Value of the text_custom_field' ); // Check the frontend uses the value of the custom field. - const postId = await BlockBindingsUtils.updatePost(); - await page.goto( `/?p=${ postId }` ); - const imageDom = page.locator( '#image-alt-binding img' ); - await expect( imageDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const imageDom = previewPage.locator( + '#image-alt-binding img' + ); await expect( imageDom ).toHaveAttribute( 'src', imagePlaceholderSrc @@ -1814,7 +1792,6 @@ test.describe( 'Block bindings', () => { test( 'should show value of the custom field in the title input when title is bound', async ( { editor, page, - BlockBindingsUtils, } ) => { await editor.insertBlock( { name: 'core/image', @@ -1864,10 +1841,10 @@ test.describe( 'Block bindings', () => { expect( titleValue ).toBe( 'Value of the text_custom_field' ); // Check the frontend uses the value of the custom field. - const postId = await BlockBindingsUtils.updatePost(); - await page.goto( `/?p=${ postId }` ); - const imageDom = page.locator( '#image-title-binding img' ); - await expect( imageDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const imageDom = previewPage.locator( + '#image-title-binding img' + ); await expect( imageDom ).toHaveAttribute( 'src', imagePlaceholderSrc @@ -1885,7 +1862,6 @@ test.describe( 'Block bindings', () => { test( 'Multiple bindings should show the value of the custom fields', async ( { editor, page, - BlockBindingsUtils, } ) => { await editor.insertBlock( { name: 'core/image', @@ -1946,10 +1922,10 @@ test.describe( 'Block bindings', () => { expect( titleValue ).toBe( 'default title value' ); // Check the frontend uses the values of the custom fields. - const postId = await BlockBindingsUtils.updatePost(); - await page.goto( `/?p=${ postId }` ); - const imageDom = page.locator( '#image-multiple-bindings img' ); - await expect( imageDom ).toBeVisible(); + const previewPage = await editor.openPreviewPage(); + const imageDom = previewPage.locator( + '#image-multiple-bindings img' + ); await expect( imageDom ).toHaveAttribute( 'src', imageCustomFieldSrc From a5324a610808ca0768f3c20d14b23caa7be0ac6c Mon Sep 17 00:00:00 2001 From: Mario Santos Date: Mon, 3 Jun 2024 14:01:43 +0200 Subject: [PATCH 2/3] Remove unused `BlockBindingsUtils` --- .../editor/various/block-bindings.spec.js | 27 ------------------- 1 file changed, 27 deletions(-) diff --git a/test/e2e/specs/editor/various/block-bindings.spec.js b/test/e2e/specs/editor/various/block-bindings.spec.js index 3e49902e685b1..1efb1fe542526 100644 --- a/test/e2e/specs/editor/various/block-bindings.spec.js +++ b/test/e2e/specs/editor/various/block-bindings.spec.js @@ -30,12 +30,6 @@ test.describe( 'Block bindings', () => { await requestUtils.deactivatePlugin( 'gutenberg-test-block-bindings' ); } ); - test.use( { - BlockBindingsUtils: async ( { editor, page, pageUtils }, use ) => { - await use( new BlockBindingsUtils( { editor, page, pageUtils } ) ); - }, - } ); - test.describe( 'Template context', () => { test.beforeEach( async ( { admin, editor } ) => { await admin.visitSiteEditor( { @@ -2144,24 +2138,3 @@ test.describe( 'Block bindings', () => { } ); } ); } ); - -class BlockBindingsUtils { - constructor( { page } ) { - this.page = page; - } - - // Helper to update the post. - async updatePost() { - await this.page - .getByRole( 'region', { name: 'Editor top bar' } ) - .getByRole( 'button', { name: 'Save' } ) - .click(); - await this.page - .getByRole( 'button', { name: 'Dismiss this notice' } ) - .filter( { hasText: 'updated' } ) - .waitFor(); - const postId = new URL( this.page.url() ).searchParams.get( 'post' ); - - return typeof postId === 'string' ? parseInt( postId, 10 ) : null; - } -} From c8710f6396720c92cd2ee334437e9ead37a1b4d1 Mon Sep 17 00:00:00 2001 From: Mario Santos Date: Fri, 7 Jun 2024 12:03:02 +0200 Subject: [PATCH 3/3] Trigger CI