From 982bfef6780bff7c0821d379ab86756300450446 Mon Sep 17 00:00:00 2001
From: Robert Anderson <robert@noisysocks.com>
Date: Wed, 30 May 2018 15:46:01 +1000
Subject: [PATCH] E2E tests: Introduce insertBlock() util

Refactor some tests to use insertBlock() which correctly opens the
inserter, searches for a term, then selects the first result.

The utility method correctly waits for the inserter to appear which is
important since, if this is not done, intermittent test failures can
happen.
---
 test/e2e/specs/adding-blocks.test.js         |  9 ++-------
 test/e2e/specs/multi-block-selection.test.js | 14 +++-----------
 test/e2e/specs/splitting-merging.test.js     |  8 ++------
 test/e2e/support/utils.js                    | 17 +++++++++++++++++
 4 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/test/e2e/specs/adding-blocks.test.js b/test/e2e/specs/adding-blocks.test.js
index d687b74f4c9534..1aa2e1aaa8b6b5 100644
--- a/test/e2e/specs/adding-blocks.test.js
+++ b/test/e2e/specs/adding-blocks.test.js
@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import '../support/bootstrap';
-import { newPost, newDesktopBrowserPage } from '../support/utils';
+import { newPost, newDesktopBrowserPage, insertBlock } from '../support/utils';
 
 describe( 'adding blocks', () => {
 	beforeAll( async () => {
@@ -49,12 +49,7 @@ describe( 'adding blocks', () => {
 		await page.keyboard.type( 'Quote block' );
 
 		// Using the regular inserter
-		await page.click( '.edit-post-header [aria-label="Add block"]' );
-		await page.waitForSelector( '.editor-inserter__menu' );
-		await page.keyboard.type( 'code' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Enter' );
+		await insertBlock( 'code' );
 		await page.keyboard.type( 'Code block' );
 
 		// Unselect blocks to avoid conflicts with the inbetween inserter
diff --git a/test/e2e/specs/multi-block-selection.test.js b/test/e2e/specs/multi-block-selection.test.js
index 6f938ad7ebd5be..fae260ca0efbc4 100644
--- a/test/e2e/specs/multi-block-selection.test.js
+++ b/test/e2e/specs/multi-block-selection.test.js
@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import '../support/bootstrap';
-import { newPost, newDesktopBrowserPage, pressWithModifier } from '../support/utils';
+import { newPost, newDesktopBrowserPage, pressWithModifier, insertBlock } from '../support/utils';
 
 describe( 'Multi-block selection', () => {
 	beforeAll( async () => {
@@ -19,16 +19,8 @@ describe( 'Multi-block selection', () => {
 		// Creating test blocks
 		await page.click( '.editor-default-block-appender' );
 		await page.keyboard.type( 'First Paragraph' );
-		await page.click( '.edit-post-header [aria-label="Add block"]' );
-		await page.keyboard.type( 'Image' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Enter' );
-		await page.click( '.edit-post-header [aria-label="Add block"]' );
-		await page.keyboard.type( 'Quote' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Enter' );
+		await insertBlock( 'Image' );
+		await insertBlock( 'Quote' );
 		await page.keyboard.type( 'Quote Block' );
 
 		const blocks = [ firstBlockSelector, secondBlockSelector, thirdBlockSelector ];
diff --git a/test/e2e/specs/splitting-merging.test.js b/test/e2e/specs/splitting-merging.test.js
index 42403f99767e95..4790aa8f2cc07f 100644
--- a/test/e2e/specs/splitting-merging.test.js
+++ b/test/e2e/specs/splitting-merging.test.js
@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import '../support/bootstrap';
-import { newPost, newDesktopBrowserPage } from '../support/utils';
+import { newPost, newDesktopBrowserPage, insertBlock } from '../support/utils';
 
 describe( 'splitting and merging blocks', () => {
 	beforeAll( async () => {
@@ -12,11 +12,7 @@ describe( 'splitting and merging blocks', () => {
 
 	it( 'Should split and merge paragraph blocks using Enter and Backspace', async () => {
 		//Use regular inserter to add paragraph block and text
-		await page.click( '.edit-post-header [aria-label="Add block"]' );
-		await page.keyboard.type( 'paragraph' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Tab' );
-		await page.keyboard.press( 'Enter' );
+		await insertBlock( 'paragraph' );
 		await page.keyboard.type( 'FirstSecond' );
 
 		//Move caret between 'First' and 'Second' and press Enter to split paragraph blocks
diff --git a/test/e2e/support/utils.js b/test/e2e/support/utils.js
index 188f5c788a4229..f68255c11fee1d 100644
--- a/test/e2e/support/utils.js
+++ b/test/e2e/support/utils.js
@@ -92,6 +92,23 @@ export async function getHTMLFromCodeEditor() {
 	return textEditorContent;
 }
 
+/**
+ * Opens the inserter, searches for the given term, then selects the first
+ * result that appears.
+ *
+ * @param {string} searchTerm The text to search the inserter for.
+ */
+export async function insertBlock( searchTerm ) {
+	await page.click( '.edit-post-header [aria-label="Add block"]' );
+	// Waiting here is necessary because sometimes the inserter takes more time to
+	// render than Puppeteer takes to complete the 'click' action
+	await page.waitForSelector( '.editor-inserter__menu' );
+	await page.keyboard.type( searchTerm );
+	await page.keyboard.press( 'Tab' );
+	await page.keyboard.press( 'Tab' );
+	await page.keyboard.press( 'Enter' );
+}
+
 /**
  * Performs a key press with modifier (Shift, Control, Meta, Mod), where "Mod"
  * is normalized to platform-specific modifier (Meta in MacOS, else Control).