Fix site editor E2E tests for Gutenberg latest (https://github.com/woocommerce/woocommerce-blocks/pull/6080)
* Add handling of editor context via GUTENBERG_EDITOR_CONTEXT env var * Fix flaky tests around editing templates * Wait for save template response to complete
This commit is contained in:
parent
f8c5e910d2
commit
fdb8dde033
|
@ -49,6 +49,7 @@ jobs:
|
|||
- name: E2E Tests (WP latest with Gutenberg plugin)
|
||||
env:
|
||||
WOOCOMMERCE_BLOCKS_PHASE: 3
|
||||
GUTENBERG_EDITOR_CONTEXT: 'gutenberg'
|
||||
run: |
|
||||
chmod -R 767 ./ #needed for permissions issues
|
||||
JSON='{"plugins": ["https://downloads.wordpress.org/plugin/woocommerce.latest-stable.zip","https://github.com/WP-API/Basic-Auth/archive/master.zip","https://downloads.wordpress.org/plugin/gutenberg.latest-stable.zip", "."] }'
|
||||
|
|
|
@ -136,7 +136,7 @@
|
|||
"patch-package": "6.4.7",
|
||||
"postcss": "8.2.13",
|
||||
"postcss-loader": "4.2.0",
|
||||
"prettier": "npm:wp-prettier@^2.0.5",
|
||||
"prettier": "npm:wp-prettier@2.0.5",
|
||||
"progress-bar-webpack-plugin": "2.1.0",
|
||||
"promptly": "3.2.0",
|
||||
"react-docgen": "5.4.0",
|
||||
|
@ -11717,27 +11717,27 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@wordpress/e2e-test-utils/node_modules/@wordpress/api-fetch": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-6.0.1.tgz",
|
||||
"integrity": "sha512-rodFmGcnhI5gLKRueabLHiNrPpl/i+DCD23xg8/xs2Iyr47YFZZN4KB8WKaRVDxPZQJAB67IqMLs/h4U02HdmA==",
|
||||
"version": "6.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-6.1.1.tgz",
|
||||
"integrity": "sha512-6RHPgwLC+gg8geRsCAXgBW27X4NbV31IHH1rQR0LWecQutTfIrcW/RE2nJtX86X/ayFkBpM//9TflJ57r5o3lQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/i18n": "^4.3.1",
|
||||
"@wordpress/url": "^3.4.1"
|
||||
"@wordpress/i18n": "^4.4.1",
|
||||
"@wordpress/url": "^3.5.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/@wordpress/e2e-test-utils/node_modules/@wordpress/i18n": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.3.1.tgz",
|
||||
"integrity": "sha512-4xeGUOhZL+Xl97VPSEslWJxCjQPuK2I8AEJWe5cb1u/YOcgTzOav2QN7T7wYzt3Os5bfqNBmTFMfOr+1goFPrw==",
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.4.1.tgz",
|
||||
"integrity": "sha512-cDD3dxynq0P+HwB1dwUD2xpmjTr55oyuB0Mybcr8N4sTrbl/bDj5VRrh8bdps7KSqIdM4OuMtxJKLbg3y5CktA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/hooks": "^3.3.1",
|
||||
"@wordpress/hooks": "^3.4.1",
|
||||
"gettext-parser": "^1.3.1",
|
||||
"lodash": "^4.17.21",
|
||||
"memize": "^1.1.0",
|
||||
|
@ -11906,9 +11906,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@wordpress/hooks": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/hooks/-/hooks-3.3.1.tgz",
|
||||
"integrity": "sha512-Eyc5YYX8010Ihr6Ab4lq9G7J9DmPiLnGf6C4WwEMf0iQ9SBw8hcp2TCwkSyC12DU7iY0o11FYGfgdGW3UpPiYA==",
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/hooks/-/hooks-3.4.1.tgz",
|
||||
"integrity": "sha512-+RODEvxNsx3KW5nvk4KbnYMNFYvWA4Fduf784Ht7PJoL2L3z63Wm2blRh7a21hDEFHGPgWkne0f3Fgr/dqalHA==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0"
|
||||
},
|
||||
|
@ -12043,12 +12043,12 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@wordpress/keycodes": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/keycodes/-/keycodes-3.3.1.tgz",
|
||||
"integrity": "sha512-d/8wCjqB8c5426i8kLSRDxR/tezZFR0R/OOPFLoh/XnKiuRda/8OuPdSTUDmsLCam+yjV9K5uRm0KcMiZeFu7A==",
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/keycodes/-/keycodes-3.4.1.tgz",
|
||||
"integrity": "sha512-z/pIY0JtLVCxMClKZFnSbhumDbTDf69F4vHYLESNRdAJktqPRRzKsSeg69tJKI+00QzVakKWAvoyyyjopmxoCQ==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/i18n": "^4.3.1",
|
||||
"@wordpress/i18n": "^4.4.1",
|
||||
"lodash": "^4.17.21"
|
||||
},
|
||||
"engines": {
|
||||
|
@ -12056,12 +12056,12 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@wordpress/keycodes/node_modules/@wordpress/i18n": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.3.1.tgz",
|
||||
"integrity": "sha512-4xeGUOhZL+Xl97VPSEslWJxCjQPuK2I8AEJWe5cb1u/YOcgTzOav2QN7T7wYzt3Os5bfqNBmTFMfOr+1goFPrw==",
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.4.1.tgz",
|
||||
"integrity": "sha512-cDD3dxynq0P+HwB1dwUD2xpmjTr55oyuB0Mybcr8N4sTrbl/bDj5VRrh8bdps7KSqIdM4OuMtxJKLbg3y5CktA==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/hooks": "^3.3.1",
|
||||
"@wordpress/hooks": "^3.4.1",
|
||||
"gettext-parser": "^1.3.1",
|
||||
"lodash": "^4.17.21",
|
||||
"memize": "^1.1.0",
|
||||
|
@ -14848,9 +14848,9 @@
|
|||
}
|
||||
},
|
||||
"node_modules/@wordpress/url": {
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/url/-/url-3.4.1.tgz",
|
||||
"integrity": "sha512-EeE/qCTe2wYxvEhH4ygV8CONX7j1aQaZF5LUg+QHZ+cnV5Bo8SkcLZdOHqczwvljqwVnKc+ybzQx/WLE+APNSw==",
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/url/-/url-3.5.1.tgz",
|
||||
"integrity": "sha512-m4gjNdOkwaZ9NOVk/lYtpW4GoxHU0ZSv6WX3pFYRDSPdI1eX45uA8RrhPBYuj/e/XPUBiS+FXDilR0uvqqz9FA==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"lodash": "^4.17.21"
|
||||
|
@ -57278,24 +57278,24 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@wordpress/api-fetch": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-6.0.1.tgz",
|
||||
"integrity": "sha512-rodFmGcnhI5gLKRueabLHiNrPpl/i+DCD23xg8/xs2Iyr47YFZZN4KB8WKaRVDxPZQJAB67IqMLs/h4U02HdmA==",
|
||||
"version": "6.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-6.1.1.tgz",
|
||||
"integrity": "sha512-6RHPgwLC+gg8geRsCAXgBW27X4NbV31IHH1rQR0LWecQutTfIrcW/RE2nJtX86X/ayFkBpM//9TflJ57r5o3lQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/i18n": "^4.3.1",
|
||||
"@wordpress/url": "^3.4.1"
|
||||
"@wordpress/i18n": "^4.4.1",
|
||||
"@wordpress/url": "^3.5.1"
|
||||
}
|
||||
},
|
||||
"@wordpress/i18n": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.3.1.tgz",
|
||||
"integrity": "sha512-4xeGUOhZL+Xl97VPSEslWJxCjQPuK2I8AEJWe5cb1u/YOcgTzOav2QN7T7wYzt3Os5bfqNBmTFMfOr+1goFPrw==",
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.4.1.tgz",
|
||||
"integrity": "sha512-cDD3dxynq0P+HwB1dwUD2xpmjTr55oyuB0Mybcr8N4sTrbl/bDj5VRrh8bdps7KSqIdM4OuMtxJKLbg3y5CktA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/hooks": "^3.3.1",
|
||||
"@wordpress/hooks": "^3.4.1",
|
||||
"gettext-parser": "^1.3.1",
|
||||
"lodash": "^4.17.21",
|
||||
"memize": "^1.1.0",
|
||||
|
@ -57429,9 +57429,9 @@
|
|||
}
|
||||
},
|
||||
"@wordpress/hooks": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/hooks/-/hooks-3.3.1.tgz",
|
||||
"integrity": "sha512-Eyc5YYX8010Ihr6Ab4lq9G7J9DmPiLnGf6C4WwEMf0iQ9SBw8hcp2TCwkSyC12DU7iY0o11FYGfgdGW3UpPiYA==",
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/hooks/-/hooks-3.4.1.tgz",
|
||||
"integrity": "sha512-+RODEvxNsx3KW5nvk4KbnYMNFYvWA4Fduf784Ht7PJoL2L3z63Wm2blRh7a21hDEFHGPgWkne0f3Fgr/dqalHA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0"
|
||||
}
|
||||
|
@ -57532,22 +57532,22 @@
|
|||
}
|
||||
},
|
||||
"@wordpress/keycodes": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/keycodes/-/keycodes-3.3.1.tgz",
|
||||
"integrity": "sha512-d/8wCjqB8c5426i8kLSRDxR/tezZFR0R/OOPFLoh/XnKiuRda/8OuPdSTUDmsLCam+yjV9K5uRm0KcMiZeFu7A==",
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/keycodes/-/keycodes-3.4.1.tgz",
|
||||
"integrity": "sha512-z/pIY0JtLVCxMClKZFnSbhumDbTDf69F4vHYLESNRdAJktqPRRzKsSeg69tJKI+00QzVakKWAvoyyyjopmxoCQ==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/i18n": "^4.3.1",
|
||||
"@wordpress/i18n": "^4.4.1",
|
||||
"lodash": "^4.17.21"
|
||||
},
|
||||
"dependencies": {
|
||||
"@wordpress/i18n": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.3.1.tgz",
|
||||
"integrity": "sha512-4xeGUOhZL+Xl97VPSEslWJxCjQPuK2I8AEJWe5cb1u/YOcgTzOav2QN7T7wYzt3Os5bfqNBmTFMfOr+1goFPrw==",
|
||||
"version": "4.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/i18n/-/i18n-4.4.1.tgz",
|
||||
"integrity": "sha512-cDD3dxynq0P+HwB1dwUD2xpmjTr55oyuB0Mybcr8N4sTrbl/bDj5VRrh8bdps7KSqIdM4OuMtxJKLbg3y5CktA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"@wordpress/hooks": "^3.3.1",
|
||||
"@wordpress/hooks": "^3.4.1",
|
||||
"gettext-parser": "^1.3.1",
|
||||
"lodash": "^4.17.21",
|
||||
"memize": "^1.1.0",
|
||||
|
@ -59681,9 +59681,9 @@
|
|||
}
|
||||
},
|
||||
"@wordpress/url": {
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/url/-/url-3.4.1.tgz",
|
||||
"integrity": "sha512-EeE/qCTe2wYxvEhH4ygV8CONX7j1aQaZF5LUg+QHZ+cnV5Bo8SkcLZdOHqczwvljqwVnKc+ybzQx/WLE+APNSw==",
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@wordpress/url/-/url-3.5.1.tgz",
|
||||
"integrity": "sha512-m4gjNdOkwaZ9NOVk/lYtpW4GoxHU0ZSv6WX3pFYRDSPdI1eX45uA8RrhPBYuj/e/XPUBiS+FXDilR0uvqqz9FA==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.16.0",
|
||||
"lodash": "^4.17.21"
|
||||
|
|
|
@ -101,6 +101,10 @@ const SELECTORS = {
|
|||
'WooCommerce Single Product Block'
|
||||
),
|
||||
},
|
||||
templates: {
|
||||
templateActions:
|
||||
'[aria-label="Templates list - Content"] [aria-label="Actions"]',
|
||||
},
|
||||
};
|
||||
|
||||
const CUSTOMIZED_STRING = 'My awesome customization';
|
||||
|
@ -120,7 +124,6 @@ describe( 'Store Editing Templates', () => {
|
|||
const EXPECTED_TEMPLATE = defaultTemplateProps( 'Single Product' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -167,6 +170,8 @@ describe( 'Store Editing Templates', () => {
|
|||
await visitTemplateAndAddCustomParagraph( 'single-product' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
// we need to wait for the selector to show up, sometimes the loading is delayed and test becomes flaky
|
||||
await page.waitForSelector( SELECTORS.templates.templateActions );
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -220,7 +225,6 @@ describe( 'Store Editing Templates', () => {
|
|||
const EXPECTED_TEMPLATE = defaultTemplateProps( 'Product Catalog' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -264,6 +268,7 @@ describe( 'Store Editing Templates', () => {
|
|||
await visitTemplateAndAddCustomParagraph( 'archive-product' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
await page.waitForSelector( SELECTORS.templates.templateActions );
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -320,7 +325,6 @@ describe( 'Store Editing Templates', () => {
|
|||
);
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -365,6 +369,7 @@ describe( 'Store Editing Templates', () => {
|
|||
await visitTemplateAndAddCustomParagraph( 'taxonomy-product_cat' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
await page.waitForSelector( SELECTORS.templates.templateActions );
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -415,7 +420,6 @@ describe( 'Store Editing Templates', () => {
|
|||
const EXPECTED_TEMPLATE = defaultTemplateProps( 'Products by Tag' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
@ -460,6 +464,7 @@ describe( 'Store Editing Templates', () => {
|
|||
await visitTemplateAndAddCustomParagraph( 'taxonomy-product_tag' );
|
||||
|
||||
await goToSiteEditor( '?postType=wp_template' );
|
||||
await page.waitForSelector( SELECTORS.templates.templateActions );
|
||||
const templates = await getAllTemplates();
|
||||
|
||||
try {
|
||||
|
|
|
@ -9,9 +9,8 @@ import {
|
|||
pressKeyWithModifier,
|
||||
switchUserToAdmin,
|
||||
visitAdminPage,
|
||||
visitSiteEditor,
|
||||
} from '@wordpress/e2e-test-utils';
|
||||
import { getQueryArgs } from '@wordpress/url';
|
||||
import { addQueryArgs } from '@wordpress/url';
|
||||
import { WP_ADMIN_DASHBOARD } from '@woocommerce/e2e-utils';
|
||||
|
||||
/**
|
||||
|
@ -29,6 +28,8 @@ import { elementExists, getElementData, getTextContent } from './page-utils';
|
|||
*/
|
||||
|
||||
export const BASE_URL = config.get( 'url' );
|
||||
export const GUTENBERG_EDITOR_CONTEXT =
|
||||
process.env.GUTENBERG_EDITOR_CONTEXT || 'core';
|
||||
export const DEFAULT_TIMEOUT = 30000;
|
||||
|
||||
const SELECTORS = {
|
||||
|
@ -143,21 +144,33 @@ export const isBlockInsertedInWidgetsArea = async ( blockName ) => {
|
|||
*
|
||||
* There are two different possible site editor pages:
|
||||
*
|
||||
* 1. `themes.php?page=gutenberg-edit-site` is the one used and available if the Gutenberg plugin is enabled.
|
||||
* 2. `site-editor.php` is the one available in WP Core.
|
||||
* 1. `themes.php?page=gutenberg-edit-site` this is a legacy editor access used for WP <=5.8.
|
||||
* 2. `site-editor.php` is the new way of accessing the editor in WP >=5.9+.
|
||||
*
|
||||
* @param {string} query String to be serialized as query portion of URL.
|
||||
* @param {'core' | 'gutenberg'} [editorContext='core'] Whether to go to the Gutenberg URL or the Core one.
|
||||
*/
|
||||
export async function goToSiteEditor( query, editorContext = 'core' ) {
|
||||
if ( editorContext === 'gutenberg' ) {
|
||||
const queryArgs = getQueryArgs( query );
|
||||
export async function goToSiteEditor(
|
||||
query,
|
||||
editorContext = GUTENBERG_EDITOR_CONTEXT
|
||||
) {
|
||||
// There is a bug in Gutenberg/WPCore now that makes it impossible to rely on site-editor.php on setups
|
||||
// with locally installed Gutenberg. Details in https://github.com/WordPress/gutenberg/issues/39639.
|
||||
// TODO: Update to always use site-editor.php once WordPress 6.0 is released and fix is verified.
|
||||
// Remove usage of GUTENBERG_EDITOR_CONTEXT from from here and from workflows.
|
||||
|
||||
await visitSiteEditor( queryArgs );
|
||||
} else {
|
||||
await visitAdminPage( 'site-editor.php', query );
|
||||
await disableSiteEditorWelcomeGuide();
|
||||
let editorPath = 'site-editor.php';
|
||||
let queryString = query;
|
||||
|
||||
if ( editorContext === 'gutenberg' ) {
|
||||
editorPath = 'themes.php';
|
||||
queryString = addQueryArgs( queryString, {
|
||||
page: 'gutenberg-edit-site',
|
||||
} );
|
||||
}
|
||||
|
||||
await visitAdminPage( editorPath, queryString );
|
||||
await disableSiteEditorWelcomeGuide();
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -179,8 +192,13 @@ export async function saveTemplate() {
|
|||
|
||||
await page.click( saveButton );
|
||||
await page.waitForSelector( savePrompt );
|
||||
|
||||
await page.click( confirmSave );
|
||||
await page.waitForSelector( `${ saveButton }[aria-disabled="true"]` );
|
||||
await page.waitForResponse( ( res ) => {
|
||||
// Will match both templates and template_parts endpoints.
|
||||
return res.url().includes( '/wp/v2/template' );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue