Build in own padding and boundary classes

packages/block-library/src/button/test/__snapshots__/index.js.snap

@@ -24,7 +24,7 @@ exports[`core/button block edit matches snapshot 1`] = `
               role="textbox"
             >
               <br
-                data-mce-bogus="1"
+                data-rich-text-padding="true"
               />
             </div>
             <div

packages/block-library/src/heading/test/__snapshots__/index.js.snap

@@ -19,7 +19,7 @@ exports[`core/heading block edit matches snapshot 1`] = `
           role="textbox"
         >
           <br
-            data-mce-bogus="1"
+            data-rich-text-padding="true"
           />
         </h2>
         <h2

packages/block-library/src/list/test/__snapshots__/index.js.snap

@@ -20,7 +20,7 @@ exports[`core/list block edit matches snapshot 1`] = `
         >
           <li>
             <br
-              data-mce-bogus="1"
+              data-rich-text-padding="true"
             />
           </li>
         </ul>

packages/block-library/src/paragraph/test/__snapshots__/index.js.snap

@@ -21,7 +21,7 @@ exports[`core/paragraph block edit matches snapshot 1`] = `
             role="textbox"
           >
             <br
-              data-mce-bogus="1"
+              data-rich-text-padding="true"
             />
           </p>
           <p

packages/block-library/src/preformatted/test/__snapshots__/index.js.snap

@@ -19,7 +19,7 @@ exports[`core/preformatted block edit matches snapshot 1`] = `
           role="textbox"
         >
           <br
-            data-mce-bogus="1"
+            data-rich-text-padding="true"
           />
         </pre>
         <pre

packages/block-library/src/pullquote/test/__snapshots__/index.js.snap

@@ -24,7 +24,7 @@ exports[`core/pullquote block edit matches snapshot 1`] = `
             >
               <p>
                 <br
-                  data-mce-bogus="1"
+                  data-rich-text-padding="true"
                 />
               </p>
             </div>

packages/block-library/src/quote/test/__snapshots__/index.js.snap

@@ -23,7 +23,7 @@ exports[`core/quote block edit matches snapshot 1`] = `
           >
             <p>
               <br
-                data-mce-bogus="1"
+                data-rich-text-padding="true"
               />
             </p>
           </div>

packages/block-library/src/text-columns/test/__snapshots__/index.js.snap

@@ -25,7 +25,7 @@ exports[`core/text-columns block edit matches snapshot 1`] = `
               role="textbox"
             >
               <br
-                data-mce-bogus="1"
+                data-rich-text-padding="true"
               />
             </p>
             <p
@@ -59,7 +59,7 @@ exports[`core/text-columns block edit matches snapshot 1`] = `
               role="textbox"
             >
               <br
-                data-mce-bogus="1"
+                data-rich-text-padding="true"
               />
             </p>
             <p

packages/block-library/src/verse/test/__snapshots__/index.js.snap

@@ -19,7 +19,7 @@ exports[`core/verse block edit matches snapshot 1`] = `
           role="textbox"
         >
           <br
-            data-mce-bogus="1"
+            data-rich-text-padding="true"
           />
         </pre>
         <pre

packages/editor/src/components/rich-text/index.js

@@ -162,9 +162,6 @@ export class RichText extends Component {
 			range,
 			multilineTag: this.multilineTag,
 			multilineWrapperTags: this.multilineWrapperTags,
-			removeNode: ( node ) => node.getAttribute( 'data-mce-bogus' ) === 'all',
-			unwrapNode: ( node ) => !! node.getAttribute( 'data-mce-bogus' ),
-			removeAttribute: ( attribute ) => attribute.indexOf( 'data-mce-' ) === 0,
 			prepareEditableTree: this.props.prepareEditableTree,
 		} );
 	}
@@ -175,11 +172,6 @@ export class RichText extends Component {
 			current: this.editableRef,
 			multilineTag: this.multilineTag,
 			multilineWrapperTags: this.multilineWrapperTags,
-			createLinePadding( doc ) {
-				const element = doc.createElement( 'br' );
-				element.setAttribute( 'data-mce-bogus', '1' );
-				return element;
-			},
 			prepareEditableTree: this.props.prepareEditableTree,
 		} );
 	}
@@ -740,11 +732,6 @@ export class RichText extends Component {
 			value,
 			multilineTag: this.multilineTag,
 			multilineWrapperTags: this.multilineWrapperTags,
-			createLinePadding( doc ) {
-				const element = doc.createElement( 'br' );
-				element.setAttribute( 'data-mce-bogus', '1' );
-				return element;
-			},
 			prepareEditableTree: this.props.prepareEditableTree,
 		} ).body.innerHTML;
 	}

packages/rich-text/src/create.js

@@ -99,12 +99,6 @@ function toFormat( { type, attributes } ) {
  *                                            multiline.
  * @param {?Array}    $1.multilineWrapperTags Tags where lines can be found if
  *                                            nesting is possible.
- * @param {?Function} $1.removeNode           Function to declare whether the
- *                                            given node should be removed.
- * @param {?Function} $1.unwrapNode           Function to declare whether the
- *                                            given node should be unwrapped.
- * @param {?Function} $1.removeAttribute      Wether to remove an attribute
- *                                            based on the name.
  *
  * @return {Object} A rich text value.
  */
@@ -115,9 +109,6 @@ export function create( {
 	range,
 	multilineTag,
 	multilineWrapperTags,
-	removeNode,
-	unwrapNode,
-	removeAttribute,
 } = {} ) {
 	if ( typeof text === 'string' && text.length > 0 ) {
 		return {
@@ -138,9 +129,6 @@ export function create( {
 		return createFromElement( {
 			element,
 			range,
-			removeNode,
-			unwrapNode,
-			removeAttribute,
 		} );
 	}
 
@@ -149,9 +137,6 @@ export function create( {
 		range,
 		multilineTag,
 		multilineWrapperTags,
-		removeNode,
-		unwrapNode,
-		removeAttribute,
 	} );
 }
 
@@ -267,12 +252,6 @@ function filterString( string ) {
  *                                            multiline.
  * @param {?Array}    $1.multilineWrapperTags Tags where lines can be found if
  *                                            nesting is possible.
- * @param {?Function} $1.removeNode           Function to declare whether the
- *                                            given node should be removed.
- * @param {?Function} $1.unwrapNode           Function to declare whether the
- *                                            given node should be unwrapped.
- * @param {?Function} $1.removeAttribute      Wether to remove an attribute
- *                                            based on the name.
  *
  * @return {Object} A rich text value.
  */
@@ -282,9 +261,6 @@ function createFromElement( {
 	multilineTag,
 	multilineWrapperTags,
 	currentWrapperTags = [],
-	removeNode,
-	unwrapNode,
-	removeAttribute,
 } ) {
 	const accumulator = createEmptyValue();
 
@@ -319,10 +295,7 @@ function createFromElement( {
 			continue;
 		}
 
-		if (
-			( removeNode && removeNode( node ) ) ||
-			( unwrapNode && unwrapNode( node ) && ! node.hasChildNodes() )
-		) {
+		if ( node.getAttribute( 'data-rich-text-padding' ) ) {
 			accumulateSelection( accumulator, node, range, createEmptyValue() );
 			continue;
 		}
@@ -336,37 +309,30 @@ function createFromElement( {
 
 		const lastFormats = accumulator.formats[ accumulator.formats.length - 1 ];
 		const lastFormat = lastFormats && lastFormats[ lastFormats.length - 1 ];
-		let format;
-		let value;
+		const newFormat = toFormat( {
+			type,
+			attributes: getAttributes( { element: node } ),
+		} );
 
-		if ( ! unwrapNode || ! unwrapNode( node ) ) {
-			const newFormat = toFormat( {
-				type,
-				attributes: getAttributes( {
-					element: node,
-					removeAttribute,
-				} ),
-			} );
+		let format;
 
-			if ( newFormat ) {
-				// Reuse the last format if it's equal.
-				if ( isFormatEqual( newFormat, lastFormat ) ) {
-					format = lastFormat;
-				} else {
-					format = newFormat;
-				}
+		if ( newFormat ) {
+			// Reuse the last format if it's equal.
+			if ( isFormatEqual( newFormat, lastFormat ) ) {
+				format = lastFormat;
+			} else {
+				format = newFormat;
 			}
 		}
 
+		let value;
+
 		if ( multilineWrapperTags && multilineWrapperTags.indexOf( type ) !== -1 ) {
 			value = createFromMultilineElement( {
 				element: node,
 				range,
 				multilineTag,
 				multilineWrapperTags,
-				removeNode,
-				unwrapNode,
-				removeAttribute,
 				currentWrapperTags: [ ...currentWrapperTags, format ],
 			} );
 			format = undefined;
@@ -376,9 +342,6 @@ function createFromElement( {
 				range,
 				multilineTag,
 				multilineWrapperTags,
-				removeNode,
-				unwrapNode,
-				removeAttribute,
 			} );
 		}
 
@@ -446,12 +409,6 @@ function createFromElement( {
  *                                            multiline.
  * @param {?Array}    $1.multilineWrapperTags Tags where lines can be found if
  *                                            nesting is possible.
- * @param {?Function} $1.removeNode           Function to declare whether the
- *                                            given node should be removed.
- * @param {?Function} $1.unwrapNode           Function to declare whether the
- *                                            given node should be unwrapped.
- * @param {?Function} $1.removeAttribute      Wether to remove an attribute
- *                                            based on the name.
  * @param {boolean}   $1.currentWrapperTags   Whether to prepend a line
  *                                            separator.
  *
@@ -462,9 +419,6 @@ function createFromMultilineElement( {
 	range,
 	multilineTag,
 	multilineWrapperTags,
-	removeNode,
-	unwrapNode,
-	removeAttribute,
 	currentWrapperTags = [],
 } ) {
 	const accumulator = createEmptyValue();
@@ -489,9 +443,6 @@ function createFromMultilineElement( {
 			multilineTag,
 			multilineWrapperTags,
 			currentWrapperTags,
-			removeNode,
-			unwrapNode,
-			removeAttribute,
 		} );
 
 		// If a line consists of one single line break (invisible), consider the
@@ -532,16 +483,11 @@ function createFromMultilineElement( {
  *
  * @param {Object}    $1                 Named argements.
  * @param {Element}   $1.element         Element to get attributes from.
- * @param {?Function} $1.removeAttribute Wether to remove an attribute based on
- *                                       the name.
  *
  * @return {?Object} Attribute object or `undefined` if the element has no
  *                   attributes.
  */
-function getAttributes( {
-	element,
-	removeAttribute,
-} ) {
+function getAttributes( { element } ) {
 	if ( ! element.hasAttributes() ) {
 		return;
 	}
@@ -553,7 +499,7 @@ function getAttributes( {
 	for ( let i = 0; i < length; i++ ) {
 		const { name, value } = element.attributes[ i ];
 
-		if ( removeAttribute && removeAttribute( name ) ) {
+		if ( name === 'data-rich-text-format-boundary' ) {
 			continue;
 		}