From 2c568f442d22399a1706bd096d4d386016037c4f Mon Sep 17 00:00:00 2001 From: Danilo Ercoli Date: Wed, 6 Feb 2019 17:15:51 +0100 Subject: [PATCH 1/3] Make placeholder text working again on RichText --- packages/editor/src/components/rich-text/index.native.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/editor/src/components/rich-text/index.native.js b/packages/editor/src/components/rich-text/index.native.js index 67d2a86b38957..0aae150bfa79b 100644 --- a/packages/editor/src/components/rich-text/index.native.js +++ b/packages/editor/src/components/rich-text/index.native.js @@ -360,7 +360,8 @@ export class RichText extends Component { } ) ); // Save back to HTML from React tree - const html = '<' + tagName + '>' + value + ''; + // We need to check if the value is undefined or empty, and then assign it properly otherwise the placeholder is not visible + const html = this.props.placeholder && ( value === undefined || value === '' ) ? '' : '<' + tagName + '>' + value + ''; return ( @@ -373,6 +374,7 @@ export class RichText extends Component { } } text={ { text: html, eventCount: this.lastEventCount } } + placeholder={ this.props.placeholder } onChange={ this.onChange } onFocus={ this.props.onFocus } onBlur={ this.props.onBlur } From 71089ff1c863d508924f8dfaf6ac68b2d8f410ec Mon Sep 17 00:00:00 2001 From: Danilo Ercoli Date: Wed, 6 Feb 2019 18:04:56 +0100 Subject: [PATCH 2/3] Make sure the native side is always refreshed when the RichText component is cleared --- packages/editor/src/components/rich-text/index.native.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/editor/src/components/rich-text/index.native.js b/packages/editor/src/components/rich-text/index.native.js index 0aae150bfa79b..7df22514a13b9 100644 --- a/packages/editor/src/components/rich-text/index.native.js +++ b/packages/editor/src/components/rich-text/index.native.js @@ -360,8 +360,12 @@ export class RichText extends Component { } ) ); // Save back to HTML from React tree + let html = '<' + tagName + '>' + value + ''; // We need to check if the value is undefined or empty, and then assign it properly otherwise the placeholder is not visible - const html = this.props.placeholder && ( value === undefined || value === '' ) ? '' : '<' + tagName + '>' + value + ''; + if ( this.props.placeholder && ( value === undefined || value === '' ) ) { + html = ''; + this.lastEventCount = undefined; // force a refresh on the native side + } return ( From 792fc94ce8f5384c60571c2eaf451e9b6fe52b7c Mon Sep 17 00:00:00 2001 From: Danilo Ercoli Date: Thu, 7 Feb 2019 11:03:23 +0100 Subject: [PATCH 3/3] Remove placeholder check --- packages/editor/src/components/rich-text/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/editor/src/components/rich-text/index.native.js b/packages/editor/src/components/rich-text/index.native.js index 7df22514a13b9..8a7ce63178eaf 100644 --- a/packages/editor/src/components/rich-text/index.native.js +++ b/packages/editor/src/components/rich-text/index.native.js @@ -362,7 +362,7 @@ export class RichText extends Component { // Save back to HTML from React tree let html = '<' + tagName + '>' + value + ''; // We need to check if the value is undefined or empty, and then assign it properly otherwise the placeholder is not visible - if ( this.props.placeholder && ( value === undefined || value === '' ) ) { + if ( value === undefined || value === '' ) { html = ''; this.lastEventCount = undefined; // force a refresh on the native side }