From 0ffb2555785b0fcd45a9090081b616315bf95a8b Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 18:01:56 +0100 Subject: [PATCH 01/24] Updated module --- src/common/custom-world.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/common/custom-world.ts b/src/common/custom-world.ts index 4169ecd..f163657 100644 --- a/src/common/custom-world.ts +++ b/src/common/custom-world.ts @@ -32,7 +32,7 @@ export interface ICustomWorld extends World { context?: BrowserContext; page?: Page; sections?: Sections; - utils?: PageUtils + utils?: PageUtils; } export class CustomWorld extends World implements ICustomWorld { From ddb77e5efddb8b5430f299728cb318cebe334fa0 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:17:33 +0100 Subject: [PATCH 02/24] Added mobile menu onready script --- .../engine_scripts/mobileMenuThemeSwitch.js | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 backstop_data/engine_scripts/mobileMenuThemeSwitch.js diff --git a/backstop_data/engine_scripts/mobileMenuThemeSwitch.js b/backstop_data/engine_scripts/mobileMenuThemeSwitch.js new file mode 100644 index 0000000..7744b4d --- /dev/null +++ b/backstop_data/engine_scripts/mobileMenuThemeSwitch.js @@ -0,0 +1,28 @@ +module.exports = async (page) => { + let target; + + const theme = process.env.THEME ? process.env.THEME : ''; + + if (theme === '') { + return; + } + + switch (theme) { + case 'genesis-sample-develop': + target = '#genesis-mobile-nav-primary'; + break; + case 'flatsome': + target = '[data-open="#main-menu"]'; + break; + case 'Divi': + target = '#et_mobile_nav_menu'; + break; + case 'astra': + target = '.ast-mobile-menu-trigger-minimal'; + break; + } + + await page.click(target); + await page.waitForTimeout(2000); +}; + From 4bf88d2cde68dd376f8fbe54aa3ed780a3c8b676 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:18:52 +0100 Subject: [PATCH 03/24] New delayjs feature --- src/features/delay-js.feature | 50 +++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/features/delay-js.feature diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature new file mode 100644 index 0000000..341d0e9 --- /dev/null +++ b/src/features/delay-js.feature @@ -0,0 +1,50 @@ +@delayjs @setup +Feature: No Regression with delayjs script udpate + + Background: + Given I am logged in + + Scenario: Shouldn't cause console error when enabling Delay JS with genesis theme + Given plugin is installed 'new_release' + And plugin is activated + And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' + And I save settings 'fileOptimization' 'delayJs' + When theme is activated + And I log out + And I visit site url + And move the mouse + Then no error in the console different than nowprocket page '' + + Scenario: Should the mobile menu work While Delay JS is enabled + Given plugin is installed 'new_release' + And plugin is activated + And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' + And I save settings 'fileOptimization' 'delayJs' + When theme is activated + Then I must not see any visual regression 'delayJsMobile' + + Scenario: Should links be clickable While Delay JS is enabled + Given plugin is installed 'new_release' + And plugin is activated + And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' + And I save settings 'fileOptimization' 'delayJs' + And I save settings 'cache' 'mobileDeviceCache' + And I save settings 'cache' 'mobileDeviceSeparateCache' + When theme is activated + And I log out + And visit page '' in mobile view + And expand mobile menu + And I click on 'a[href="https://e2e.rocketlabsqa.ovh/about-us/"]' + Then page navigated to the new page 'https://e2e.rocketlabsqa.ovh/about-us' + + Scenario: Shouldn't cause console error when enabling Delay JS with WPML + Given plugin is installed 'new_release' + And plugin is activated + And I go to 'wp-admin/plugins.php' + And plugin is activated 'wpml-multilingual-cms' + And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' + When I save settings 'fileOptimization' 'delayJs' + And I log out + And I visit site url + And switch language + Then no error in the console different than nowprocket page 'ar' \ No newline at end of file From abc450374456c16de8c246115f470dc5a20e1240 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:19:27 +0100 Subject: [PATCH 04/24] Updated step to use path --- src/features/ll-css-bg-image-elementor.feature | 2 +- src/features/ll-css-bg-image.feature | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/features/ll-css-bg-image-elementor.feature b/src/features/ll-css-bg-image-elementor.feature index 2e4f2f1..e22defd 100644 --- a/src/features/ll-css-bg-image-elementor.feature +++ b/src/features/ll-css-bg-image-elementor.feature @@ -9,4 +9,4 @@ Feature: C14412 - Should be compatible with Elementor background And I save settings 'media' 'lazyloadCssBgImg' Then I must not see any visual regression 'elementorLlcss' When I log out - Then no error in the console different than nowprocket page 'elementorLlcss' + Then no error in the console different than nowprocket page 'elementor-overlay' diff --git a/src/features/ll-css-bg-image.feature b/src/features/ll-css-bg-image.feature index 4e050db..df01076 100644 --- a/src/features/ll-css-bg-image.feature +++ b/src/features/ll-css-bg-image.feature @@ -11,7 +11,7 @@ Feature: C13969 - Should lazyload CSS background images inside internal, and ext Then I must not see any visual regression 'llcss' Then I must not see any error in debug.log When I log out - Then no error in the console different than nowprocket page 'llcss' + Then no error in the console different than nowprocket page 'lazyload_css_background_images' Scenario: Inspect the element that loads the background image When I log out From 912d38ed9886c9663f00146b17d3d3b73517ed99 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:20:07 +0100 Subject: [PATCH 05/24] Added new step definitions --- src/support/steps/general.ts | 84 ++++++++++++++++++++++++++++++++++-- 1 file changed, 80 insertions(+), 4 deletions(-) diff --git a/src/support/steps/general.ts b/src/support/steps/general.ts index b6d692b..7f92cbc 100644 --- a/src/support/steps/general.ts +++ b/src/support/steps/general.ts @@ -15,7 +15,6 @@ import { ICustomWorld } from "../../common/custom-world"; import { Given, When, Then } from '@cucumber/cucumber'; import { WP_BASE_URL } from '../../../config/wp.config'; -import { SCENARIO_URLS } from "../../../config/wp.config"; import { createReference, compareReference } from "../../../utils/helpers"; import type { Section } from "../../../utils/types"; import { Page } from '@playwright/test'; @@ -76,6 +75,14 @@ Given('I save settings {string} {string}', async function (this: ICustomWorld, s await this.page.waitForLoadState('load', { timeout: 30000 }); }); +/** + * Executes the step to activate a plugin. + */ +Given('plugin is activated {string}', async function (this: ICustomWorld, plugin) { + // Activate plugin + await this.utils.togglePluginActivation(plugin); +}); + /** * Executes the step to log in. @@ -150,6 +157,68 @@ When('I create reference', async function (this:ICustomWorld) { await createReference(process.env.npm_config_vrurl); }); + +/** + * Executes the step to activate a theme. + */ +When('theme {string} is activated', async function (this:ICustomWorld, theme) { + await this.utils.switchTheme(theme); +}); + +/** + * Executes the step to activate a theme set from the CLI. + */ +When('theme is activated', async function (this:ICustomWorld) { + const theme = process.env.THEME ? process.env.THEME : ''; + + if (theme === '') { + return; + } + + await this.utils.switchTheme(theme); +}); + +/** + * Executes the step visit a page in mobile view. + */ +When('visit page {string} in mobile view', async function (this:ICustomWorld, page) { + await this.page.setViewportSize({ + width: 500, + height: 480, + }); + + await this.utils.visitPage(page); +}); + +/** + * Executes the step to expand the mobile menu. + */ +When('expand mobile menu', async function (this:ICustomWorld) { + let target: string; + const theme = process.env.THEME ? process.env.THEME : ''; + + if (theme === '') { + return; + } + + switch (theme) { + case 'genesis-sample-develop': + target = '#genesis-mobile-nav-primary'; + break; + case 'flatsome': + target = '[data-open="#main-menu"]'; + break; + case 'Divi': + target = '#et_mobile_nav_menu'; + break; + case 'astra': + target = '.ast-mobile-menu-trigger-minimal'; + break; + } + + await this.page.locator(target).click(); +}); + /** * Executes the step to assert the presence of specific text. */ @@ -186,9 +255,9 @@ Then('I must not see any visual regression {string}', async function (this: ICus /** * Executes the step to check for that there is no console error different from the nowprocket page version. */ -Then('no error in the console different than nowprocket page {string}', async function (this: ICustomWorld, label: string) { - const consoleMsg1 = await getConsoleMsg(this.page, `${WP_BASE_URL}/${SCENARIO_URLS[label]}?nowprocket`); - const consoleMsg2 = await getConsoleMsg(this.page, `${WP_BASE_URL}/${SCENARIO_URLS[label]}`); +Then('no error in the console different than nowprocket page {string}', async function (this: ICustomWorld, path: string) { + const consoleMsg1 = await getConsoleMsg(this.page, `${WP_BASE_URL}/${path}?nowprocket`); + const consoleMsg2 = await getConsoleMsg(this.page, `${WP_BASE_URL}/${path}`); if (consoleMsg2.length !== 0) { expect(consoleMsg2).toEqual(consoleMsg1); @@ -241,3 +310,10 @@ const getConsoleMsg = async (page: Page, url: string): Promise> => return consoleMsg; } + +/** + * Executes the step to assert that page navigation. + */ +Then('page navigated to the new page {string}', async function (this: ICustomWorld, url) { + await expect(this.page).toHaveURL(`/${url}/`); +}); \ No newline at end of file From 5a026eb6f2c33a2c7d8529da1fdff77e6b3fb370 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:20:44 +0100 Subject: [PATCH 06/24] Added new actions to BeforeAll hook --- src/support/hooks.ts | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/src/support/hooks.ts b/src/support/hooks.ts index da3ad56..854b2f8 100644 --- a/src/support/hooks.ts +++ b/src/support/hooks.ts @@ -45,6 +45,26 @@ BeforeAll(async function (this: ICustomWorld) { await deleteFolder('./backstop_data/bitmaps_test'); browser = await chromium.launch({ headless: false }); + const theme = process.env.THEME ? process.env.THEME : ''; + + if (theme !== '') { + const context = await browser.newContext({ + recordVideo: { + dir: "test-results/videos", + }, + }); + + const page = await context.newPage(); + const sections = new Sections(page, pluginSelectors); + const utils = new PageUtils(page, sections); + + await utils.auth(); + await utils.switchTheme(theme); + + await page?.close(); + await context?.close(); + } + if (process.env.npm_config_vrurl === undefined) { await batchUpdateVRTestUrl({ optimize: false, From 3a99cea98c02b8f26904c1aaf4dc6bb1ea549bd1 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:21:39 +0100 Subject: [PATCH 07/24] Updated batch reference creator to check for mobile property and use new scenario structure --- utils/helpers.ts | 23 ++++++++++++++++++----- 1 file changed, 18 insertions(+), 5 deletions(-) diff --git a/utils/helpers.ts b/utils/helpers.ts index 9194764..2bf24b5 100644 --- a/utils/helpers.ts +++ b/utils/helpers.ts @@ -16,7 +16,7 @@ import type { Page } from '@playwright/test'; import backstop from 'backstopjs'; // Interfaces -import { ExportedSettings, VRurlConfig } from '../utils/types'; +import { ExportedSettings, VRurlConfig, Viewport } from '../utils/types'; import { uiReflectedSettings } from './exclusions'; import { WP_BASE_URL } from '../config/wp.config'; @@ -241,6 +241,15 @@ export const batchUpdateVRTestUrl = async(config: VRurlConfig): Promise => let path: string; let beforeScript = ''; let readyScript = ''; + let viewports: Viewport[]; + + const mobileViewport: Viewport[] = [ + { + "name": "mobile", + "width": 500, + "height": 480 + } + ]; if (config.optimize) { optimize = ''; @@ -249,14 +258,14 @@ export const batchUpdateVRTestUrl = async(config: VRurlConfig): Promise => const urls = config.urls; for (const key in urls) { // Check that path is not empty(meaning home); - if (urls[key] !== '') { - path = urls[key]; + if (urls[key].path !== '') { + path = urls[key].path; } else { path = ''; } - if(key.includes('noJs')) { + if ( 'disableJs' in urls[key] && urls[key].disableJs ) { beforeScript = 'disableJavascript.js'; readyScript = 'wait.js'; } @@ -265,6 +274,9 @@ export const batchUpdateVRTestUrl = async(config: VRurlConfig): Promise => readyScript = config.optimize ? 'scrollToBottom.js' : ''; } + viewports = 'mobile' in urls[key] && urls[key].mobile ? mobileViewport : []; + readyScript = 'mobile' in urls[key] && urls[key].mobile ? 'mobileMenuThemeSwitch.js' : config.optimize ? 'scrollToBottom.js' : ''; + jsonData.scenarios.push({ label: key, url: `${WP_BASE_URL}/${path}${optimize}`, @@ -283,7 +295,8 @@ export const batchUpdateVRTestUrl = async(config: VRurlConfig): Promise => misMatchThreshold: 0.1, requireSameDimensions: true, onReadyScript: readyScript, - onBeforeScript: beforeScript + onBeforeScript: beforeScript, + viewports: viewports }); } From f112a47c683f96a8aed72745e630cb01e3407675 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:22:24 +0100 Subject: [PATCH 08/24] New method to switch theme --- utils/page-utils.ts | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) diff --git a/utils/page-utils.ts b/utils/page-utils.ts index 1ca3210..69ec30a 100644 --- a/utils/page-utils.ts +++ b/utils/page-utils.ts @@ -540,4 +540,33 @@ export class PageUtils { 'video/webm' ); } + + /** + * Switch theme. + * + * @param {string} theme Theme to activate. + * + * @return {Promise} + */ + public async switchTheme(theme: string): Promise { + await this.visitPage('wp-admin/themes.php'); + await this.page.locator('#wp-filter-search-input').fill(theme); + // Wait for filtered theme to be displayed. + await this.page.waitForTimeout(2000); + + const filteredTheme = this.page.locator(`[data-slug="${theme}"]`); + if (! await filteredTheme.isVisible()) { + return; + } + + // Hover and activate theme. + await filteredTheme.hover(); + + const activate = this.page.locator('.theme-actions .activate'); + if (! await activate.isVisible()) { + return; + } + + await activate.click(); + } } \ No newline at end of file From eb36f84fe782cf279b1612a69e6d6dcc9a3eb9bd Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:22:43 +0100 Subject: [PATCH 09/24] Updated and added new types --- utils/types.ts | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/utils/types.ts b/utils/types.ts index 2b5549a..ef5c098 100644 --- a/utils/types.ts +++ b/utils/types.ts @@ -82,9 +82,20 @@ export type Roles = "alert"|"alertdialog"|"application"|"article"|"banner"|"bloc export interface VRurlConfig { optimize: boolean, urls?: { - llcss: string + [key: string]: { + path?: string, + disableJs?: boolean, + theme?: string, + mobile?: boolean + } } } export interface Pickle { name: string; -} \ No newline at end of file +} + +export type Viewport = { + name: string; + width: number; + height: number; +}; \ No newline at end of file From 5d5c96c63cb98683a35b2a8b123672633431e0bc Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:23:37 +0100 Subject: [PATCH 10/24] Added new script commands --- package.json | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/package.json b/package.json index d12d8db..24e7061 100755 --- a/package.json +++ b/package.json @@ -16,6 +16,11 @@ "test:online": "$npm_package_config_testCommand --tags @online", "test:vr": "$npm_package_config_testCommand --tags @vr", "test:llcssbg": "$npm_package_config_testCommand --tags @llcssbg", + "test:delayjs:genesis": "THEME=genesis-sample-develop $npm_package_config_testCommand --tags @delayjs", + "test:delayjs:flatsome": "THEME=flatsome $npm_package_config_testCommand --tags @delayjs", + "test:delayjs:divi": "THEME=Divi $npm_package_config_testCommand --tags @delayjs", + "test:delayjs:astra": "THEME=astra $npm_package_config_testCommand --tags @delayjs", + "test:test": "$npm_package_config_testCommand --tags @test", "wp-env": "wp-env" }, "repository": { From 2a4b7fded72e5ac3f417679070f38c7ea7cb9cdf Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:24:31 +0100 Subject: [PATCH 11/24] Updated package-lock --- package-lock.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index eef5379..dd91fea 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5384,9 +5384,9 @@ "dev": true }, "node_modules/typescript": { - "version": "5.1.6", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", - "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz", + "integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==", "devOptional": true, "bin": { "tsc": "bin/tsc", From 20c6854eb9ce24a6823e5eb1cd10b289f3f509e1 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:26:18 +0100 Subject: [PATCH 12/24] Updated config sample to use scenario structure --- config/wp.config.sample.ts | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/config/wp.config.sample.ts b/config/wp.config.sample.ts index bcbc33b..7086045 100755 --- a/config/wp.config.sample.ts +++ b/config/wp.config.sample.ts @@ -48,21 +48,31 @@ const { /** * Exported Scenario urls to be used for visual regression testing with backstopjs * @exports - * @type {{ -* home: string; -* llcss: string; -* noJsLlcss: string; -* elementorLlcss: string; -* }} */ const SCENARIO_URLS = { /** * The value will hold the url paths */ - home: '', - llcss: '', - noJsLlcss: '', - elementorLlcss: '' + home: { + path: '' + }, + llcss: { + path: 'lazyload_css_background_images' + }, + noJsLlcss: { + path: 'lazyload_css_background_images', + disableJs: true + }, + elementorLlcss: { + path: 'elementor-overlay' + }, + delayJs: { + path: '' + }, + delayJsMobile: { + path: '', + mobile: true, + }, } /** From 5c6f98b6f0ee5cc8d004b7f3d4cbd92bdf16ee0d Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:29:30 +0100 Subject: [PATCH 13/24] Updated config sample --- config/wp.config.sample.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/config/wp.config.sample.ts b/config/wp.config.sample.ts index 7086045..1115b6b 100755 --- a/config/wp.config.sample.ts +++ b/config/wp.config.sample.ts @@ -48,6 +48,14 @@ const { /** * Exported Scenario urls to be used for visual regression testing with backstopjs * @exports + * @type {{ + * [key: string]: { + * path?: string, + * disableJs?: boolean, + * theme?: string, + * mobile?: boolean + * } + * }} */ const SCENARIO_URLS = { /** From 2c8a19976a5edc2a3ddef831586fd41ec9e29cc5 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 7 Feb 2024 20:29:57 +0100 Subject: [PATCH 14/24] New delayjs step defintion --- src/support/steps/delay-js.ts | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 src/support/steps/delay-js.ts diff --git a/src/support/steps/delay-js.ts b/src/support/steps/delay-js.ts new file mode 100644 index 0000000..5ac6941 --- /dev/null +++ b/src/support/steps/delay-js.ts @@ -0,0 +1,23 @@ +/** + * @fileoverview + * This module contains Cucumber step definitions using Playwright for performing actions with Delayjs option enabled on WP Rocket. + * + * + * + * @requires {@link ../../common/custom-world} + * @requires {@link @cucumber/cucumber} + */ +import { ICustomWorld } from "../../common/custom-world"; +import { When } from '@cucumber/cucumber'; + +/** + * Executes the step to move the mouse. + */ +When('move the mouse', async function (this: ICustomWorld) { + await this.page.mouse.down(); + await this.page.mouse.up(); +}); + +When('switch language', async function (this:ICustomWorld) { + await this.page.getByRole('link', { name: 'العربية (Arabic)' }).click(); +}); \ No newline at end of file From 654c65fea21b63bd1697841f76c6206cf75af49b Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Thu, 8 Feb 2024 15:04:04 +0100 Subject: [PATCH 15/24] Updated step --- src/features/delay-js.feature | 2 +- src/support/steps/delay-js.ts | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index 341d0e9..b90aeb0 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -34,7 +34,7 @@ Feature: No Regression with delayjs script udpate And I log out And visit page '' in mobile view And expand mobile menu - And I click on 'a[href="https://e2e.rocketlabsqa.ovh/about-us/"]' + And I click on link Then page navigated to the new page 'https://e2e.rocketlabsqa.ovh/about-us' Scenario: Shouldn't cause console error when enabling Delay JS with WPML diff --git a/src/support/steps/delay-js.ts b/src/support/steps/delay-js.ts index 5ac6941..57cc41a 100644 --- a/src/support/steps/delay-js.ts +++ b/src/support/steps/delay-js.ts @@ -20,4 +20,8 @@ When('move the mouse', async function (this: ICustomWorld) { When('switch language', async function (this:ICustomWorld) { await this.page.getByRole('link', { name: 'العربية (Arabic)' }).click(); +}); + +When('I click on link', async function (this:ICustomWorld) { + await this.page.getByRole('link', { name: 'About Us' }).click() }); \ No newline at end of file From 71db291ac113eaafcedaee28f455606e2f8f59ec Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 01:37:06 +0100 Subject: [PATCH 16/24] Added step definition for url format --- src/support/steps/delay-js.ts | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/support/steps/delay-js.ts b/src/support/steps/delay-js.ts index 57cc41a..a649472 100644 --- a/src/support/steps/delay-js.ts +++ b/src/support/steps/delay-js.ts @@ -18,10 +18,17 @@ When('move the mouse', async function (this: ICustomWorld) { await this.page.mouse.up(); }); -When('switch language', async function (this:ICustomWorld) { - await this.page.getByRole('link', { name: 'العربية (Arabic)' }).click(); -}); - +/** + * Executes the step to click on about us link. + */ When('I click on link', async function (this:ICustomWorld) { await this.page.getByRole('link', { name: 'About Us' }).click() +}); + +/** + * Executes the step to save url format to directory for wpml. + */ +When('save directory url format', async function (this:ICustomWorld) { + await this.page.getByText('Different languages in directories ( (https://e2e.rocketlabsqa.ovh/ - English, h').click(); + await this.page.locator('#icl_save_language_negotiation_type').getByRole('button', { name: 'Save' }).click(); }); \ No newline at end of file From 85cdbd26bb8c96614845656b05e422b265b67608 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 01:37:31 +0100 Subject: [PATCH 17/24] Updated to use regex --- src/support/steps/general.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/support/steps/general.ts b/src/support/steps/general.ts index 7f92cbc..7cf23de 100644 --- a/src/support/steps/general.ts +++ b/src/support/steps/general.ts @@ -315,5 +315,6 @@ const getConsoleMsg = async (page: Page, url: string): Promise> => * Executes the step to assert that page navigation. */ Then('page navigated to the new page {string}', async function (this: ICustomWorld, url) { - await expect(this.page).toHaveURL(`/${url}/`); + const regex = new RegExp(url); + await expect(this.page).toHaveURL(regex); }); \ No newline at end of file From d1e47671416b724abc1a238fb24bc37ed19e4546 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 01:37:57 +0100 Subject: [PATCH 18/24] Use precise selector --- utils/page-utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/utils/page-utils.ts b/utils/page-utils.ts index 69ec30a..6af5c80 100644 --- a/utils/page-utils.ts +++ b/utils/page-utils.ts @@ -562,7 +562,7 @@ export class PageUtils { // Hover and activate theme. await filteredTheme.hover(); - const activate = this.page.locator('.theme-actions .activate'); + const activate = this.page.locator(`[data-slug="${theme}"] .theme-actions .activate`); if (! await activate.isVisible()) { return; } From 6d86961728c1cd58b6c06315226b984b2d939fa5 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 01:38:21 +0100 Subject: [PATCH 19/24] Updated feature --- src/features/delay-js.feature | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index b90aeb0..d33facc 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -24,7 +24,7 @@ Feature: No Regression with delayjs script udpate Then I must not see any visual regression 'delayJsMobile' Scenario: Should links be clickable While Delay JS is enabled - Given plugin is installed 'new_release' + Given plugin is installed 'new_release' And plugin is activated And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' And I save settings 'fileOptimization' 'delayJs' @@ -42,9 +42,10 @@ Feature: No Regression with delayjs script udpate And plugin is activated And I go to 'wp-admin/plugins.php' And plugin is activated 'wpml-multilingual-cms' + And I go to 'wp-admin/admin.php?page=sitepress-multilingual-cms/menu/languages.php' + And save directory url format And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' When I save settings 'fileOptimization' 'delayJs' And I log out And I visit site url - And switch language Then no error in the console different than nowprocket page 'ar' \ No newline at end of file From d5bc9ef2f9d79cb07e7efe1f3382e54756ef08dc Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 14:18:36 +0100 Subject: [PATCH 20/24] Send precondition steps to background --- src/features/delay-js.feature | 22 +++++----------------- 1 file changed, 5 insertions(+), 17 deletions(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index d33facc..eba0e87 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -3,12 +3,12 @@ Feature: No Regression with delayjs script udpate Background: Given I am logged in - - Scenario: Shouldn't cause console error when enabling Delay JS with genesis theme - Given plugin is installed 'new_release' + And plugin is installed 'new_release' And plugin is activated And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' And I save settings 'fileOptimization' 'delayJs' + + Scenario: Shouldn't cause console error when enabling Delay JS with genesis theme When theme is activated And I log out And I visit site url @@ -16,19 +16,11 @@ Feature: No Regression with delayjs script udpate Then no error in the console different than nowprocket page '' Scenario: Should the mobile menu work While Delay JS is enabled - Given plugin is installed 'new_release' - And plugin is activated - And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' - And I save settings 'fileOptimization' 'delayJs' When theme is activated Then I must not see any visual regression 'delayJsMobile' Scenario: Should links be clickable While Delay JS is enabled - Given plugin is installed 'new_release' - And plugin is activated - And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' - And I save settings 'fileOptimization' 'delayJs' - And I save settings 'cache' 'mobileDeviceCache' + When I save settings 'cache' 'mobileDeviceCache' And I save settings 'cache' 'mobileDeviceSeparateCache' When theme is activated And I log out @@ -38,14 +30,10 @@ Feature: No Regression with delayjs script udpate Then page navigated to the new page 'https://e2e.rocketlabsqa.ovh/about-us' Scenario: Shouldn't cause console error when enabling Delay JS with WPML - Given plugin is installed 'new_release' - And plugin is activated - And I go to 'wp-admin/plugins.php' + When I go to 'wp-admin/plugins.php' And plugin is activated 'wpml-multilingual-cms' And I go to 'wp-admin/admin.php?page=sitepress-multilingual-cms/menu/languages.php' And save directory url format - And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' - When I save settings 'fileOptimization' 'delayJs' And I log out And I visit site url Then no error in the console different than nowprocket page 'ar' \ No newline at end of file From dbcb804841665c212d292652b66c0840c114a309 Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 15:42:48 +0100 Subject: [PATCH 21/24] Updated steps --- src/features/delay-js.feature | 2 +- src/support/steps/delay-js.ts | 14 +++++++++----- 2 files changed, 10 insertions(+), 6 deletions(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index eba0e87..0d3bf38 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -33,7 +33,7 @@ Feature: No Regression with delayjs script udpate When I go to 'wp-admin/plugins.php' And plugin is activated 'wpml-multilingual-cms' And I go to 'wp-admin/admin.php?page=sitepress-multilingual-cms/menu/languages.php' - And save directory url format + And wpml directory is enabled And I log out And I visit site url Then no error in the console different than nowprocket page 'ar' \ No newline at end of file diff --git a/src/support/steps/delay-js.ts b/src/support/steps/delay-js.ts index a649472..6549903 100644 --- a/src/support/steps/delay-js.ts +++ b/src/support/steps/delay-js.ts @@ -8,7 +8,7 @@ * @requires {@link @cucumber/cucumber} */ import { ICustomWorld } from "../../common/custom-world"; -import { When } from '@cucumber/cucumber'; +import { When, Given } from '@cucumber/cucumber'; /** * Executes the step to move the mouse. @@ -26,9 +26,13 @@ When('I click on link', async function (this:ICustomWorld) { }); /** - * Executes the step to save url format to directory for wpml. + * Save directory for wpml language setting */ -When('save directory url format', async function (this:ICustomWorld) { - await this.page.getByText('Different languages in directories ( (https://e2e.rocketlabsqa.ovh/ - English, h').click(); - await this.page.locator('#icl_save_language_negotiation_type').getByRole('button', { name: 'Save' }).click(); +Given('wpml directory is enabled', async function(this:ICustomWorld) { + await this.page.waitForSelector('#lang-sec-2'); + await this.page.locator('input[name="icl_language_negotiation_type"]').nth(0).check() + + await this.page.locator('input[type="submit"]').nth(0).click(); + + await this.page.waitForLoadState('load', { timeout: 30000 }); }); \ No newline at end of file From ad24c2b63cfd83d7bc1fd0157bda49d3590ebfaa Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Fri, 9 Feb 2024 16:01:43 +0100 Subject: [PATCH 22/24] Updated steps --- src/features/delay-js.feature | 2 +- src/support/steps/general.ts | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index 0d3bf38..c0d43aa 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -31,7 +31,7 @@ Feature: No Regression with delayjs script udpate Scenario: Shouldn't cause console error when enabling Delay JS with WPML When I go to 'wp-admin/plugins.php' - And plugin is activated 'wpml-multilingual-cms' + And activate 'wpml-multilingual-cms' plugin And I go to 'wp-admin/admin.php?page=sitepress-multilingual-cms/menu/languages.php' And wpml directory is enabled And I log out diff --git a/src/support/steps/general.ts b/src/support/steps/general.ts index 7cf23de..89fd6e4 100644 --- a/src/support/steps/general.ts +++ b/src/support/steps/general.ts @@ -76,14 +76,14 @@ Given('I save settings {string} {string}', async function (this: ICustomWorld, s }); /** - * Executes the step to activate a plugin. +/** + * Executes the step to activate the WP plugin. */ -Given('plugin is activated {string}', async function (this: ICustomWorld, plugin) { - // Activate plugin +Given('activate {string} plugin', async function (this: ICustomWorld, plugin) { + await this.utils.gotoPlugin(); await this.utils.togglePluginActivation(plugin); }); - /** * Executes the step to log in. */ From d250eac8e445aee04f606bf014e07cdd1d53620a Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Tue, 13 Feb 2024 10:06:35 +0100 Subject: [PATCH 23/24] Revert package-lock.json --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index dd91fea..0a7bd40 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5384,9 +5384,9 @@ "dev": true }, "node_modules/typescript": { - "version": "5.3.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz", - "integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==", + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.6.tgz", + "integrity": "sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==", "devOptional": true, "bin": { "tsc": "bin/tsc", @@ -5698,4 +5698,4 @@ } } } -} +} \ No newline at end of file diff --git a/package.json b/package.json index 24e7061..8280d62 100755 --- a/package.json +++ b/package.json @@ -54,7 +54,7 @@ "backstopjs": "^6.2.2", "json-diff": "^1.0.6", "node-ssh": "^13.1.0", - "node-zip": "^1.1.1", + "node-zip": "^1.0.1", "playwright": "^1.34.3", "shelljs": "^0.8.5", "ssh2": "^1.14.0", From 5ce7779bc556446476d481b6cc0e5dbbabdf017b Mon Sep 17 00:00:00 2001 From: Michael Lee Date: Wed, 14 Feb 2024 10:51:02 +0100 Subject: [PATCH 24/24] Updated scenario title --- src/features/delay-js.feature | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/features/delay-js.feature b/src/features/delay-js.feature index c0d43aa..941c59c 100644 --- a/src/features/delay-js.feature +++ b/src/features/delay-js.feature @@ -8,7 +8,7 @@ Feature: No Regression with delayjs script udpate And I go to 'wp-admin/options-general.php?page=wprocket#dashboard' And I save settings 'fileOptimization' 'delayJs' - Scenario: Shouldn't cause console error when enabling Delay JS with genesis theme + Scenario: Shouldn't cause console error when enabling Delay JS with theme When theme is activated And I log out And I visit site url