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

Inline createFullPageComponent in ReactDOMComponent

Browse Source
This commit is contained in:
Ben Alpert
2015-06-02 17:23:04 -07:00
parent 4c3e9650ba
commit fc341c5537
4 changed files with 20 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderers/dom/client/__tests__/ReactRenderDocument-test.js
+1 -1
View File
@@ -20,7 +20,7 @@ var getTestDocument;
var testDocument;
var UNMOUNT_INVARIANT_MESSAGE =
'Invariant Violation: ReactFullPageComponenthtml tried to unmount. ' +
'Invariant Violation: <html> tried to unmount. ' +
'Because of cross-browser quirks it is impossible to unmount some ' +
'top-level components (eg <html>, <head>, and <body>) reliably and ' +
'efficiently. To fix this, have a single top-level component that ' +
src/renderers/dom/client/wrappers/createFullPageComponent.js
-58
View File
@@ -1,58 +0,0 @@
/**
* Copyright 2013-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule createFullPageComponent
* @typechecks
*/
'use strict';
// Defeat circular references by requiring this directly.
var ReactClass = require('ReactClass');
var ReactElement = require('ReactElement');
var invariant = require('invariant');
/**
* Create a component that will throw an exception when unmounted.
*
* Components like <html> <head> and <body> can't be removed or added
* easily in a cross-browser way, however it's valuable to be able to
* take advantage of React's reconciliation for styling and <title>
* management. So we just document it and throw in dangerous cases.
*
* @param {string} tag The tag to wrap
* @return {function} convenience constructor of new component
*/
function createFullPageComponent(tag) {
var elementFactory = ReactElement.createFactory(tag);
var FullPageComponent = ReactClass.createClass({
tagName: tag.toUpperCase(),
displayName: 'ReactFullPageComponent' + tag,
componentWillUnmount: function() {
invariant(
false,
'%s tried to unmount. Because of cross-browser quirks it is ' +
'impossible to unmount some top-level components (eg <html>, <head>, ' +
'and <body>) reliably and efficiently. To fix this, have a single ' +
'top-level component that never unmounts render these elements.',
this.constructor.displayName
);
},
render: function() {
return elementFactory(this.props);
},
});
return FullPageComponent;
}
module.exports = createFullPageComponent;
src/renderers/dom/shared/ReactDOMComponent.js
+19
View File
@@ -646,6 +646,25 @@ ReactDOMComponent.Mixin = {
case 'input':
ReactDOMInput.unmountWrapper(this);
break;
case 'html':
case 'head':
case 'body':
/**
* Components like <html> <head> and <body> can't be removed or added
* easily in a cross-browser way, however it's valuable to be able to
* take advantage of React's reconciliation for styling and <title>
* management. So we just document it and throw in dangerous cases.
*/
invariant(
false,
'<%s> tried to unmount. Because of cross-browser quirks it is ' +
'impossible to unmount some top-level components (eg <html>, ' +
'<head>, and <body>) reliably and efficiently. To fix this, have a ' +
'single top-level component that never unmounts render these ' +
'elements.',
this._tag
);
break;
}
this.unmountChildren();
src/renderers/dom/shared/ReactDefaultInjection.js
-8
View File
@@ -45,8 +45,6 @@ var ServerReactRootIndex = require('ServerReactRootIndex');
var SimpleEventPlugin = require('SimpleEventPlugin');
var SVGDOMPropertyConfig = require('SVGDOMPropertyConfig');
var createFullPageComponent = require('createFullPageComponent');
function autoGenerateWrapperClass(type) {
return ReactClass.createClass({
tagName: type.toUpperCase(),
@@ -110,8 +108,6 @@ function inject() {
autoGenerateWrapperClass
);
// This needs to happen before createFullPageComponent() otherwise the mixin
// won't be included.
ReactInjection.Class.injectMixin(ReactBrowserComponentMixin);
ReactInjection.NativeComponent.injectComponentClasses({
@@ -122,10 +118,6 @@ function inject() {
'option': ReactDOMOption,
'select': ReactDOMSelect,
'textarea': ReactDOMTextarea,
'html': createFullPageComponent('html'),
'head': createFullPageComponent('head'),
'body': createFullPageComponent('body'),
});
ReactInjection.DOMProperty.injectDOMPropertyConfig(HTMLDOMPropertyConfig);