Blocks: Update Columns E2E writing flow, snapshot

WordPress · Jun 25, 2018 · 42e9201 · 42e9201
1 parent 6dfe2af
commit 42e9201
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 11 deletions.
diff --git a/test/e2e/specs/__snapshots__/writing-flow.test.js.snap b/test/e2e/specs/__snapshots__/writing-flow.test.js.snap
@@ -7,13 +7,21 @@ exports[`adding blocks Should navigate inner blocks with arrow keys 1`] = `
 
 <!-- wp:columns -->
 <div class=\\"wp-block-columns has-2-columns\\">
-	<!-- wp:paragraph {\\"layout\\":\\"column-1\\"} -->
-	<p class=\\"layout-column-1\\">First column paragraph</p>
-	<!-- /wp:paragraph -->
+	<!-- wp:column -->
+	<div class=\\"wp-block-column\\">
+		<!-- wp:paragraph -->
+		<p>First column paragraph</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:column -->
 
-	<!-- wp:paragraph {\\"layout\\":\\"column-2\\"} -->
-	<p class=\\"layout-column-2\\">Second column paragraph</p>
-	<!-- /wp:paragraph -->
+	<!-- wp:column -->
+	<div class=\\"wp-block-column\\">
+		<!-- wp:paragraph -->
+		<p>Second column paragraph</p>
+		<!-- /wp:paragraph -->
+	</div>
+	<!-- /wp:column -->
 </div>
 <!-- /wp:columns -->
 

diff --git a/test/e2e/specs/writing-flow.test.js b/test/e2e/specs/writing-flow.test.js
@@ -29,7 +29,9 @@ describe( 'adding blocks', () => {
 		await page.keyboard.type( 'First column paragraph' );
 
 		// Arrow down should navigate through layouts in columns block (to
-		// its default appender).
+		// its default appender). Two key presses are required since the first
+		// will land user on the Column wrapper block.
+		await page.keyboard.press( 'ArrowDown' );
 		await page.keyboard.press( 'ArrowDown' );
 		await page.keyboard.type( 'Second column paragraph' );
 
@@ -43,15 +45,23 @@ describe( 'adding blocks', () => {
 		activeElementText = await page.evaluate( () => document.activeElement.textContent );
 		expect( activeElementText ).toBe( 'Second column paragraph' );
 
-		// Arrow up in inner blocks should navigate through text fields.
+		// Arrow up in inner blocks should navigate through (1) column wrapper,
+		// (2) text fields.
+		await page.keyboard.press( 'ArrowUp' );
 		await page.keyboard.press( 'ArrowUp' );
 		activeElementText = await page.evaluate( () => document.activeElement.textContent );
 		expect( activeElementText ).toBe( 'First column paragraph' );
 
-		// Arrow up from first text field in nested context focuses wrapper
-		// before escaping out.
+		// Arrow up from first text field in nested context focuses column and
+		// columns wrappers before escaping out.
+		let activeElementBlockType;
+		await page.keyboard.press( 'ArrowUp' );
+		activeElementBlockType = await page.evaluate( () => (
+			document.activeElement.getAttribute( 'data-type' )
+		) );
+		expect( activeElementBlockType ).toBe( 'core/column' );
 		await page.keyboard.press( 'ArrowUp' );
-		const activeElementBlockType = await page.evaluate( () => (
+		activeElementBlockType = await page.evaluate( () => (
 			document.activeElement.getAttribute( 'data-type' )
 		) );
 		expect( activeElementBlockType ).toBe( 'core/columns' );