From e693443f235494f52030e25e30250a37a50b7ae7 Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Wed, 14 Sep 2022 23:40:16 +0600 Subject: [PATCH 1/6] Migrate iframed block test --- .../editor/plugins/iframed-block.test.js | 49 ------------------- .../editor/plugins/iframed-block.spec.js | 48 ++++++++++++++++++ 2 files changed, 48 insertions(+), 49 deletions(-) delete mode 100644 packages/e2e-tests/specs/editor/plugins/iframed-block.test.js create mode 100644 test/e2e/specs/editor/plugins/iframed-block.spec.js diff --git a/packages/e2e-tests/specs/editor/plugins/iframed-block.test.js b/packages/e2e-tests/specs/editor/plugins/iframed-block.test.js deleted file mode 100644 index 4107cbe5352f7b..00000000000000 --- a/packages/e2e-tests/specs/editor/plugins/iframed-block.test.js +++ /dev/null @@ -1,49 +0,0 @@ -/** - * WordPress dependencies - */ -import { - activatePlugin, - createNewPost, - deactivatePlugin, - insertBlock, - getEditedPostContent, - canvas, - createNewTemplate, -} from '@wordpress/e2e-test-utils'; - -describe( 'changing image size', () => { - beforeEach( async () => { - await activatePlugin( 'gutenberg-test-iframed-block' ); - await createNewPost( { postType: 'page' } ); - } ); - - afterEach( async () => { - await deactivatePlugin( 'gutenberg-test-iframed-block' ); - } ); - - it( 'should load script and dependencies in iframe', async () => { - await insertBlock( 'Iframed Block' ); - - expect( await getEditedPostContent() ).toMatchSnapshot(); - - const element = await page.waitForSelector( - '.wp-block-test-iframed-block' - ); - const text = await element.evaluate( ( el ) => el.textContent ); - - expect( text ).toBe( 'Iframed Block (set with jQuery)' ); - - await createNewTemplate( 'Iframed Test' ); - - const iframeElement = await canvas().waitForSelector( - '.wp-block-test-iframed-block' - ); - const iframedText = await iframeElement.evaluate( - ( el ) => el.textContent - ); - - // Expect the script to load in the iframe, which replaces the block - // text. - expect( iframedText ).toBe( 'Iframed Block (set with jQuery)' ); - } ); -} ); diff --git a/test/e2e/specs/editor/plugins/iframed-block.spec.js b/test/e2e/specs/editor/plugins/iframed-block.spec.js new file mode 100644 index 00000000000000..3ddedac73caf41 --- /dev/null +++ b/test/e2e/specs/editor/plugins/iframed-block.spec.js @@ -0,0 +1,48 @@ +/** + * WordPress dependencies + */ +const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' ); + +test.describe( 'changing image size', () => { + test.beforeEach( async ( { requestUtils, admin } ) => { + await requestUtils.activatePlugin( 'gutenberg-test-iframed-block' ); + await admin.createNewPost( { postType: 'page' } ); + } ); + + test.afterEach( async ( { requestUtils } ) => { + await requestUtils.deactivatePlugin( 'gutenberg-test-iframed-block' ); + } ); + + test( 'Should save the changes', async ( { editor, page } ) => { + await editor.insertBlock( { name: 'test/iframed-block' } ); + expect( await editor.getEditedPostContent() ).toMatchSnapshot(); + + const element = await page.waitForSelector( + '.wp-block-test-iframed-block' + ); + const text = await element.evaluate( ( el ) => el.textContent ); + + expect( text ).toBe( 'Iframed Block (set with jQuery)' ); + + // open page from sidebar settings + await page.click( '[aria-label="Page"]' ); + + // Opens the template editor with a newly created template. + await page.click( 'role=button[name="Select template"i]' ); + await page.click( 'role=button[name="Add template"i]' ); + await page.fill( 'role=textbox[name="NAME"i]', 'Test template' ); + await page.click( 'role=button[name="Create"i]' ); + + // Expect iframe canvas to be visible + await expect( + page.locator( 'iframe[name="editor-canvas"]' ) + ).toBeVisible(); + + // Expect the script to load in the iframe, which replaces the block text. + const iframedText = page.frameLocator( 'iframe' ).locator( 'body' ); + + await expect( iframedText ).toHaveText( + 'Iframed Block (set with jQuery)' + ); + } ); +} ); From 73345b3d4ea8dc5e96b53234e0591a54600bee8d Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Wed, 21 Sep 2022 21:17:09 +0600 Subject: [PATCH 2/6] fix: failed on CI --- ...size-Should-save-the-changes-1-chromium.txt | 3 +++ .../specs/editor/plugins/iframed-block.spec.js | 18 ++++++------------ 2 files changed, 9 insertions(+), 12 deletions(-) create mode 100644 test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt diff --git a/test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt b/test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt new file mode 100644 index 00000000000000..bcc47c713c778a --- /dev/null +++ b/test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt @@ -0,0 +1,3 @@ + +

Iframed Block (saved)

+ \ No newline at end of file diff --git a/test/e2e/specs/editor/plugins/iframed-block.spec.js b/test/e2e/specs/editor/plugins/iframed-block.spec.js index 3ddedac73caf41..a61e17aed3698f 100644 --- a/test/e2e/specs/editor/plugins/iframed-block.spec.js +++ b/test/e2e/specs/editor/plugins/iframed-block.spec.js @@ -17,12 +17,9 @@ test.describe( 'changing image size', () => { await editor.insertBlock( { name: 'test/iframed-block' } ); expect( await editor.getEditedPostContent() ).toMatchSnapshot(); - const element = await page.waitForSelector( - '.wp-block-test-iframed-block' - ); - const text = await element.evaluate( ( el ) => el.textContent ); - - expect( text ).toBe( 'Iframed Block (set with jQuery)' ); + await expect( + page.locator( 'role=document[name="Block: Iframed Block"i]' ) + ).toHaveText( 'Iframed Block (set with jQuery)' ); // open page from sidebar settings await page.click( '[aria-label="Page"]' ); @@ -38,11 +35,8 @@ test.describe( 'changing image size', () => { page.locator( 'iframe[name="editor-canvas"]' ) ).toBeVisible(); - // Expect the script to load in the iframe, which replaces the block text. - const iframedText = page.frameLocator( 'iframe' ).locator( 'body' ); - - await expect( iframedText ).toHaveText( - 'Iframed Block (set with jQuery)' - ); + await expect( + page.locator( 'role=document[name="Block: Iframed Block"i]' ) + ).toHaveText( 'Iframed Block (set with jQuery)' ); } ); } ); From 63eb45d64fe2dfc9bbc4f6269b58f864efd2d2b9 Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Wed, 21 Sep 2022 21:51:28 +0600 Subject: [PATCH 3/6] fix: failed from CI --- test/e2e/specs/editor/plugins/iframed-block.spec.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/test/e2e/specs/editor/plugins/iframed-block.spec.js b/test/e2e/specs/editor/plugins/iframed-block.spec.js index a61e17aed3698f..843db94a46887c 100644 --- a/test/e2e/specs/editor/plugins/iframed-block.spec.js +++ b/test/e2e/specs/editor/plugins/iframed-block.spec.js @@ -35,8 +35,10 @@ test.describe( 'changing image size', () => { page.locator( 'iframe[name="editor-canvas"]' ) ).toBeVisible(); - await expect( - page.locator( 'role=document[name="Block: Iframed Block"i]' ) - ).toHaveText( 'Iframed Block (set with jQuery)' ); + // Expect the script to load in the iframe, which replaces the block text. + const iframedText = page.frameLocator( 'iframe' ).locator( 'p' ); + await expect( iframedText.nth( 1 ) ).toHaveText( + 'Iframed Block (set with jQuery)' + ); } ); } ); From c8f8d192b773aaaee2a90d90798cb8d42a8df5e9 Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Wed, 21 Sep 2022 22:52:42 +0600 Subject: [PATCH 4/6] remove: snapshot from packages --- .../plugins/__snapshots__/iframed-block.test.js.snap | 7 ------- 1 file changed, 7 deletions(-) delete mode 100644 packages/e2e-tests/specs/editor/plugins/__snapshots__/iframed-block.test.js.snap diff --git a/packages/e2e-tests/specs/editor/plugins/__snapshots__/iframed-block.test.js.snap b/packages/e2e-tests/specs/editor/plugins/__snapshots__/iframed-block.test.js.snap deleted file mode 100644 index a4efcd222188ef..00000000000000 --- a/packages/e2e-tests/specs/editor/plugins/__snapshots__/iframed-block.test.js.snap +++ /dev/null @@ -1,7 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`changing image size should load script and dependencies in iframe 1`] = ` -" -

Iframed Block (saved)

-" -`; From a939dbe13d3a599f9d75c8dc1d7d573c67e89e9d Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Sun, 25 Sep 2022 19:56:33 +0600 Subject: [PATCH 5/6] update: addressed feedbacks --- ...ramed-block-Should-save-the-changes-1-chromium.txt} | 0 test/e2e/specs/editor/plugins/iframed-block.spec.js | 10 +++++----- 2 files changed, 5 insertions(+), 5 deletions(-) rename test/e2e/specs/editor/plugins/__snapshots__/{changing-image-size-Should-save-the-changes-1-chromium.txt => Iframed-block-Should-save-the-changes-1-chromium.txt} (100%) diff --git a/test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt b/test/e2e/specs/editor/plugins/__snapshots__/Iframed-block-Should-save-the-changes-1-chromium.txt similarity index 100% rename from test/e2e/specs/editor/plugins/__snapshots__/changing-image-size-Should-save-the-changes-1-chromium.txt rename to test/e2e/specs/editor/plugins/__snapshots__/Iframed-block-Should-save-the-changes-1-chromium.txt diff --git a/test/e2e/specs/editor/plugins/iframed-block.spec.js b/test/e2e/specs/editor/plugins/iframed-block.spec.js index 843db94a46887c..a0b20f1407cf40 100644 --- a/test/e2e/specs/editor/plugins/iframed-block.spec.js +++ b/test/e2e/specs/editor/plugins/iframed-block.spec.js @@ -3,7 +3,7 @@ */ const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' ); -test.describe( 'changing image size', () => { +test.describe( 'Iframed block', () => { test.beforeEach( async ( { requestUtils, admin } ) => { await requestUtils.activatePlugin( 'gutenberg-test-iframed-block' ); await admin.createNewPost( { postType: 'page' } ); @@ -19,10 +19,10 @@ test.describe( 'changing image size', () => { await expect( page.locator( 'role=document[name="Block: Iframed Block"i]' ) - ).toHaveText( 'Iframed Block (set with jQuery)' ); + ).toContainText( 'Iframed Block (set with jQuery)' ); // open page from sidebar settings - await page.click( '[aria-label="Page"]' ); + await page.locator( 'role=button[name= "Page"i]' ).first().click(); // Opens the template editor with a newly created template. await page.click( 'role=button[name="Select template"i]' ); @@ -36,8 +36,8 @@ test.describe( 'changing image size', () => { ).toBeVisible(); // Expect the script to load in the iframe, which replaces the block text. - const iframedText = page.frameLocator( 'iframe' ).locator( 'p' ); - await expect( iframedText.nth( 1 ) ).toHaveText( + const iframedText = page.frameLocator( 'iframe' ).locator( 'body' ); + await expect( iframedText ).toContainText( 'Iframed Block (set with jQuery)' ); } ); From c3939bf6ab207093000494a9f4f6860f575bddb0 Mon Sep 17 00:00:00 2001 From: Rinky Chowdhury Date: Thu, 29 Sep 2022 22:18:52 +0600 Subject: [PATCH 6/6] update: addressed feedbacks --- test/e2e/specs/editor/plugins/iframed-block.spec.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/test/e2e/specs/editor/plugins/iframed-block.spec.js b/test/e2e/specs/editor/plugins/iframed-block.spec.js index a0b20f1407cf40..55b67cb70fe86e 100644 --- a/test/e2e/specs/editor/plugins/iframed-block.spec.js +++ b/test/e2e/specs/editor/plugins/iframed-block.spec.js @@ -22,7 +22,9 @@ test.describe( 'Iframed block', () => { ).toContainText( 'Iframed Block (set with jQuery)' ); // open page from sidebar settings - await page.locator( 'role=button[name= "Page"i]' ).first().click(); + await page.click( + 'role=region[name="Editor settings"i] >> role=button[name="Page"i]' + ); // Opens the template editor with a newly created template. await page.click( 'role=button[name="Select template"i]' );