[GB 11.4.0-rc1][E2E] Add GB edge support to Playwright Gutenberg widg…

…ets E2E (#55872)

* Add logic to use an edge site if GUTENBERG_EDGE is set

* Fix error on edge due to minor label difference

* Dedupe packages

* Revert yarn.lock changes

* @type/node is already part of `calypso/e2e`

test/e2e/specs/specs-playwright/wp-widgets__spec.ts

@@ -1,7 +1,8 @@
 import { DataHelper, LoginFlow, SidebarComponent, setupHooks } from '@automattic/calypso-e2e';
 import { Page } from 'playwright';
 
-const user = 'gutenbergSimpleSiteUser';
+const user =
+	process.env.GUTENBERG_EDGE === 'true' ? 'gutenbergSimpleSiteEdgeUser' : 'gutenbergSimpleSiteUser';
 
 describe( DataHelper.createSuiteTitle( 'Widgets' ), function () {
 	let sidebarComponent: SidebarComponent;
@@ -20,7 +21,10 @@ describe( DataHelper.createSuiteTitle( 'Widgets' ), function () {
 	it( 'Navigate to the Block Widgets Editor', async function () {
 		sidebarComponent = new SidebarComponent( page );
 		await sidebarComponent.navigate( 'Appearance', 'Widgets' );
-		const widgetsMenu = await page.waitForSelector( '"Customising ▸ Widgets"' );
+		// GB 10.4.0-rc-1 changed the english label to "Customize" from "Customise"
+		// (notice the `z`) we accept both since both are considered correct and
+		// shouldn't affect the UX.
+		const widgetsMenu = await page.waitForSelector( 'text=/Customi[s|z]ing ▸ Widgets/' );
 		await widgetsMenu.waitForElementState( 'stable' );
 	} );
 

test/e2e/tsconfig.json

@@ -2,7 +2,7 @@
 	"extends": "@automattic/calypso-build/typescript/ts-package.json",
 	"compilerOptions": {
 		"noEmit": true, // just type checking, no output. The output is handled by babel.
-		"types": [ "jest" ] // no mocha - we are only using TypeScript for the new Playwright scripts
+		"types": [ "jest", "node" ] // no mocha - we are only using TypeScript for the new Playwright scripts
 	},
 	// TypeScript is scoped only for the new Playwright scripts
 	"include": [ "specs/specs-playwright", "lib/gutenberg/tracking" ]