Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closes #137 LRC visual regression on live templates #145

Merged
merged 18 commits into from
Oct 17, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion backstop_data/engine_scripts/wait.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
module.exports = async (page) => {
await page.waitForTimeout(15000);
await page.waitForTimeout(3000);
};
42 changes: 34 additions & 8 deletions config/scenarioUrls.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,40 +20,66 @@
"path": "ll_bg_css_single_colon"
}
},
"test:lrc": {
"delayJs13Live": {
"path": "delayjs_1-3_live_template"
},
"delayJs68Live": {
"path": "delayjs_68_live_template"
},
"lcp6647Live": {
"path": "lcp_6647_live"
},
"lcpLive4Template": {
"path": "lcp_live_4_template"
},
"lcpLiveTestSpan": {
"path": "lcp_live_test_span"
Mai-Saad marked this conversation as resolved.
Show resolved Hide resolved
},
"rucss5213Template": {
"path": "rucss_5213_template"
},
"template4787": {
"path": "4787-2"
},
"lrcWillSite": {
"path": "lrc_will_site"
}
},
"test:delayjs:genesis": {
"delayJs": {
"path": ""
},
"delayJsMobile": {
"path": "",
"mobile": true
"path": "",
"mobile": true
}
},
"test:delayjs:flatsome": {
"delayJs": {
"path": ""
},
"delayJsMobile": {
"path": "",
"mobile": true
"path": "",
"mobile": true
}
},
"test:delayjs:divi": {
"delayJs": {
"path": ""
},
"delayJsMobile": {
"path": "",
"mobile": true
"path": "",
"mobile": true
}
},
"test:delayjs:astra": {
"delayJs": {
"path": ""
},
"delayJsMobile": {
"path": "",
"mobile": true
"path": "",
"mobile": true
}
}
}
1 change: 0 additions & 1 deletion config/wp.config.sample.ts
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,6 @@ const {
* }}
*/


const scriptName = process.env.npm_lifecycle_event;
const SCENARIO_URLS = ScenarioUrls[scriptName];

Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
"test:llimages": "$npm_package_config_testCommand --tags @llimages",
"test:lcp": "$npm_package_config_testCommand --tags @lcp",
"test:test": "$npm_package_config_testCommand --tags @test",
"test:lrc": "$npm_package_config_testCommand --tags @lrc",
"test:performancehints": "$npm_package_config_testCommand --tags @performancehints",
"healthcheck": "ts-node healthcheck.ts",
"wp-env": "wp-env"
Expand Down
16 changes: 16 additions & 0 deletions src/features/lrc-visual-regression.feature
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
@setup @lrc
Feature: LRC Visual Regression Test on Live Template

Background:
Given I am logged in
And plugin is installed 'new_release'
And plugin is activated
And I go to 'wp-admin/options-general.php?page=wprocket#dashboard'

Scenario: Shouldn't have any visual regression when visiting
When I log out
And I visit scenario urls
And I am logged in
And I clear cache
Then I must not see any visual regression in scenario urls

30 changes: 28 additions & 2 deletions src/support/steps/general.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import { expect } from "@playwright/test";
import { ICustomWorld } from "../../common/custom-world";

import { Given, When, Then } from '@cucumber/cucumber';
import { WP_BASE_URL } from '../../../config/wp.config';
import {SCENARIO_URLS, WP_BASE_URL} from '../../../config/wp.config';
import { createReference, compareReference } from "../../../utils/helpers";
import type { Section } from "../../../utils/types";
import { Page } from '@playwright/test';
Expand Down Expand Up @@ -245,7 +245,8 @@ When('I clear cache', async function (this:ICustomWorld) {
await this.utils.gotoWpr();

this.sections.set('dashboard');
await this.sections.toggle('clearCacheBtn');
const cacheButton = this.page.locator('p:has-text("This action will clear") + a').first();
await cacheButton.click();
await expect(this.page.getByText('WP Rocket: Cache cleared.')).toBeVisible();
});

Expand All @@ -261,6 +262,20 @@ When('I visit page {string} with browser dimension {int} x {int}', async functio
await this.utils.visitPage(page);
});

/**
* Executes the step to visit scenario urls for visual regression testing in a specific browser dimension.
*/
When('I visit scenario urls', async function (this:ICustomWorld) {
await this.page.setViewportSize({
width: 1600,
height: 700,
});
const liveUrl = SCENARIO_URLS;

for (const key in liveUrl) {
await this.utils.visitPage(liveUrl[key].path);
}
});
/**
* Executes the step to visit beacon driven page in a specific browser dimension.
*/
Expand Down Expand Up @@ -326,6 +341,17 @@ Then('I must not see any visual regression {string}', async function (this: ICus
await compareReference(label);
});

/**
* Executes the step to check for LRC visual regression.
*/
Then('I must not see any visual regression in scenario urls', async function (this: ICustomWorld) {
const liveUrl = SCENARIO_URLS;

for (const key in liveUrl) {
await compareReference(key);
}
});

/**
* Executes the step to check for that there is no console error different from the nowprocket page version.
*/
Expand Down
2 changes: 1 addition & 1 deletion utils/helpers.ts
Original file line number Diff line number Diff line change
Expand Up @@ -273,7 +273,7 @@ export const batchUpdateVRTestUrl = async(config: VRurlConfig): Promise<void> =>
}
else{
beforeScript = '';
readyScript = config.optimize ? 'scrollToBottom.js' : '';
readyScript = 'scrollToBottom.js';
}

viewports = 'mobile' in urls[key] && urls[key].mobile ? mobileViewport : [];
Expand Down
Loading