From 945d041160cb2fca3bde2c2422c46e6fe99af4dd Mon Sep 17 00:00:00 2001 From: Ben Alpert Date: Wed, 16 Apr 2014 15:07:32 -0700 Subject: [PATCH] Add clearer invariant in processUpdates The `updatedChildren[j].parentNode.removeChild(updatedChildren[j]);` line below can fail if (1) we're moving/moving the same node twice or (2) the node we're looking for is gone completely. This makes it easier to distinguish between the two cases. Perf shouldn't be a concern here because this is DOM code and invariants are fast in comparison. Test Plan: grunt test --- src/browser/ui/dom/DOMChildrenOperations.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/browser/ui/dom/DOMChildrenOperations.js b/src/browser/ui/dom/DOMChildrenOperations.js index 8326e3c1216d0..d2bc513d68a14 100644 --- a/src/browser/ui/dom/DOMChildrenOperations.js +++ b/src/browser/ui/dom/DOMChildrenOperations.js @@ -23,6 +23,7 @@ var Danger = require('Danger'); var ReactMultiChildUpdateTypes = require('ReactMultiChildUpdateTypes'); var getTextContentAccessor = require('getTextContentAccessor'); +var invariant = require('invariant'); /** * The DOM property to use when setting text content. @@ -119,6 +120,17 @@ var DOMChildrenOperations = { var updatedChild = update.parentNode.childNodes[updatedIndex]; var parentID = update.parentID; + invariant( + updatedChild, + 'processUpdates(): Unable to find child %s of element. This ' + + 'probably means the DOM was unexpectedly mutated (e.g., by the ' + + 'browser), usually due to forgetting a when using tables ' + + 'or nesting

or tags. Try inspecting the child nodes of the ' + + 'element with React ID `%s`.', + updatedIndex, + parentID + ); + initialChildren = initialChildren || {}; initialChildren[parentID] = initialChildren[parentID] || []; initialChildren[parentID][updatedIndex] = updatedChild;