diff --git a/src/diff/index.js b/src/diff/index.js index be14cf60c6..ad6d9991fa 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -277,7 +277,7 @@ function diffElementNodes(dom, newVNode, oldVNode, context, isSvg, excessDomChil } let oldHtml = oldProps.dangerouslySetInnerHTML; let newHtml = newProps.dangerouslySetInnerHTML; - if (newHtml || oldHtml) { + if ((newHtml || oldHtml) && excessDomChildren==null) { // Avoid re-applying the same '__html' if it did not changed between re-render if (!newHtml || !oldHtml || newHtml.__html!=oldHtml.__html) { dom.innerHTML = newHtml && newHtml.__html || ''; diff --git a/test/browser/render.test.js b/test/browser/render.test.js index be88e47c6d..bb3f13d622 100644 --- a/test/browser/render.test.js +++ b/test/browser/render.test.js @@ -620,14 +620,14 @@ describe('render()', () => { expect(scratch.innerHTML).to.equal('
test
'); }); - it('should hydrate with dangerouslySetInnerHTML', () => { + it('should not hydrate with dangerouslySetInnerHTML', () => { let html = 'foo & bar'; scratch.innerHTML = `
${html}
`; // eslint-disable-next-line react/no-danger render(
, scratch); - expect(scratch.firstChild).to.have.property('innerHTML', html); - expect(scratch.innerHTML).to.equal(`
${html}
`); + expect(scratch.firstChild).to.have.property('innerHTML', ''); + expect(scratch.innerHTML).to.equal(`
`); }); it('should avoid reapplying innerHTML when __html property of dangerouslySetInnerHTML attr remains unchanged', () => {