From 3d8a3c4acb162d0482fb509421b46dd4ce69baea Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Thu, 26 Mar 2020 16:49:38 +1300 Subject: [PATCH 1/8] Add fix to make inputs of type email return true from isTextField to all native paste to handle pasting in email inputs --- packages/dom/src/dom.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index e16cd41e709661..47f6fcd6524121 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -453,6 +453,7 @@ export function isTextField( element ) { return ( ( nodeName === 'INPUT' && selectionStart !== null ) || + element.getAttribute( 'type' ) === 'email' || nodeName === 'TEXTAREA' || contentEditable === 'true' ); From 94790afccdde9ac8c4bdd0c56079c8a30a07fd6d Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Sat, 28 Mar 2020 11:14:23 +1300 Subject: [PATCH 2/8] Limit to just input nodes with attribute type=email --- packages/dom/src/dom.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index 47f6fcd6524121..f30abcc6af14ad 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -453,7 +453,7 @@ export function isTextField( element ) { return ( ( nodeName === 'INPUT' && selectionStart !== null ) || - element.getAttribute( 'type' ) === 'email' || + ( nodeName === 'INPUT' && element.getAttribute( 'type' ) === 'email' ) || nodeName === 'TEXTAREA' || contentEditable === 'true' ); From 9fd8082e2e827c5b9ef33e86dd4d4fcad1070599 Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Wed, 1 Jul 2020 14:27:14 +1200 Subject: [PATCH 3/8] switch to explicitly identifying all input types that could be seen as text --- packages/dom/src/dom.js | 36 ++++++++++++++++-------------------- 1 file changed, 16 insertions(+), 20 deletions(-) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index f30abcc6af14ad..22ecc0d9c6adcb 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -448,26 +448,22 @@ export function placeCaretAtVerticalEdge( * @return {boolean} True if the element is an text field, false if not. */ export function isTextField( element ) { - try { - const { nodeName, selectionStart, contentEditable } = element; - - return ( - ( nodeName === 'INPUT' && selectionStart !== null ) || - ( nodeName === 'INPUT' && element.getAttribute( 'type' ) === 'email' ) || - nodeName === 'TEXTAREA' || - contentEditable === 'true' - ); - } catch ( error ) { - // Safari throws an exception when trying to get `selectionStart` - // on non-text elements (which, understandably, don't - // have the text selection API). We catch this via a try/catch - // block, as opposed to a more explicit check of the element's - // input types, because of Safari's non-standard behavior. This - // also means we don't have to worry about the list of input - // types that support `selectionStart` changing as the HTML spec - // evolves over time. - return false; - } + const { nodeName, contentEditable } = element; + const textInputs = [ + 'text', + 'email', + 'number', + 'password', + 'search', + 'url', + 'tel', + ]; + return ( + ( nodeName === 'INPUT' && + textInputs.includes( element.getAttribute( 'type' ) ) ) || + nodeName === 'TEXTAREA' || + contentEditable === 'true' + ); } /** From 11565459568387405274ee7f1cefdc418ee43162 Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Thu, 2 Jul 2020 10:02:54 +1200 Subject: [PATCH 4/8] Switch to checking for non text input --- packages/dom/src/dom.js | 20 +++++++++++--------- 1 file changed, 11 insertions(+), 9 deletions(-) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index 22ecc0d9c6adcb..72f2b9d324e9b9 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -449,18 +449,20 @@ export function placeCaretAtVerticalEdge( */ export function isTextField( element ) { const { nodeName, contentEditable } = element; - const textInputs = [ - 'text', - 'email', - 'number', - 'password', - 'search', - 'url', - 'tel', + const nonTextInputs = [ + 'button', + 'checkbox', + 'hidden', + 'file', + 'radio', + 'image', + 'range', + 'reset', + 'submit', ]; return ( ( nodeName === 'INPUT' && - textInputs.includes( element.getAttribute( 'type' ) ) ) || + ! nonTextInputs.includes( element.getAttribute( 'type' ) ) ) || nodeName === 'TEXTAREA' || contentEditable === 'true' ); From 2c541a7977be0f309f05621ed005ec5b91866a6d Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Thu, 2 Jul 2020 10:18:00 +1200 Subject: [PATCH 5/8] Update test --- packages/dom/src/test/dom.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/dom/src/test/dom.js b/packages/dom/src/test/dom.js index eabb2ed968bd1a..42dc2ae36912e9 100644 --- a/packages/dom/src/test/dom.js +++ b/packages/dom/src/test/dom.js @@ -107,9 +107,12 @@ describe( 'DOM', () => { const NON_TEXT_INPUT_TYPES = [ 'button', 'checkbox', - 'image', 'hidden', + 'file', 'radio', + 'image', + 'range', + 'reset', 'submit', ]; @@ -118,7 +121,13 @@ describe( 'DOM', () => { * * @type {string[]} */ - const TEXT_INPUT_TYPES = [ 'text', 'password', 'search', 'url' ]; + const TEXT_INPUT_TYPES = [ + 'text', + 'password', + 'search', + 'url', + 'email', + ]; it( 'should return false for non-text input elements', () => { NON_TEXT_INPUT_TYPES.forEach( ( type ) => { From 93495f3561c0b23c4aa8aa858e78b22d3b02a598 Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Mon, 6 Jul 2020 08:09:44 +1200 Subject: [PATCH 6/8] Switch to direct 'type' call MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ella van Durpe --- packages/dom/src/dom.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index 72f2b9d324e9b9..c4c0039dac11a9 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -462,7 +462,7 @@ export function isTextField( element ) { ]; return ( ( nodeName === 'INPUT' && - ! nonTextInputs.includes( element.getAttribute( 'type' ) ) ) || + ! nonTextInputs.includes( element.type ) ) || nodeName === 'TEXTAREA' || contentEditable === 'true' ); From 6928c45be65849231cc891c83d72ab01e6a80241 Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Tue, 7 Jul 2020 09:33:30 +1200 Subject: [PATCH 7/8] Fix linting error --- packages/dom/src/dom.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index c4c0039dac11a9..7ef3537904b64e 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -461,8 +461,7 @@ export function isTextField( element ) { 'submit', ]; return ( - ( nodeName === 'INPUT' && - ! nonTextInputs.includes( element.type ) ) || + ( nodeName === 'INPUT' && ! nonTextInputs.includes( element.type ) ) || nodeName === 'TEXTAREA' || contentEditable === 'true' ); From 43e796e422e16e31b30081cd28145a17d8464c2a Mon Sep 17 00:00:00 2001 From: Glen Davies Date: Tue, 7 Jul 2020 13:53:26 +1200 Subject: [PATCH 8/8] Add number to the non-text field list --- packages/dom/src/dom.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/dom/src/dom.js b/packages/dom/src/dom.js index 7ef3537904b64e..0a9b51d8b4f0ef 100644 --- a/packages/dom/src/dom.js +++ b/packages/dom/src/dom.js @@ -459,6 +459,7 @@ export function isTextField( element ) { 'range', 'reset', 'submit', + 'number', ]; return ( ( nodeName === 'INPUT' && ! nonTextInputs.includes( element.type ) ) ||