From ce4e4db1b07a37bf98ff4b1aae9453fce6656573 Mon Sep 17 00:00:00 2001 From: iseulde Date: Mon, 18 Feb 2019 10:26:14 +0100 Subject: [PATCH 1/3] RichText: only ignore input types that insert HTML --- .../editor/src/components/rich-text/index.js | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index 8029dfa0a640d4..53810b0a8d3829 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -69,6 +69,21 @@ import { RemoveBrowserShortcuts } from './remove-browser-shortcuts'; const { getSelection } = window; +/** + * All inserting input types that would insert HTML into the DOM. + * + * @see https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes + * + * @type {Array} + */ +const INSERTION_INPUT_TYPES_TO_IGNORE = [ + 'insertParagraph', + 'insertOrderedList', + 'insertUnorderedList', + 'insertHorizontalRule', + 'insertLink', +]; + export class RichText extends Component { constructor( { value, onReplace, multiline } ) { super( ...arguments ); @@ -354,12 +369,12 @@ export class RichText extends Component { if ( event ) { const { inputType } = event.nativeEvent; - // The browser formatted something or tried to insert a list. + // The browser formatted something or tried to insert HTML. // Overwrite it. It will be handled later by the format library if // needed. if ( inputType.indexOf( 'format' ) === 0 || - ( inputType.indexOf( 'insert' ) === 0 && inputType !== 'insertText' ) + INSERTION_INPUT_TYPES_TO_IGNORE.indexOf( inputType ) !== -1 ) { this.applyRecord( this.getRecord() ); return; From 1342e06fe52c604d9646c567cf31013c92434934 Mon Sep 17 00:00:00 2001 From: iseulde Date: Mon, 18 Feb 2019 10:37:44 +0100 Subject: [PATCH 2/3] Mark RichTextInputEvent as unstable --- packages/editor/src/components/index.js | 2 +- packages/editor/src/components/rich-text/index.js | 2 +- packages/editor/src/components/rich-text/input-event.js | 2 +- packages/format-library/src/bold/index.js | 4 ++-- packages/format-library/src/italic/index.js | 4 ++-- packages/format-library/src/underline/index.js | 4 ++-- 6 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/editor/src/components/index.js b/packages/editor/src/components/index.js index 40ce2cc74d5599..94cadfc7ddc243 100644 --- a/packages/editor/src/components/index.js +++ b/packages/editor/src/components/index.js @@ -23,7 +23,7 @@ export { RichTextShortcut, RichTextToolbarButton, RichTextInserterItem, - RichTextInputEvent, + UnstableRichTextInputEvent, } from './rich-text'; export { default as ServerSideRender } from './server-side-render'; export { default as MediaPlaceholder } from './media-placeholder'; diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index 53810b0a8d3829..f9032409ef6672 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -1165,4 +1165,4 @@ export default RichTextContainer; export { RichTextShortcut } from './shortcut'; export { RichTextToolbarButton } from './toolbar-button'; export { RichTextInserterItem } from './inserter-list-item'; -export { RichTextInputEvent } from './input-event'; +export { UnstableRichTextInputEvent } from './input-event'; diff --git a/packages/editor/src/components/rich-text/input-event.js b/packages/editor/src/components/rich-text/input-event.js index 3f7e19d45b75d1..e77a57cb898e76 100644 --- a/packages/editor/src/components/rich-text/input-event.js +++ b/packages/editor/src/components/rich-text/input-event.js @@ -3,7 +3,7 @@ */ import { Component } from '@wordpress/element'; -export class RichTextInputEvent extends Component { +export class UnstableRichTextInputEvent extends Component { constructor() { super( ...arguments ); diff --git a/packages/format-library/src/bold/index.js b/packages/format-library/src/bold/index.js index 910c59a2085e26..15c64261fbfded 100644 --- a/packages/format-library/src/bold/index.js +++ b/packages/format-library/src/bold/index.js @@ -4,7 +4,7 @@ import { __ } from '@wordpress/i18n'; import { Fragment } from '@wordpress/element'; import { toggleFormat } from '@wordpress/rich-text'; -import { RichTextToolbarButton, RichTextShortcut, RichTextInputEvent } from '@wordpress/editor'; +import { RichTextToolbarButton, RichTextShortcut, UnstableRichTextInputEvent } from '@wordpress/editor'; const name = 'core/bold'; @@ -32,7 +32,7 @@ export const bold = { shortcutType="primary" shortcutCharacter="b" /> - diff --git a/packages/format-library/src/italic/index.js b/packages/format-library/src/italic/index.js index 30bf72acd5778c..1acadaf6f48267 100644 --- a/packages/format-library/src/italic/index.js +++ b/packages/format-library/src/italic/index.js @@ -4,7 +4,7 @@ import { __ } from '@wordpress/i18n'; import { Fragment } from '@wordpress/element'; import { toggleFormat } from '@wordpress/rich-text'; -import { RichTextToolbarButton, RichTextShortcut, RichTextInputEvent } from '@wordpress/editor'; +import { RichTextToolbarButton, RichTextShortcut, UnstableRichTextInputEvent } from '@wordpress/editor'; const name = 'core/italic'; @@ -32,7 +32,7 @@ export const italic = { shortcutType="primary" shortcutCharacter="i" /> - diff --git a/packages/format-library/src/underline/index.js b/packages/format-library/src/underline/index.js index bab50a0452eb45..0777e83e1f7178 100644 --- a/packages/format-library/src/underline/index.js +++ b/packages/format-library/src/underline/index.js @@ -4,7 +4,7 @@ import { __ } from '@wordpress/i18n'; import { Fragment } from '@wordpress/element'; import { toggleFormat } from '@wordpress/rich-text'; -import { RichTextShortcut, RichTextInputEvent } from '@wordpress/editor'; +import { RichTextShortcut, UnstableRichTextInputEvent } from '@wordpress/editor'; const name = 'core/underline'; @@ -34,7 +34,7 @@ export const underline = { character="u" onUse={ onToggle } /> - From 5406c584d0269b598d40a5fde7f6bd88de7146fe Mon Sep 17 00:00:00 2001 From: iseulde Date: Tue, 19 Feb 2019 10:21:26 +0100 Subject: [PATCH 3/3] Use Set --- packages/editor/src/components/rich-text/index.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index f9032409ef6672..1d6c353448d9ef 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -74,15 +74,15 @@ const { getSelection } = window; * * @see https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes * - * @type {Array} + * @type {Set} */ -const INSERTION_INPUT_TYPES_TO_IGNORE = [ +const INSERTION_INPUT_TYPES_TO_IGNORE = new Set( [ 'insertParagraph', 'insertOrderedList', 'insertUnorderedList', 'insertHorizontalRule', 'insertLink', -]; +] ); export class RichText extends Component { constructor( { value, onReplace, multiline } ) { @@ -374,7 +374,7 @@ export class RichText extends Component { // needed. if ( inputType.indexOf( 'format' ) === 0 || - INSERTION_INPUT_TYPES_TO_IGNORE.indexOf( inputType ) !== -1 + INSERTION_INPUT_TYPES_TO_IGNORE.has( inputType ) ) { this.applyRecord( this.getRecord() ); return;