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

Merge pull request #5495 from jimfb/remove-public-dom-instance

Browse Source 
Remove legacy dom node/ref stuff.
This commit is contained in:
Jim
2015-11-19 11:27:24 -08:00
parent 0440de9f89 538d0b08f2
commit c643ecd7c7
4 changed files with 3 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderers/dom/shared/ReactDOMComponent.js
+1 -129
View File
@@ -35,10 +35,8 @@ var ReactDOMSelect = require('ReactDOMSelect');
var ReactDOMTextarea = require('ReactDOMTextarea');
var ReactMultiChild = require('ReactMultiChild');
var ReactPerf = require('ReactPerf');
var ReactUpdateQueue = require('ReactUpdateQueue');
var assign = require('Object.assign');
var canDefineProperty = require('canDefineProperty');
var escapeTextContentForBrowser = require('escapeTextContentForBrowser');
var invariant = require('invariant');
var isEventSupported = require('isEventSupported');
@@ -73,102 +71,6 @@ function getDeclarationErrorAddendum(internalInstance) {
return '';
}
var legacyPropsDescriptor;
if (__DEV__) {
legacyPropsDescriptor = {
props: {
enumerable: false,
get: function() {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
warning(
false,
'ReactDOMComponent: Do not access .props of a DOM node; instead, ' +
'recreate the props as `render` did originally or read the DOM ' +
'properties/attributes directly from this node (e.g., ' +
'this.refs.box.className).%s',
getDeclarationErrorAddendum(component)
);
return component._currentElement.props;
},
},
};
}
function legacyGetDOMNode() {
if (__DEV__) {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
warning(
false,
'ReactDOMComponent: Do not access .getDOMNode() of a DOM node; ' +
'instead, use the node directly.%s',
getDeclarationErrorAddendum(component)
);
}
return this;
}
function legacyIsMounted() {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
if (__DEV__) {
warning(
false,
'ReactDOMComponent: Do not access .isMounted() of a DOM node.%s',
getDeclarationErrorAddendum(component)
);
}
return !!component;
}
function legacySetStateEtc() {
if (__DEV__) {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
warning(
false,
'ReactDOMComponent: Do not access .setState(), .replaceState(), or ' +
'.forceUpdate() of a DOM node. This is a no-op.%s',
getDeclarationErrorAddendum(component)
);
}
}
function legacySetProps(partialProps, callback) {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
if (__DEV__) {
warning(
false,
'ReactDOMComponent: Do not access .setProps() of a DOM node. ' +
'Instead, call ReactDOM.render again at the top level.%s',
getDeclarationErrorAddendum(component)
);
}
if (!component) {
return;
}
ReactUpdateQueue.enqueueSetPropsInternal(component, partialProps);
if (callback) {
ReactUpdateQueue.enqueueCallbackInternal(component, callback);
}
}
function legacyReplaceProps(partialProps, callback) {
var component = ReactDOMComponentTree.getInstanceFromNode(this);
if (__DEV__) {
warning(
false,
'ReactDOMComponent: Do not access .replaceProps() of a DOM node. ' +
'Instead, call ReactDOM.render again at the top level.%s',
getDeclarationErrorAddendum(component)
);
}
if (!component) {
return;
}
ReactUpdateQueue.enqueueReplacePropsInternal(component, partialProps);
if (callback) {
ReactUpdateQueue.enqueueCallbackInternal(component, callback);
}
}
function friendlyStringify(obj) {
if (typeof obj === 'object') {
if (Array.isArray(obj)) {
@@ -908,10 +810,6 @@ ReactDOMComponent.Mixin = {
context
);
if (!canDefineProperty && this._flags & Flags.nodeHasLegacyProperties) {
this._nativeNode.props = nextProps;
}
if (this._tag === 'select') {
// <select> value update needs to occur after <option> children
// reconciliation
@@ -1157,33 +1055,7 @@ ReactDOMComponent.Mixin = {
},
getPublicInstance: function() {
var node = getNode(this);
if (this._flags & Flags.nodeHasLegacyProperties) {
return node;
} else {
node.getDOMNode = legacyGetDOMNode;
node.isMounted = legacyIsMounted;
node.setState = legacySetStateEtc;
node.replaceState = legacySetStateEtc;
node.forceUpdate = legacySetStateEtc;
node.setProps = legacySetProps;
node.replaceProps = legacyReplaceProps;
if (__DEV__) {
if (canDefineProperty) {
Object.defineProperties(node, legacyPropsDescriptor);
} else {
// updateComponent will update this property on subsequent renders
node.props = this._currentElement.props;
}
} else {
// updateComponent will update this property on subsequent renders
node.props = this._currentElement.props;
}
this._flags |= Flags.nodeHasLegacyProperties;
return node;
}
return getNode(this);
},
};
src/renderers/dom/shared/ReactDOMComponentFlags.js
+1 -2
View File
@@ -12,8 +12,7 @@
'use strict';
var ReactDOMComponentFlags = {
nodeHasLegacyProperties: 1 << 0,
hasCachedChildNodes: 1 << 1,
hasCachedChildNodes: 1 << 0,
};
module.exports = ReactDOMComponentFlags;
src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
-82
View File
@@ -1088,86 +1088,4 @@ describe('ReactDOMComponent', function() {
);
});
});
describe('DOM nodes as refs', function() {
var ReactTestUtils;
beforeEach(function() {
ReactTestUtils = require('ReactTestUtils');
});
it('warns when accessing properties on DOM components', function() {
spyOn(console, 'error');
var innerDiv;
var Animal = React.createClass({
render: function() {
return <div ref="div">iguana</div>;
},
componentDidMount: function() {
innerDiv = this.refs.div;
void this.refs.div.props;
this.refs.div.setState();
expect(this.refs.div.getDOMNode()).toBe(this.refs.div);
expect(this.refs.div.isMounted()).toBe(true);
},
});
var container = document.createElement('div');
ReactDOM.render(<Animal />, container);
ReactDOM.unmountComponentAtNode(container);
expect(innerDiv.isMounted()).toBe(false);
expect(console.error.calls.length).toBe(5);
expect(console.error.argsForCall[0][0]).toBe(
'Warning: ReactDOMComponent: Do not access .props of a DOM ' +
'node; instead, recreate the props as `render` did originally or ' +
'read the DOM properties/attributes directly from this node (e.g., ' +
'this.refs.box.className). This DOM node was rendered by `Animal`.'
);
expect(console.error.argsForCall[1][0]).toBe(
'Warning: ReactDOMComponent: Do not access .setState(), ' +
'.replaceState(), or .forceUpdate() of a DOM node. This is a no-op. ' +
'This DOM node was rendered by `Animal`.'
);
expect(console.error.argsForCall[2][0]).toBe(
'Warning: ReactDOMComponent: Do not access .getDOMNode() of a DOM ' +
'node; instead, use the node directly. This DOM node was ' +
'rendered by `Animal`.'
);
expect(console.error.argsForCall[3][0]).toBe(
'Warning: ReactDOMComponent: Do not access .isMounted() of a DOM ' +
'node. This DOM node was rendered by `Animal`.'
);
expect(console.error.argsForCall[4][0]).toContain('isMounted');
});
it('handles legacy setProps and replaceProps', function() {
spyOn(console, 'error');
var node = ReactTestUtils.renderIntoDocument(<div>rhinoceros</div>);
node.setProps({className: 'herbiverous'});
expect(node.className).toBe('herbiverous');
expect(node.textContent).toBe('rhinoceros');
node.replaceProps({className: 'invisible rhino'});
expect(node.className).toBe('invisible rhino');
expect(node.textContent).toBe('');
expect(console.error.calls.length).toBe(2);
expect(console.error.argsForCall[0][0]).toBe(
'Warning: ReactDOMComponent: Do not access .setProps() of a DOM node. ' +
'Instead, call ReactDOM.render again at the top level.'
);
expect(console.error.argsForCall[1][0]).toBe(
'Warning: ReactDOMComponent: Do not access .replaceProps() of a DOM ' +
'node. Instead, call ReactDOM.render again at the top level.'
);
});
it('does not touch ref-less nodes', function() {
var node = ReactTestUtils.renderIntoDocument(<div><span /></div>);
expect(typeof node.getDOMNode).toBe('function');
expect(typeof node.firstChild.getDOMNode).toBe('undefined');
});
});
});
src/renderers/shared/reconciler/__tests__/ReactCompositeComponent-test.js
+1 -1
View File
@@ -146,7 +146,7 @@ describe('ReactCompositeComponent', function() {
var anchor = instance.getAnchor();
var actualDOMAnchorNode = ReactDOM.findDOMNode(anchor);
expect(actualDOMAnchorNode.className).toBe('');
expect(actualDOMAnchorNode).toBe(anchor.getDOMNode());
expect(actualDOMAnchorNode).toBe(ReactDOM.findDOMNode(anchor));
});
it('should auto bind methods and values correctly', function() {