diff --git a/docs/src/pages/guides/composition/composition.md b/docs/src/pages/guides/composition/composition.md index 751e428f63ea03..084116bf62ba24 100644 --- a/docs/src/pages/guides/composition/composition.md +++ b/docs/src/pages/guides/composition/composition.md @@ -89,6 +89,6 @@ class ListItemLink extends React.Component { } ``` -`renderLink` will now always reference the same component. Here is a demo: +`renderLink` will now always reference the same component. Here is a demo with react-router: {{"demo": "pages/guides/composition/ComponentProperty.js"}} diff --git a/packages/material-ui/src/Portal/Portal.js b/packages/material-ui/src/Portal/Portal.js index 0931b5b6ce9dec..4166f80a9cca42 100644 --- a/packages/material-ui/src/Portal/Portal.js +++ b/packages/material-ui/src/Portal/Portal.js @@ -1,3 +1,5 @@ +/* eslint-disable no-underscore-dangle */ + import React from 'react'; import ReactDOM from 'react-dom'; import PropTypes from 'prop-types'; @@ -44,13 +46,30 @@ class Portal extends React.Component { * @public */ getMountNode = () => { + if (this.disable) { + return ReactDOM.findDOMNode(this); + } + return this.mountNode; }; + // Hack waiting for https://github.com/airbnb/enzyme/issues/252 to be solved. + // When `__MUI_PORTAL_DISABLE__` is set to `true`, + // the portal will behave as a pass-through component. + disable = typeof global !== 'undefined' && global.__MUI_PORTAL_DISABLE__; + render() { const { children } = this.props; - return this.mountNode ? ReactDOM.createPortal(children, this.mountNode) : null; + if (this.mountNode) { + if (this.disable) { + return children; + } + + return ReactDOM.createPortal(children, this.mountNode); + } + + return null; } } diff --git a/packages/material-ui/src/Portal/Portal.test.js b/packages/material-ui/src/Portal/Portal.test.js index c9aac3e6a2c3c5..06cdb967d10c59 100644 --- a/packages/material-ui/src/Portal/Portal.test.js +++ b/packages/material-ui/src/Portal/Portal.test.js @@ -1,3 +1,4 @@ +/* eslint-disable no-underscore-dangle */ /* eslint-disable react/no-multi-comp */ import React from 'react'; @@ -24,6 +25,29 @@ describe('', () => { mount.cleanUp(); }); + describe('disable portal for tests', () => { + const Portal = NewPortal; + + before(() => { + global.__MUI_PORTAL_DISABLE__ = true; + }); + + after(() => { + global.__MUI_PORTAL_DISABLE__ = false; + }); + + it('should disable the portal feature', () => { + const wrapper = mount( + +

Foo

+
, + ); + assert.strictEqual(wrapper.children().length, 1, 'should have one children'); + const instance = wrapper.instance(); + assert.strictEqual(instance.getMountNode().nodeName.toLowerCase(), 'h1'); + }); + }); + versions.map(verion => { describe(verion, () => { let Portal;