Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix unmounting components mounted into doc element

Browse Source 
If we are to unmount a component mounted into a document element we should
unmount it from document.documentElement and not from document.firstChild which
is a doctype element in this specific case.
This commit is contained in:
Andrey Popp
2013-10-29 10:16:04 -07:00
committed by Paul O’Shannessy
parent 1b835fb5cf
commit 7b957c880c
3 changed files with 79 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/ReactMount.js
+6
View File
@@ -430,6 +430,10 @@ var ReactMount = {
unmountComponentFromNode: function(instance, container) {
instance.unmountComponent();
if (container.nodeType === DOC_NODE_TYPE) {
container = container.documentElement;
}
// http://jsperf.com/emptying-a-node
while (container.lastChild) {
container.removeChild(container.lastChild);
@@ -592,6 +596,8 @@ var ReactMount = {
ATTR_NAME: ATTR_NAME,
getReactRootID: getReactRootID,
getID: getID,
setID: setID,
src/core/__tests__/ReactRenderDocument-test.js
+60
View File
@@ -39,6 +39,66 @@ describe('rendering React components at document', function() {
testDocument = getTestDocument();
});
it('should be able to get root component id for document node', function() {
if (!testDocument) {
// These tests are not applicable in jst, since jsdom is buggy.
return;
}
var Root = React.createClass({
render: function() {
return (
<html>
<head>
<title>Hello World</title>
</head>
<body>
Hello world
</body>
</html>
);
}
});
ReactMount.allowFullPageRender = true;
var component = React.renderComponent(<Root />, testDocument);
expect(testDocument.body.innerHTML).toBe(' Hello world ');
var componentID = ReactMount.getReactRootID(testDocument);
expect(componentID).toBe(component._rootNodeID);
});
it('should be able to unmount component from document node', function() {
if (!testDocument) {
// These tests are not applicable in jst, since jsdom is buggy.
return;
}
var Root = React.createClass({
render: function() {
return (
<html>
<head>
<title>Hello World</title>
</head>
<body>
Hello world
</body>
</html>
);
}
});
ReactMount.allowFullPageRender = true;
React.renderComponent(<Root />, testDocument);
expect(testDocument.body.innerHTML).toBe(' Hello world ');
var unmounted = React.unmountComponentAtNode(testDocument);
expect(unmounted).toBe(true);
expect(testDocument.documentElement).not.toBe(null);
expect(testDocument.documentElement.innerHTML).toBe('');
});
it('should be able to switch root constructors via state', function() {
if (!testDocument) {
// These tests are not applicable in jst, since jsdom is buggy.
src/core/getReactRootElementInContainer.js
+13 -2
View File
@@ -18,12 +18,23 @@
"use strict";
var DOC_NODE_TYPE = 9;
/**
* @param {DOMElement} container DOM element that may contain a React component
* @param {DOMElement|DOMDocument} container DOM element that may contain
* a React component
* @return {?*} DOM element that may have the reactRoot ID, or null.
*/
function getReactRootElementInContainer(container) {
return container && container.firstChild;
if (!container) {
return null;
}
if (container.nodeType === DOC_NODE_TYPE) {
return container.documentElement;
} else {
return container.firstChild;
}
}
module.exports = getReactRootElementInContainer;