From a497b087037535c5609ff8ab13143253834e916c Mon Sep 17 00:00:00 2001
From: James Nylen <jnylen@gmail.com>
Date: Mon, 12 Jun 2017 17:39:48 -0400
Subject: [PATCH 1/4] Remove TinyMCE-based parser

---
 blocks/api/parser.js      | 125 -------------------
 blocks/api/test/parser.js | 247 ++++++++++++++++++--------------------
 bootstrap-test.js         |   1 +
 webpack.config.js         |   3 -
 4 files changed, 121 insertions(+), 255 deletions(-)

diff --git a/blocks/api/parser.js b/blocks/api/parser.js
index 006f942c1fb01a..47a7269f93ce81 100644
--- a/blocks/api/parser.js
+++ b/blocks/api/parser.js
@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import tinymce from 'tinymce';
 import { parse as hpqParse } from 'hpq';
 import { escape, unescape, pickBy } from 'lodash';
 
@@ -95,130 +94,6 @@ export function createBlockWithFallback( name, rawContent, attributes ) {
 	}
 }
 
-/**
- * Parses the post content with TinyMCE and returns a list of blocks.
- *
- * @param  {String} content The post content
- * @return {Array}          Block list
- */
-export function parseWithTinyMCE( content ) {
-	// First, convert comment delimiters into temporary <wp-block> "tags" so
-	// that TinyMCE can parse them.  Examples:
-	//   In  : <!-- wp:core/text -->
-	//   Out : <wp-block slug="core/text">
-	//   In  : <!-- /wp:core/text -->
-	//   Out : </wp-block>
-	//   In  : <!-- wp:core/embed url:youtube.com/xxx& -->
-	//   Out : <wp-block slug="core/embed" attributes="url:youtube.com/xxx&amp;">
-	content = content.replace(
-		/<!--\s*(\/?)wp:([a-z0-9/-]+)((?:\s+[a-z0-9_-]+(="[^"]*")?)*)\s*-->/g,
-		function( match, closingSlash, slug, attributes ) {
-			if ( closingSlash ) {
-				return '</wp-block>';
-			}
-
-			if ( attributes ) {
-				attributes = ' attributes="' + escape( attributes.trim() ) + '"';
-			}
-			return '<wp-block slug="' + slug + '"' + attributes + '>';
-		}
-	);
-
-	// Create a custom HTML schema.
-	const schema = new tinymce.html.Schema();
-
-	// Add <wp-block> "tags" to our schema.
-	schema.addCustomElements( 'wp-block' );
-
-	// Add valid <wp-block> "attributes" also.
-	schema.addValidElements( 'wp-block[slug|attributes]' );
-
-	// Initialize the parser with our custom schema.
-	const parser = new tinymce.html.DomParser( { validate: true }, schema );
-
-	// Parse the content into an object tree.
-	const tree = parser.parse( content );
-
-	// Create a serializer that we will use to pass strings to blocks.
-	// TODO: pass parse trees instead, and verify them against the markup
-	// shapes that each block can accept.
-	const serializer = new tinymce.html.Serializer( { validate: true }, schema );
-
-	// Walk the tree and initialize blocks.
-	const blocks = [];
-
-	// Store markup we found in between blocks.
-	let contentBetweenBlocks = null;
-	function flushContentBetweenBlocks() {
-		if ( contentBetweenBlocks && contentBetweenBlocks.firstChild ) {
-			const block = createBlockWithFallback(
-				null, // default: unknown type handler
-				serializer.serialize( contentBetweenBlocks ),
-				null  // no known attributes
-			);
-			if ( block ) {
-				blocks.push( block );
-			}
-		}
-		contentBetweenBlocks = new tinymce.html.Node( 'body', 11 );
-	}
-	flushContentBetweenBlocks();
-
-	let currentNode = tree.firstChild;
-	while ( currentNode ) {
-		if ( currentNode.name === 'wp-block' ) {
-			// Set node type to document fragment so that the TinyMCE
-			// serializer doesn't output its markup.
-			currentNode.type = 11;
-
-			// Serialize the content
-			const rawContent = serializer.serialize( currentNode );
-
-			// Retrieve the attributes from the <wp-block> tag.
-			const nodeAttributes = currentNode.attributes.reduce( ( memo, attr ) => {
-				memo[ attr.name ] = attr.value;
-				return memo;
-			}, {} );
-
-			// Retrieve the block attributes from the original delimiters.
-			const attributesMatcher = /([a-z0-9_-]+)(="([^"]*)")?/g;
-			const blockAttributes = {};
-			let match;
-			do {
-				match = attributesMatcher.exec( unescape( nodeAttributes.attributes || '' ) );
-				if ( match ) {
-					blockAttributes[ match[ 1 ] ] = !! match[ 2 ] ? match[ 3 ] : true;
-				}
-			} while ( !! match );
-
-			// Try to create the block.
-			const block = createBlockWithFallback(
-				nodeAttributes.slug,
-				rawContent,
-				blockAttributes
-			);
-			if ( block ) {
-				flushContentBetweenBlocks();
-				blocks.push( block );
-			}
-
-			currentNode = currentNode.next;
-		} else {
-			// We have some HTML content outside of block delimiters.  Save it
-			// so that we can initialize it using `getUnknownTypeHandler`.
-			const toAppend = currentNode;
-			// Advance the DOM tree pointer before calling `append` because
-			// this is a destructive operation.
-			currentNode = currentNode.next;
-			contentBetweenBlocks.append( toAppend );
-		}
-	}
-
-	flushContentBetweenBlocks();
-
-	return blocks;
-}
-
 /**
  * Parses the post content with a PegJS grammar and returns a list of blocks.
  *
diff --git a/blocks/api/test/parser.js b/blocks/api/test/parser.js
index 506b33abdd429a..2deb2e25a8e8d6 100644
--- a/blocks/api/test/parser.js
+++ b/blocks/api/test/parser.js
@@ -11,8 +11,7 @@ import {
 	getBlockAttributes,
 	parseBlockAttributes,
 	createBlockWithFallback,
-	parseWithGrammar,
-	parseWithTinyMCE,
+	default as parse,
 } from '../parser';
 import {
 	registerBlockType,
@@ -141,132 +140,126 @@ describe( 'block parser', () => {
 	} );
 
 	describe( 'parse()', () => {
-		const parsers = { parseWithTinyMCE, parseWithGrammar };
-		Object.keys( parsers ).forEach( ( parser ) => {
-			const parse = parsers[ parser ];
-			describe( parser, () => {
-				it( 'should parse the post content, including block attributes', () => {
-					registerBlockType( 'core/test-block', {
-						// Currently this is the only way to test block content parsing?
-						attributes: function( rawContent ) {
-							return {
-								content: rawContent,
-							};
-						},
-					} );
-
-					const parsed = parse(
-						'<!-- wp:core/test-block smoked="yes" url="http://google.com" chicken="ribs & \'wings\'" -->' +
-						'Brisket' +
-						'<!-- /wp:core/test-block -->'
-					);
-
-					expect( parsed ).to.have.lengthOf( 1 );
-					expect( parsed[ 0 ].name ).to.equal( 'core/test-block' );
-					expect( parsed[ 0 ].attributes ).to.eql( {
-						content: 'Brisket',
-						smoked: 'yes',
-						url: 'http://google.com',
-						chicken: 'ribs & \'wings\'',
-					} );
-					expect( parsed[ 0 ].uid ).to.be.a( 'string' );
-				} );
-
-				it( 'should parse empty post content', () => {
-					const parsed = parse( '' );
-
-					expect( parsed ).to.eql( [] );
-				} );
-
-				it( 'should parse the post content, ignoring unknown blocks', () => {
-					registerBlockType( 'core/test-block', {
-						attributes: function( rawContent ) {
-							return {
-								content: rawContent + ' & Chicken',
-							};
-						},
-					} );
-
-					const parsed = parse(
-						'<!-- wp:core/test-block -->\nRibs\n<!-- /wp:core/test-block -->' +
-						'<p>Broccoli</p>' +
-						'<!-- wp:core/unknown-block -->Ribs<!-- /wp:core/unknown-block -->'
-					);
-
-					expect( parsed ).to.have.lengthOf( 1 );
-					expect( parsed[ 0 ].name ).to.equal( 'core/test-block' );
-					expect( parsed[ 0 ].attributes ).to.eql( {
-						content: 'Ribs & Chicken',
-					} );
-					expect( parsed[ 0 ].uid ).to.be.a( 'string' );
-				} );
-
-				it( 'should parse the post content, using unknown block handler', () => {
-					registerBlockType( 'core/test-block', {} );
-					registerBlockType( 'core/unknown-block', {} );
-
-					setUnknownTypeHandler( 'core/unknown-block' );
-
-					const parsed = parse(
-						'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
-						'<p>Broccoli</p>' +
-						'<!-- wp:core/unknown-block -->Ribs<!-- /wp:core/unknown-block -->'
-					);
-
-					expect( parsed ).to.have.lengthOf( 3 );
-					expect( parsed.map( ( { name } ) => name ) ).to.eql( [
-						'core/test-block',
-						'core/unknown-block',
-						'core/unknown-block',
-					] );
-				} );
-
-				it( 'should parse the post content, including raw HTML at each end', () => {
-					registerBlockType( 'core/test-block', {} );
-					registerBlockType( 'core/unknown-block', {
-						// Currently this is the only way to test block content parsing?
-						attributes: function( rawContent ) {
-							return {
-								content: rawContent,
-							};
-						},
-					} );
-
-					setUnknownTypeHandler( 'core/unknown-block' );
-
-					const parsed = parse(
-						'<p>Cauliflower</p>' +
-						'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
-						'\n<p>Broccoli</p>\n' +
-						'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
-						'<p>Romanesco</p>'
-					);
-
-					expect( parsed ).to.have.lengthOf( 5 );
-					expect( parsed.map( ( { name } ) => name ) ).to.eql( [
-						'core/unknown-block',
-						'core/test-block',
-						'core/unknown-block',
-						'core/test-block',
-						'core/unknown-block',
-					] );
-					expect( parsed[ 0 ].attributes.content ).to.eql( '<p>Cauliflower</p>' );
-					expect( parsed[ 2 ].attributes.content ).to.eql( '<p>Broccoli</p>' );
-					expect( parsed[ 4 ].attributes.content ).to.eql( '<p>Romanesco</p>' );
-				} );
-
-				it( 'should parse blocks with empty content', () => {
-					registerBlockType( 'core/test-block', {} );
-					const parsed = parse(
-						'<!-- wp:core/test-block --><!-- /wp:core/test-block -->'
-					);
-
-					expect( parsed ).to.have.lengthOf( 1 );
-					expect( parsed.map( ( { name } ) => name ) ).to.eql( [
-						'core/test-block',
-					] );
-				} );
+		it( 'should parse the post content, including block attributes', () => {
+			registerBlockType( 'core/test-block', {
+				// Currently this is the only way to test block content parsing?
+				attributes: function( rawContent ) {
+					return {
+						content: rawContent,
+					};
+				},
+			} );
+
+			const parsed = parse(
+				'<!-- wp:core/test-block smoked="yes" url="http://google.com" chicken="ribs & \'wings\'" -->' +
+				'Brisket' +
+				'<!-- /wp:core/test-block -->'
+			);
+
+			expect( parsed ).to.have.lengthOf( 1 );
+			expect( parsed[ 0 ].name ).to.equal( 'core/test-block' );
+			expect( parsed[ 0 ].attributes ).to.eql( {
+				content: 'Brisket',
+				smoked: 'yes',
+				url: 'http://google.com',
+				chicken: 'ribs & \'wings\'',
+			} );
+			expect( parsed[ 0 ].uid ).to.be.a( 'string' );
+		} );
+
+		it( 'should parse empty post content', () => {
+			const parsed = parse( '' );
+
+			expect( parsed ).to.eql( [] );
+		} );
+
+		it( 'should parse the post content, ignoring unknown blocks', () => {
+			registerBlockType( 'core/test-block', {
+				attributes: function( rawContent ) {
+					return {
+						content: rawContent + ' & Chicken',
+					};
+				},
+			} );
+
+			const parsed = parse(
+				'<!-- wp:core/test-block -->\nRibs\n<!-- /wp:core/test-block -->' +
+				'<p>Broccoli</p>' +
+				'<!-- wp:core/unknown-block -->Ribs<!-- /wp:core/unknown-block -->'
+			);
+
+			expect( parsed ).to.have.lengthOf( 1 );
+			expect( parsed[ 0 ].name ).to.equal( 'core/test-block' );
+			expect( parsed[ 0 ].attributes ).to.eql( {
+				content: 'Ribs & Chicken',
 			} );
+			expect( parsed[ 0 ].uid ).to.be.a( 'string' );
+		} );
+
+		it( 'should parse the post content, using unknown block handler', () => {
+			registerBlockType( 'core/test-block', {} );
+			registerBlockType( 'core/unknown-block', {} );
+
+			setUnknownTypeHandler( 'core/unknown-block' );
+
+			const parsed = parse(
+				'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
+				'<p>Broccoli</p>' +
+				'<!-- wp:core/unknown-block -->Ribs<!-- /wp:core/unknown-block -->'
+			);
+
+			expect( parsed ).to.have.lengthOf( 3 );
+			expect( parsed.map( ( { name } ) => name ) ).to.eql( [
+				'core/test-block',
+				'core/unknown-block',
+				'core/unknown-block',
+			] );
+		} );
+
+		it( 'should parse the post content, including raw HTML at each end', () => {
+			registerBlockType( 'core/test-block', {} );
+			registerBlockType( 'core/unknown-block', {
+				// Currently this is the only way to test block content parsing?
+				attributes: function( rawContent ) {
+					return {
+						content: rawContent,
+					};
+				},
+			} );
+
+			setUnknownTypeHandler( 'core/unknown-block' );
+
+			const parsed = parse(
+				'<p>Cauliflower</p>' +
+				'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
+				'\n<p>Broccoli</p>\n' +
+				'<!-- wp:core/test-block -->Ribs<!-- /wp:core/test-block -->' +
+				'<p>Romanesco</p>'
+			);
+
+			expect( parsed ).to.have.lengthOf( 5 );
+			expect( parsed.map( ( { name } ) => name ) ).to.eql( [
+				'core/unknown-block',
+				'core/test-block',
+				'core/unknown-block',
+				'core/test-block',
+				'core/unknown-block',
+			] );
+			expect( parsed[ 0 ].attributes.content ).to.eql( '<p>Cauliflower</p>' );
+			expect( parsed[ 2 ].attributes.content ).to.eql( '<p>Broccoli</p>' );
+			expect( parsed[ 4 ].attributes.content ).to.eql( '<p>Romanesco</p>' );
+		} );
+
+		it( 'should parse blocks with empty content', () => {
+			registerBlockType( 'core/test-block', {} );
+			const parsed = parse(
+				'<!-- wp:core/test-block --><!-- /wp:core/test-block -->'
+			);
+
+			expect( parsed ).to.have.lengthOf( 1 );
+			expect( parsed.map( ( { name } ) => name ) ).to.eql( [
+				'core/test-block',
+			] );
 		} );
 	} );
 } );
diff --git a/bootstrap-test.js b/bootstrap-test.js
index 181dcbbf338b82..e50256f2b0b82c 100644
--- a/bootstrap-test.js
+++ b/bootstrap-test.js
@@ -31,6 +31,7 @@ global.window.tinyMCEPreInit = {
 	// <script> tag where it was loaded from, which of course fails here.
 	baseURL: 'about:blank',
 };
+
 global.window._wpDateSettings = {
 	formats: {
 		date: 'j F Y',
diff --git a/webpack.config.js b/webpack.config.js
index abf87b7f2b821e..c20462f582084c 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -138,9 +138,6 @@ switch ( process.env.NODE_ENV ) {
 			filename: 'build/test.js',
 			path: __dirname,
 		};
-		config.plugins.push( new webpack.ProvidePlugin( {
-			tinymce: 'tinymce/tinymce',
-		} ) );
 		break;
 
 	default:

From 52d497a1d99d8198be4c103b48595e8ac6be23b3 Mon Sep 17 00:00:00 2001
From: James Nylen <jnylen@gmail.com>
Date: Mon, 12 Jun 2017 17:46:23 -0400
Subject: [PATCH 2/4] Fix lint errors

---
 blocks/api/parser.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/blocks/api/parser.js b/blocks/api/parser.js
index 47a7269f93ce81..a1db4f516535b8 100644
--- a/blocks/api/parser.js
+++ b/blocks/api/parser.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { parse as hpqParse } from 'hpq';
-import { escape, unescape, pickBy } from 'lodash';
+import { pickBy } from 'lodash';
 
 /**
  * Internal dependencies

From 65dafee0dc7a25ec6befbd58cb71f1f74036a423 Mon Sep 17 00:00:00 2001
From: James Nylen <jnylen@gmail.com>
Date: Mon, 12 Jun 2017 17:49:16 -0400
Subject: [PATCH 3/4] Try removing TinyMCE initialization hacks

---
 bootstrap-test.js | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/bootstrap-test.js b/bootstrap-test.js
index e50256f2b0b82c..a8bdea914e149c 100644
--- a/bootstrap-test.js
+++ b/bootstrap-test.js
@@ -24,14 +24,6 @@ global.document = dom.window.document;
 global.navigator = dom.window.navigator;
 global.requestAnimationFrame = window.setTimeout;
 
-// These are necessary to load TinyMCE successfully
-global.URL = window.URL;
-global.window.tinyMCEPreInit = {
-	// Without this, TinyMCE tries to determine its URL by looking at the
-	// <script> tag where it was loaded from, which of course fails here.
-	baseURL: 'about:blank',
-};
-
 global.window._wpDateSettings = {
 	formats: {
 		date: 'j F Y',

From b7153c2e19e0f814eb73eb816059c84264009ed2 Mon Sep 17 00:00:00 2001
From: James Nylen <jnylen@gmail.com>
Date: Mon, 12 Jun 2017 17:49:27 -0400
Subject: [PATCH 4/4] Revert "Try removing TinyMCE initialization hacks"

This reverts commit 65dafee0dc7a25ec6befbd58cb71f1f74036a423.

This is still required by `blocks/editable/tinymce.js`.
---
 bootstrap-test.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/bootstrap-test.js b/bootstrap-test.js
index a8bdea914e149c..e50256f2b0b82c 100644
--- a/bootstrap-test.js
+++ b/bootstrap-test.js
@@ -24,6 +24,14 @@ global.document = dom.window.document;
 global.navigator = dom.window.navigator;
 global.requestAnimationFrame = window.setTimeout;
 
+// These are necessary to load TinyMCE successfully
+global.URL = window.URL;
+global.window.tinyMCEPreInit = {
+	// Without this, TinyMCE tries to determine its URL by looking at the
+	// <script> tag where it was loaded from, which of course fails here.
+	baseURL: 'about:blank',
+};
+
 global.window._wpDateSettings = {
 	formats: {
 		date: 'j F Y',