From 2bb69328ae4e8284a8fce4074dc2301c28b667b7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tomasz=20Ko=C5=82odziejski?= Date: Fri, 29 May 2015 17:13:49 +0200 Subject: [PATCH] Always toLowerCase when comparing nodeName or tagName In xml node name casing is exactly the same as the node was originally named. Make sure to convert node and tag names to lower case before making any node and tag name checks. Fixes #3960. --- src/renderers/dom/client/ReactInputSelection.js | 13 ++++++++----- src/renderers/dom/client/ReactMount.js | 2 +- .../dom/client/eventPlugins/ChangeEventPlugin.js | 7 ++++--- src/shared/utils/isTextInputElement.js | 7 ++++--- 4 files changed, 17 insertions(+), 12 deletions(-) diff --git a/src/renderers/dom/client/ReactInputSelection.js b/src/renderers/dom/client/ReactInputSelection.js index dcf8425197..c625e57f25 100644 --- a/src/renderers/dom/client/ReactInputSelection.js +++ b/src/renderers/dom/client/ReactInputSelection.js @@ -30,9 +30,10 @@ function isInDocument(node) { var ReactInputSelection = { hasSelectionCapabilities: function(elem) { - return elem && ( - (elem.nodeName === 'INPUT' && elem.type === 'text') || - elem.nodeName === 'TEXTAREA' || + var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); + return nodeName && ( + (nodeName === 'input' && elem.type === 'text') || + nodeName === 'textarea' || elem.contentEditable === 'true' ); }, @@ -84,7 +85,8 @@ var ReactInputSelection = { start: input.selectionStart, end: input.selectionEnd }; - } else if (document.selection && input.nodeName === 'INPUT') { + } else if (document.selection && + (input.nodeName && input.nodeName.toLowerCase() === 'input')) { // IE8 input. var range = document.selection.createRange(); // There can only be one selection per document in IE, so it must @@ -119,7 +121,8 @@ var ReactInputSelection = { if ('selectionStart' in input) { input.selectionStart = start; input.selectionEnd = Math.min(end, input.value.length); - } else if (document.selection && input.nodeName === 'INPUT') { + } else if (document.selection && + (input.nodeName && input.nodeName.toLowerCase() === 'input')) { var range = input.createTextRange(); range.collapse(true); range.moveStart('character', start); diff --git a/src/renderers/dom/client/ReactMount.js b/src/renderers/dom/client/ReactMount.js index 090ae1624c..ab85a1432c 100644 --- a/src/renderers/dom/client/ReactMount.js +++ b/src/renderers/dom/client/ReactMount.js @@ -519,7 +519,7 @@ var ReactMount = { ); warning( - container && container.tagName !== 'BODY', + container && container.tagName && container.tagName.toUpperCase() !== 'BODY', 'render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + diff --git a/src/renderers/dom/client/eventPlugins/ChangeEventPlugin.js b/src/renderers/dom/client/eventPlugins/ChangeEventPlugin.js index 52b1d00d73..e814346e8e 100644 --- a/src/renderers/dom/client/eventPlugins/ChangeEventPlugin.js +++ b/src/renderers/dom/client/eventPlugins/ChangeEventPlugin.js @@ -55,9 +55,10 @@ var activeElementValueProp = null; * SECTION: handle `change` event */ function shouldUseChangeEvent(elem) { + var nodeName = elem.nodeName && elem.nodeName.toLowerCase(); return ( - elem.nodeName === 'SELECT' || - (elem.nodeName === 'INPUT' && elem.type === 'file') + nodeName === 'select' || + (nodeName === 'input' && elem.type === 'file') ); } @@ -289,7 +290,7 @@ function shouldUseClickEvent(elem) { // This approach works across all browsers, whereas `change` does not fire // until `blur` in IE8. return ( - elem.nodeName === 'INPUT' && + (elem.nodeName && elem.nodeName.toLowerCase() === 'input') && (elem.type === 'checkbox' || elem.type === 'radio') ); } diff --git a/src/shared/utils/isTextInputElement.js b/src/shared/utils/isTextInputElement.js index 649229e966..7148b81b48 100644 --- a/src/shared/utils/isTextInputElement.js +++ b/src/shared/utils/isTextInputElement.js @@ -33,9 +33,10 @@ var supportedInputTypes = { }; function isTextInputElement(elem) { - return elem && ( - (elem.nodeName === 'INPUT' && supportedInputTypes[elem.type]) || - elem.nodeName === 'TEXTAREA' + var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); + return nodeName && ( + (nodeName === 'input' && supportedInputTypes[elem.type]) || + nodeName === 'textarea' ); }