E2E tests fix in GB build (#95282)

* Add block flow for test * Revert "Add block flow for test" This reverts commit 1472a47. * Fix issues on blocks test for Gutenberg * Fix tests * Fix twitter fallback causing issues for social icon
Automattic · Oct 10, 2024 · 22a9430 · 22a9430
1 parent db951d4
commit 22a9430
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 6 deletions.
diff --git a/packages/calypso-e2e/src/lib/blocks/block-flows/instagram.ts b/packages/calypso-e2e/src/lib/blocks/block-flows/instagram.ts
@@ -20,8 +20,10 @@ export class InstagramBlockFlow implements BlockFlow {
 		this.configurationData = configurationData;
 	}
 
-	blockSidebarName = 'Instagram';
+	blockSidebarName = 'Instagram Embed';
+	blockTestFallBackName = 'Instagram';
 	blockEditorSelector = '[aria-label="Block: Embed"]:has-text("Instagram URL")';
+	noSearch = false;
 
 	/**
 	 * Configure the block in the editor with the configuration data from the constructor

diff --git a/packages/calypso-e2e/src/lib/blocks/block-flows/twitter.ts b/packages/calypso-e2e/src/lib/blocks/block-flows/twitter.ts
@@ -29,7 +29,6 @@ export class TwitterBlockFlow implements BlockFlow {
 	}
 
 	blockSidebarName = 'Twitter Embed';
-	blockTestFallBackName = 'Twitter';
 	blockEditorSelector = blockParentSelector;
 
 	/**

diff --git a/packages/calypso-e2e/src/lib/blocks/block-flows/types.ts b/packages/calypso-e2e/src/lib/blocks/block-flows/types.ts
@@ -9,6 +9,7 @@ export interface BlockFlow {
 	blockTestName?: string;
 	blockTestFallBackName?: string;
 	blockEditorSelector: string;
+	noSearch?: boolean;
 	configure?( context: EditorContext ): Promise< void >;
 	validateAfterPublish?( context: PublishedPostContext ): Promise< void >;
 }

diff --git a/packages/calypso-e2e/src/lib/blocks/block-flows/youtube.ts b/packages/calypso-e2e/src/lib/blocks/block-flows/youtube.ts
@@ -10,7 +10,7 @@ const selectors = {
 	embedUrlInput: `${ blockParentSelector } input`,
 	embedButton: `${ blockParentSelector } button:has-text("Embed")`,
 	editorYouTubeIframe: 'iframe[title="Embedded content from www.youtube.com"]',
-	publishedYouTubeIframe: `iframe.youtube-player`,
+	publishedYouTubeIframe: '',
 };
 
 /**
@@ -26,10 +26,10 @@ export class YouTubeBlockFlow implements BlockFlow {
 	 */
 	constructor( configurationData: ConfigurationData ) {
 		this.configurationData = configurationData;
+		selectors.publishedYouTubeIframe = `iframe[title="${ this.configurationData.expectedVideoTitle }"]`;
 	}
 
 	blockSidebarName = 'YouTube Embed';
-	blockTestFallBackName = 'YouTube';
 	blockEditorSelector = blockParentSelector;
 
 	/**

diff --git a/test/e2e/specs/blocks/blocks__core.ts b/test/e2e/specs/blocks/blocks__core.ts
@@ -13,7 +13,7 @@ import { createBlockTests } from './shared/block-smoke-testing';
 const blockFlows: BlockFlow[] = [
 	new YouTubeBlockFlow( {
 		embedUrl: 'https://www.youtube.com/watch?v=twGLN4lug-I',
-		expectedVideoTitle: 'Getting Started on @wordpress-com',
+		expectedVideoTitle: 'Getting started on @wordpressdotcom',
 	} ),
 	new LayoutGridBlockFlow( {
 		leftColumnText: DataHelper.getRandomPhrase(),

diff --git a/test/e2e/specs/blocks/shared/block-smoke-testing.ts b/test/e2e/specs/blocks/shared/block-smoke-testing.ts
@@ -68,7 +68,10 @@ export function createBlockTests( specName: string, blockFlows: BlockFlow[] ): v
 					const blockHandle = await editorPage.addBlockFromSidebar(
 						blockFlow.blockSidebarName,
 						blockFlow.blockEditorSelector,
-						{ noSearch: true, blockFallBackName: blockFlow.blockTestFallBackName }
+						{
+							noSearch: blockFlow.noSearch === false ? false : true,
+							blockFallBackName: blockFlow.blockTestFallBackName,
+						}
 					);
 					const id = await blockHandle.getAttribute( 'id' );
 					const editorCanvas = await editorPage.getEditorCanvas();