From 04532b49d351076ac0c84a599aee16c10f106f3c Mon Sep 17 00:00:00 2001
From: Riad Benguella <benguella@gmail.com>
Date: Fri, 16 Feb 2018 14:10:43 +0100
Subject: [PATCH 1/2] Quote Block: Fixing focus transfer between citation and
 content

---
 blocks/library/pullquote/editor.scss | 4 ++++
 blocks/library/quote/editor.scss     | 4 ++++
 blocks/library/quote/index.js        | 4 +++-
 blocks/rich-text/index.js            | 4 +++-
 4 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/blocks/library/pullquote/editor.scss b/blocks/library/pullquote/editor.scss
index 8ebe0a7286aee5..5494e74d2a2cc3 100644
--- a/blocks/library/pullquote/editor.scss
+++ b/blocks/library/pullquote/editor.scss
@@ -11,6 +11,10 @@
 }
 
 .wp-block-pullquote {
+	cite {
+		display: block;
+	}
+
 	cite .blocks-rich-text__tinymce[data-is-empty="true"]:before {
 		font-size: 14px;
 		font-family: $default-font;
diff --git a/blocks/library/quote/editor.scss b/blocks/library/quote/editor.scss
index de83bc5f7f0fe0..e36feff5126ac9 100644
--- a/blocks/library/quote/editor.scss
+++ b/blocks/library/quote/editor.scss
@@ -1,5 +1,9 @@
 .wp-block-quote {
 	margin: 0;
+
+	cite {
+		display: block;
+	}
 }
 
 .wp-block-quote:not(.is-large) {
diff --git a/blocks/library/quote/index.js b/blocks/library/quote/index.js
index de4119dd887679..7e069be11fbffa 100644
--- a/blocks/library/quote/index.js
+++ b/blocks/library/quote/index.js
@@ -158,7 +158,9 @@ export const settings = {
 	} )( ( { attributes, setAttributes, isSelected, mergeBlocks, onReplace, className, editable, setState } ) => {
 		const { align, value, citation, style } = attributes;
 		const containerClassname = classnames( className, style === 2 ? 'is-large' : '' );
-		const onSetActiveEditable = ( newEditable ) => () => setState( { editable: newEditable } );
+		const onSetActiveEditable = ( newEditable ) => () => {
+			setState( { editable: newEditable } );
+		};
 
 		return [
 			isSelected && (
diff --git a/blocks/rich-text/index.js b/blocks/rich-text/index.js
index 8a94d86794e8b9..6fabfd30220c6b 100644
--- a/blocks/rich-text/index.js
+++ b/blocks/rich-text/index.js
@@ -740,7 +740,9 @@ export class RichText extends Component {
 			!! this.editor &&
 			this.props.tagName === prevProps.tagName &&
 			this.props.value !== prevProps.value &&
-			this.props.value !== this.savedContent
+			this.props.value !== this.savedContent &&
+			! isEqual( this.props.value, prevProps.value ) &&
+			! isEqual( this.props.value, this.savedContent )
 		) {
 			this.updateContent();
 		}

From 9360dc87732d1f3f1f58d56629810936f926916e Mon Sep 17 00:00:00 2001
From: Riad Benguella <benguella@gmail.com>
Date: Fri, 16 Feb 2018 16:38:04 +0100
Subject: [PATCH 2/2] Update RichText's content before calling onSplit

---
 blocks/rich-text/index.js | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/blocks/rich-text/index.js b/blocks/rich-text/index.js
index 6fabfd30220c6b..43aa1af1d8c554 100644
--- a/blocks/rich-text/index.js
+++ b/blocks/rich-text/index.js
@@ -579,7 +579,7 @@ export class RichText extends Component {
 				const beforeElement = nodeListToReact( beforeNodes, createTinyMCEElement );
 				const afterElement = nodeListToReact( afterNodes, createTinyMCEElement );
 
-				this.props.onSplit( beforeElement, afterElement );
+				this.restoreContentAndSplit( beforeElement, afterElement );
 			} else {
 				event.preventDefault();
 				this.onCreateUndoLevel();
@@ -638,9 +638,10 @@ export class RichText extends Component {
 
 			const beforeElement = nodeListToReact( beforeFragment.childNodes, createTinyMCEElement );
 			const afterElement = nodeListToReact( filterEmptyNodes( afterFragment.childNodes ), createTinyMCEElement );
-			this.props.onSplit( beforeElement, afterElement, ...blocks );
+
+			this.restoreContentAndSplit( beforeElement, afterElement, blocks );
 		} else {
-			this.props.onSplit( [], [], ...blocks );
+			this.restoreContentAndSplit( [], [], blocks );
 		}
 	}
 
@@ -686,7 +687,7 @@ export class RichText extends Component {
 		// Splitting into two blocks
 		this.setContent( this.props.value );
 
-		this.props.onSplit(
+		this.restoreContentAndSplit(
 			nodeListToReact( before, createTinyMCEElement ),
 			nodeListToReact( after, createTinyMCEElement )
 		);
@@ -798,6 +799,19 @@ export class RichText extends Component {
 		} ) );
 	}
 
+	/**
+	 * Calling onSplit means we need to abort the change done by TinyMCE.
+	 * we need to call updateContent to restore the initial content before calling onSplit.
+	 *
+	 * @param {Array}  before content before the split position
+	 * @param {Array}  after  content after the split position
+	 * @param {?Array} blocks blocks to insert at the split position
+	 */
+	restoreContentAndSplit( before, after, blocks ) {
+		this.updateContent();
+		this.props.onSplit( before, after, ...blocks );
+	}
+
 	render() {
 		const {
 			tagName: Tagname = 'div',