Update: Use escape key press instead of mouse movement to show block …

…toolbar (#14247) This PR updates our end to end tests to use escape key press instead of mouse movement to show the block toolbar. The PR follows a suggestion by @aduth in #14191 (comment) ## How has this been tested? We only need to make sure end 2 end tests pass
WordPress · Mar 5, 2019 · 7eb0853 · 7eb0853
1 parent 29b3dc5
commit 7eb0853
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 32 deletions.
diff --git a/packages/e2e-tests/specs/blocks/list.test.js b/packages/e2e-tests/specs/blocks/list.test.js
@@ -126,8 +126,8 @@ describe( 'List', () => {
 		await page.keyboard.press( 'Enter' );
 		// Pointer device is needed. Shift+Tab won't focus the toolbar.
 		// To do: fix so Shift+Tab works.
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		await page.click( 'button[aria-label="Indent list item"]' );
 		await page.keyboard.type( 'two' );
 		await transformBlockTo( 'Paragraph' );
@@ -200,8 +200,8 @@ describe( 'List', () => {
 		await page.keyboard.press( 'Enter' );
 		// Pointer device is needed. Shift+Tab won't focus the toolbar.
 		// To do: fix so Shift+Tab works.
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		await page.click( 'button[aria-label="Indent list item"]' );
 		await page.keyboard.type( 'two' );
 		await page.keyboard.press( 'Enter' );
@@ -235,8 +235,8 @@ describe( 'List', () => {
 
 		// Pointer device is needed. Shift+Tab won't focus the toolbar.
 		// To do: fix so Shift+Tab works.
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 
 		await page.click( 'button[aria-label="Convert to ordered list"]' );
 

diff --git a/packages/e2e-tests/specs/invalid-block.test.js b/packages/e2e-tests/specs/invalid-block.test.js
@@ -16,8 +16,9 @@ describe( 'invalid blocks', () => {
 		await clickBlockAppender();
 		await page.keyboard.type( 'hello' );
 
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		// Click the 'more options'
-		await page.mouse.move( 200, 300, { steps: 10 } );
 		await page.click( 'button[aria-label="More options"]' );
 
 		// Change to HTML mode and close the options

diff --git a/packages/e2e-tests/specs/links.test.js b/packages/e2e-tests/specs/links.test.js
@@ -24,11 +24,6 @@ describe( 'Links', () => {
 		await page.waitForFunction( () => !! document.activeElement.closest( '.editor-url-input' ) );
 	};
 
-	const moveMouse = async () => {
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
-	};
-
 	it( 'can be created by selecting text and clicking Link', async () => {
 		// Create a block with some text
 		await clickBlockAppender();
@@ -82,8 +77,8 @@ describe( 'Links', () => {
 		await clickBlockAppender();
 		await page.keyboard.type( 'This is Gutenberg: ' );
 
-		// Trigger isTyping = false
-		await moveMouse();
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 
 		// Press Cmd+K to insert a link
 		await pressKeyWithModifier( 'primary', 'K' );
@@ -224,8 +219,8 @@ describe( 'Links', () => {
 		await clickBlockAppender();
 		await page.keyboard.type( 'Text' );
 
-		// we need to trigger isTyping = false
-		await moveMouse();
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		await page.waitForSelector( 'button[aria-label="Link"]' );
 		await page.click( 'button[aria-label="Link"]' );
 
@@ -245,7 +240,8 @@ describe( 'Links', () => {
 		// Make a collapsed selection inside the link
 		await page.keyboard.press( 'ArrowLeft' );
 		await page.keyboard.press( 'ArrowRight' );
-		await moveMouse();
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		await page.click( 'button[aria-label="Edit"]' );
 		await waitForAutoFocus();
 		await page.keyboard.type( '/handbook' );

diff --git a/packages/e2e-tests/specs/plugins/format-api.test.js b/packages/e2e-tests/specs/plugins/format-api.test.js
@@ -26,7 +26,8 @@ describe( 'Using Format API', () => {
 	it( 'Format toolbar is present in a paragraph block', async () => {
 		await clickBlockAppender();
 		await page.keyboard.type( 'First paragraph' );
-		await page.mouse.move( 200, 300, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		expect( await page.$( '[aria-label="Custom Link"]' ) ).not.toBeNull();
 	} );
 
@@ -35,7 +36,8 @@ describe( 'Using Format API', () => {
 		await page.keyboard.type( 'First paragraph' );
 		await pressKeyWithModifier( 'shiftAlt', 'ArrowLeft' );
 		await pressKeyWithModifier( 'primary', 'A' );
-		await page.mouse.move( 200, 300, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 		await page.click( '[aria-label="Custom Link"]' );
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );

diff --git a/packages/e2e-tests/specs/reusable-blocks.test.js b/packages/e2e-tests/specs/reusable-blocks.test.js
@@ -34,9 +34,8 @@ describe( 'Reusable Blocks', () => {
 		await insertBlock( 'Paragraph' );
 		await page.keyboard.type( 'Hello there!' );
 
-		// Trigger isTyping = false
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 
 		// Convert block to a reusable block
 		await page.waitForSelector( 'button[aria-label="More options"]' );
@@ -81,9 +80,8 @@ describe( 'Reusable Blocks', () => {
 		await insertBlock( 'Paragraph' );
 		await page.keyboard.type( 'Hello there!' );
 
-		// Trigger isTyping = false
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 
 		// Convert block to a reusable block
 		await page.waitForSelector( 'button[aria-label="More options"]' );
@@ -222,10 +220,6 @@ describe( 'Reusable Blocks', () => {
 		await pressKeyWithModifier( 'primary', 'a' );
 		await pressKeyWithModifier( 'primary', 'a' );
 
-		// Trigger isTyping = false
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
-
 		// Convert block to a reusable block
 		await page.waitForSelector( 'button[aria-label="More options"]' );
 		await page.click( 'button[aria-label="More options"]' );

diff --git a/packages/e2e-tests/specs/style-variation.test.js b/packages/e2e-tests/specs/style-variation.test.js
@@ -13,9 +13,8 @@ describe( 'adding blocks', () => {
 		await insertBlock( 'Quote' );
 		await page.keyboard.type( 'Quote content' );
 
-		// we need to trigger isTyping = false
-		await page.mouse.move( 200, 300, { steps: 10 } );
-		await page.mouse.move( 250, 350, { steps: 10 } );
+		// Press escape to show the block toolbar
+		await page.keyboard.press( 'Escape' );
 
 		// Use a different style variation
 		await page.waitForSelector( 'button[aria-label="Change block type"]' );