From 728d02c9b42ceac3a3ccc2fd53aa0f3d2d994b71 Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Fri, 27 Oct 2023 13:59:38 +0300 Subject: [PATCH 1/6] Update lazy loading e2e tests to account for lazy loading disable Jetpack removed lazy loading, so these tests have been trimmed down because of that. Since our module is disabled by default and can not be activated, it shouldn't be activatable. --- .../specs/base/jetpack-compatibility.test.js | 77 +------------------ 1 file changed, 3 insertions(+), 74 deletions(-) diff --git a/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js b/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js index e15d03adf1a16..c85a391642eb4 100644 --- a/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js +++ b/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js @@ -1,94 +1,23 @@ import { test, expect } from 'jetpack-e2e-commons/fixtures/base-test.js'; import { JetpackBoostPage } from '../../lib/pages/index.js'; -import { prerequisitesBuilder, isModuleActive } from 'jetpack-e2e-commons/env/prerequisites.js'; -import { activateModules, deactivateModules } from 'jetpack-e2e-commons/env/index.js'; -import { - boostPrerequisitesBuilder, - activateModules as activateBoostModules, - deactivateModules as deactivateBoostModules, -} from '../../lib/env/prerequisites.js'; +import { prerequisitesBuilder } from 'jetpack-e2e-commons/env/prerequisites.js'; +import { activateModules } from 'jetpack-e2e-commons/env/index.js'; test.describe( 'Jetpack compatibility', () => { test.beforeAll( async () => { await prerequisitesBuilder().withActivePlugins( [ 'jetpack' ] ).build(); } ); - test( 'The Jetpack lazy-image module activation reflects in Boost dashboard', async ( { + test( 'The Jetpack lazy-image module can not be activated in Boost dashboard', async ( { page, } ) => { await prerequisitesBuilder( page ).withInactiveModules( [ 'lazy-images' ] ).build(); await activateModules( [ 'lazy-images' ] ); - const jetpackBoostPage = await JetpackBoostPage.visit( page ); - expect( - await jetpackBoostPage.isModuleEnabled( 'lazy_images' ), - 'lazy_images module should be enabled' - ).toEqual( true ); - } ); - - test( 'The Jetpack lazy-image module deactivation reflects in Boost dashboard', async ( { - page, - } ) => { - await prerequisitesBuilder( page ).withActiveModules( [ 'lazy-images' ] ).build(); - await deactivateModules( [ 'lazy-images' ] ); - const jetpackBoostPage = await JetpackBoostPage.visit( page ); expect( await jetpackBoostPage.isModuleEnabled( 'lazy_images' ), 'lazy_images module should be disabled' ).toEqual( false ); } ); - - test( 'The Boost lazy-image module activation reflects in Jetpack dashboard', async ( { - page, - } ) => { - await boostPrerequisitesBuilder( page ).withInactiveModules( [ 'lazy_images' ] ).build(); - await activateBoostModules( [ 'lazy_images' ] ); - - const isActive = await isModuleActive( 'lazy-images' ); - expect( isActive, 'lazy-images module should be active' ).toBe( true ); - } ); - - test( 'The Boost lazy-image module deactivation reflects in Jetpack dashboard', async ( { - page, - } ) => { - await boostPrerequisitesBuilder( page ).withActiveModules( [ 'lazy_images' ] ).build(); - await deactivateBoostModules( [ 'lazy_images' ] ); - - const isActive = await isModuleActive( 'lazy-images' ); - expect( isActive, 'lazy-images module should not be active' ).toBe( false ); - } ); - - test( 'Lazy Image Toggle should work in Boost after using Jetpack dashboard to toogle lazy images.', async ( { - page, - } ) => { - const boostSlug = 'lazy_images'; - const jetpackSlug = 'lazy-images'; - await boostPrerequisitesBuilder( page ) - .withConnection( true ) - .withInactiveModules( [ boostSlug ] ) - .build(); - - const jetpackBoostPage = await JetpackBoostPage.visit( page ); - - await boostPrerequisitesBuilder( page ).build(); - await deactivateBoostModules( [ boostSlug ] ); - - // Turn on Lazy Images in Jetpack Boost via the UI - await jetpackBoostPage.toggleModule( boostSlug ); - - // Turn off Lazy Images with Jetpack - await deactivateModules( [ jetpackSlug ] ); - - // Turn on Lazy Images in Jetpack Boost via the UI - await jetpackBoostPage.reload(); - await jetpackBoostPage.toggleModule( boostSlug ); - - await jetpackBoostPage.reload(); - const isActiveInBoost = await jetpackBoostPage.isModuleEnabled( boostSlug ); - const isActiveInJetpack = await isModuleActive( jetpackSlug ); - - expect( isActiveInBoost, 'lazy_images module should be active in Jetpack Boost' ).toBe( true ); - expect( isActiveInJetpack, 'lazy-images module should be active in Jetpack' ).toBe( true ); - } ); } ); From 6973fead68ebf5954434e26d5483bfb7782c3d78 Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Fri, 27 Oct 2023 14:00:36 +0300 Subject: [PATCH 2/6] add changelog --- .../boost/changelog/update-boost-e2e-tests-lazy-loading | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 projects/plugins/boost/changelog/update-boost-e2e-tests-lazy-loading diff --git a/projects/plugins/boost/changelog/update-boost-e2e-tests-lazy-loading b/projects/plugins/boost/changelog/update-boost-e2e-tests-lazy-loading new file mode 100644 index 0000000000000..c3f648dbbf74f --- /dev/null +++ b/projects/plugins/boost/changelog/update-boost-e2e-tests-lazy-loading @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Updated e2e test to account for recent updates to the lazy loading module. From 41faa4d9e8ce3505384fd4985b6ac8047c0f7066 Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Fri, 27 Oct 2023 15:37:37 +0300 Subject: [PATCH 3/6] Remove unneeded e2e test --- .../boost/tests/e2e/specs/modules/lazy-images.test.js | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js b/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js index 72af61fe2487d..0653b8e58e92b 100644 --- a/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js +++ b/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js @@ -26,14 +26,4 @@ test.describe( 'Lazy Images module', () => { 'No images should be lazy loaded' ).toBe( 0 ); } ); - - test( 'Images on a post should be lazy loaded when the module is active', async () => { - await boostPrerequisitesBuilder( page ).withActiveModules( [ 'lazy_images' ] ).build(); - const frontend = await PostFrontendPage.visit( page ); - await frontend.click( `text=${ testPostTitle }` ); - expect( - await page.locator( '.jetpack-lazy-image' ).count(), - 'Images should be lazy loaded' - ).toBeGreaterThan( 0 ); - } ); } ); From fd2e8fb70100e9f43f382874ff81c9bb9966add2 Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Tue, 31 Oct 2023 12:58:52 +0200 Subject: [PATCH 4/6] Remove lazy loading tests --- .../specs/base/jetpack-compatibility.test.js | 23 --------------- .../e2e/specs/modules/lazy-images.test.js | 29 ------------------- .../e2e/specs/modules/modules-common.test.js | 3 +- 3 files changed, 1 insertion(+), 54 deletions(-) delete mode 100644 projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js delete mode 100644 projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js diff --git a/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js b/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js deleted file mode 100644 index c85a391642eb4..0000000000000 --- a/projects/plugins/boost/tests/e2e/specs/base/jetpack-compatibility.test.js +++ /dev/null @@ -1,23 +0,0 @@ -import { test, expect } from 'jetpack-e2e-commons/fixtures/base-test.js'; -import { JetpackBoostPage } from '../../lib/pages/index.js'; -import { prerequisitesBuilder } from 'jetpack-e2e-commons/env/prerequisites.js'; -import { activateModules } from 'jetpack-e2e-commons/env/index.js'; - -test.describe( 'Jetpack compatibility', () => { - test.beforeAll( async () => { - await prerequisitesBuilder().withActivePlugins( [ 'jetpack' ] ).build(); - } ); - - test( 'The Jetpack lazy-image module can not be activated in Boost dashboard', async ( { - page, - } ) => { - await prerequisitesBuilder( page ).withInactiveModules( [ 'lazy-images' ] ).build(); - await activateModules( [ 'lazy-images' ] ); - - const jetpackBoostPage = await JetpackBoostPage.visit( page ); - expect( - await jetpackBoostPage.isModuleEnabled( 'lazy_images' ), - 'lazy_images module should be disabled' - ).toEqual( false ); - } ); -} ); diff --git a/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js b/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js deleted file mode 100644 index 0653b8e58e92b..0000000000000 --- a/projects/plugins/boost/tests/e2e/specs/modules/lazy-images.test.js +++ /dev/null @@ -1,29 +0,0 @@ -import { test, expect } from 'jetpack-e2e-commons/fixtures/base-test.js'; -import { boostPrerequisitesBuilder } from '../../lib/env/prerequisites.js'; -import { PostFrontendPage } from 'jetpack-e2e-commons/pages/index.js'; -import playwrightConfig from 'jetpack-e2e-commons/playwright.config.cjs'; - -const testPostTitle = 'Hello World with image'; - -test.describe( 'Lazy Images module', () => { - let page; - - test.beforeAll( async ( { browser } ) => { - page = await browser.newPage( playwrightConfig.use ); - await boostPrerequisitesBuilder( page ).withTestContent( [ testPostTitle ] ).build(); - } ); - - test.afterAll( async () => { - await page.close(); - } ); - - test( 'Images on a post should not be lazy loaded when the module is inactive', async () => { - await boostPrerequisitesBuilder( page ).withInactiveModules( [ 'lazy_images' ] ).build(); - const frontend = await PostFrontendPage.visit( page ); - await frontend.click( `text=${ testPostTitle }` ); - expect( - await page.locator( '.jetpack-lazy-image' ).count(), - 'No images should be lazy loaded' - ).toBe( 0 ); - } ); -} ); diff --git a/projects/plugins/boost/tests/e2e/specs/modules/modules-common.test.js b/projects/plugins/boost/tests/e2e/specs/modules/modules-common.test.js index 9d5fb8fd39b46..378962fac5b56 100644 --- a/projects/plugins/boost/tests/e2e/specs/modules/modules-common.test.js +++ b/projects/plugins/boost/tests/e2e/specs/modules/modules-common.test.js @@ -6,7 +6,6 @@ import playwrightConfig from 'jetpack-e2e-commons/playwright.config.cjs'; const modules = [ // ['MODULE_NAME', 'DEFAULT STATE'], [ 'critical_css', 'disabled' ], - [ 'lazy_images', 'disabled' ], [ 'render_blocking_js', 'disabled' ], ]; @@ -19,7 +18,7 @@ test.describe.serial( 'Modules', () => { await boostPrerequisitesBuilder( page ) .withConnection( true ) - .withInactiveModules( [ 'critical_css', 'lazy_images', 'render_blocking_js' ] ) + .withInactiveModules( [ 'critical_css', 'render_blocking_js' ] ) .build(); jetpackBoostPage = await JetpackBoostPage.visit( page ); } ); From 5f3e76635d9fe5eadd537909bffe5155f408854d Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Tue, 31 Oct 2023 13:03:23 +0200 Subject: [PATCH 5/6] Update score auto refresh to use image cdn module instead of lazy images --- .../tests/e2e/specs/modules/score-auto-refresh.test.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js b/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js index 87bd67854b75e..46ab4f6a42489 100644 --- a/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js +++ b/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js @@ -12,12 +12,12 @@ test.describe( 'Auto refresh of speed scores', () => { await boostPrerequisitesBuilder( page ) .withConnection( true ) - .withInactiveModules( [ 'critical_css', 'lazy_images', 'render_blocking_js' ] ) + .withInactiveModules( [ 'critical_css', 'image_cdn', 'render_blocking_js' ] ) .build(); jetpackBoostPage = await JetpackBoostPage.visit( page ); } ); - [ 'lazy_images', 'render_blocking_js' ].forEach( moduleSlug => { + [ 'image_cdn', 'render_blocking_js' ].forEach( moduleSlug => { test( `Enabling ${ moduleSlug } should refresh scores`, async () => { await jetpackBoostPage.waitForScoreLoadingToFinish(); @@ -34,7 +34,7 @@ test.describe( 'Auto refresh of speed scores', () => { test( 'Score refresh should debounce between multiple module toggle', async () => { await jetpackBoostPage.waitForScoreLoadingToFinish(); - const toggleLazyPromise = jetpackBoostPage.toggleModule( 'lazy_images' ); + const toggleImageCdnPromise = jetpackBoostPage.toggleModule( 'image_cdn' ); // Wait a second before toggling another. await new Promise( resolve => setTimeout( resolve, 1000 ) ); @@ -53,6 +53,6 @@ test.describe( 'Auto refresh of speed scores', () => { expect( await jetpackBoostPage.isScoreLoading(), 'Score should be loading' ).toBeTruthy(); // Still expect toggling those two modules to succeed. - await Promise.all( [ toggleLazyPromise, renderBlockingPromise ] ); + await Promise.all( [ toggleImageCdnPromise, renderBlockingPromise ] ); } ); } ); From 5f001a316268eae81f32a8e80c32554d993adc10 Mon Sep 17 00:00:00 2001 From: Peter Petrov Date: Thu, 2 Nov 2023 10:17:56 +0200 Subject: [PATCH 6/6] Remove image_cdn module from e2e tests --- .../tests/e2e/specs/modules/score-auto-refresh.test.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js b/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js index 46ab4f6a42489..637304e0890b0 100644 --- a/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js +++ b/projects/plugins/boost/tests/e2e/specs/modules/score-auto-refresh.test.js @@ -12,12 +12,12 @@ test.describe( 'Auto refresh of speed scores', () => { await boostPrerequisitesBuilder( page ) .withConnection( true ) - .withInactiveModules( [ 'critical_css', 'image_cdn', 'render_blocking_js' ] ) + .withInactiveModules( [ 'critical_css', 'render_blocking_js' ] ) .build(); jetpackBoostPage = await JetpackBoostPage.visit( page ); } ); - [ 'image_cdn', 'render_blocking_js' ].forEach( moduleSlug => { + [ 'render_blocking_js' ].forEach( moduleSlug => { test( `Enabling ${ moduleSlug } should refresh scores`, async () => { await jetpackBoostPage.waitForScoreLoadingToFinish(); @@ -34,8 +34,6 @@ test.describe( 'Auto refresh of speed scores', () => { test( 'Score refresh should debounce between multiple module toggle', async () => { await jetpackBoostPage.waitForScoreLoadingToFinish(); - const toggleImageCdnPromise = jetpackBoostPage.toggleModule( 'image_cdn' ); - // Wait a second before toggling another. await new Promise( resolve => setTimeout( resolve, 1000 ) ); @@ -53,6 +51,6 @@ test.describe( 'Auto refresh of speed scores', () => { expect( await jetpackBoostPage.isScoreLoading(), 'Score should be loading' ).toBeTruthy(); // Still expect toggling those two modules to succeed. - await Promise.all( [ toggleImageCdnPromise, renderBlockingPromise ] ); + await Promise.all( [ renderBlockingPromise ] ); } ); } );