From 0cb8177167deb9b695b2509923ea0aa0bf31cd8a Mon Sep 17 00:00:00 2001
From: John Godley <johng75@gmail.com>
Date: Tue, 13 Nov 2018 14:26:43 +0000
Subject: [PATCH] Add e2e test for invalid blocks

Test that the invalid block warning appears and that buttons are clickable. Should cover the issue fixed in #11768
---
 test/e2e/specs/invalid-block.test.js | 43 ++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 test/e2e/specs/invalid-block.test.js

diff --git a/test/e2e/specs/invalid-block.test.js b/test/e2e/specs/invalid-block.test.js
new file mode 100644
index 00000000000000..4a3a9934b0eb9b
--- /dev/null
+++ b/test/e2e/specs/invalid-block.test.js
@@ -0,0 +1,43 @@
+/**
+ * Internal dependencies
+ */
+import {
+	newPost,
+	clickBlockAppender,
+} from '../support/utils';
+
+describe( 'invalid blocks', () => {
+	beforeEach( async () => {
+		await newPost();
+	} );
+
+	it( 'Should show an invalid block message with clickable options', async () => {
+		// Create an empty paragraph with the focus in the block
+		await clickBlockAppender();
+		await page.keyboard.type( 'hello' );
+
+		// 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
+		const changeModeButton = await page.waitForXPath( '//button[text()="Edit as HTML"]' );
+		await changeModeButton.click();
+
+		// Focus on the textarea and enter an invalid paragraph
+		await page.click( '.editor-block-list__layout .editor-block-list__block .editor-block-list__block-html-textarea' );
+		await page.keyboard.type( '<p>invalid paragraph' );
+
+		// Takes the focus away from the block so the invalid warning is triggered
+		await page.click( '.editor-post-save-draft' );
+		expect( console ).toHaveErrored();
+		expect( console ).toHaveWarned();
+
+		// Click on the 'resolve' button
+		await page.click( '.editor-warning__actions button' );
+
+		// Check we get the resolve modal with the appropriate contents
+		const htmlBlockContent = await page.$eval( '.editor-block-compare__html', ( node ) => node.textContent );
+		expect( htmlBlockContent ).toEqual( '<p>hello</p><p>invalid paragraph' );
+	} );
+} );