diff --git a/src/renderers/dom/client/ReactMount.js b/src/renderers/dom/client/ReactMount.js index 3aadb2f9b6..758f7ee6b8 100644 --- a/src/renderers/dom/client/ReactMount.js +++ b/src/renderers/dom/client/ReactMount.js @@ -880,9 +880,13 @@ var ReactMount = { checksum ); - var diffIndex = firstDifferenceIndex(markup, rootMarkup); + var normalizer = document.createElement('div'); + normalizer.innerHTML = markup; + var normalizedMarkup = normalizer.innerHTML; + + var diffIndex = firstDifferenceIndex(normalizedMarkup, rootMarkup); var difference = ' (client) ' + - markup.substring(diffIndex - 20, diffIndex + 20) + + normalizedMarkup.substring(diffIndex - 20, diffIndex + 20) + '\n (server) ' + rootMarkup.substring(diffIndex - 20, diffIndex + 20); invariant( diff --git a/src/renderers/dom/client/__tests__/ReactMount-test.js b/src/renderers/dom/client/__tests__/ReactMount-test.js index d5700df411..ea875eb38f 100644 --- a/src/renderers/dom/client/__tests__/ReactMount-test.js +++ b/src/renderers/dom/client/__tests__/ReactMount-test.js @@ -16,6 +16,7 @@ var mocks = require('mocks'); describe('ReactMount', function() { var React = require('React'); var ReactMount = require('ReactMount'); + var ReactMarkupChecksum = require('ReactMarkupChecksum'); var ReactTestUtils = require('ReactTestUtils'); var WebComponents = WebComponents; @@ -156,6 +157,22 @@ describe('ReactMount', function() { ); }); + it('should account for escaping on a checksum mismatch', function () { + var div = document.createElement('div'); + var markup = React.renderToString( +