diff --git a/packages/material-ui/src/Collapse/Collapse.js b/packages/material-ui/src/Collapse/Collapse.js
index a84431db78d82a..709454e06c6486 100644
--- a/packages/material-ui/src/Collapse/Collapse.js
+++ b/packages/material-ui/src/Collapse/Collapse.js
@@ -7,6 +7,7 @@ import Transition from 'react-transition-group/Transition';
import withStyles from '../styles/withStyles';
import { duration } from '../styles/transitions';
import { getTransitionProps } from '../transitions/utils';
+import withForwardedRef from '../utils/withForwardedRef';
export const styles = theme => ({
/* Styles applied to the container element. */
@@ -132,6 +133,7 @@ class Collapse extends React.Component {
collapsedHeight,
component: Component,
in: inProp,
+ innerRef,
onEnter,
onEntered,
onEntering,
@@ -169,6 +171,7 @@ class Collapse extends React.Component {
minHeight: collapsedHeight,
...style,
}}
+ ref={innerRef}
{...childProps}
>
', () => {
classes,
inheritComponent: 'Transition',
mount,
- skip: ['refForwarding'],
+ refInstanceof: window.HTMLDivElement,
testComponentPropWith: false,
}));
it('should render a container around the wrapper', () => {
const wrapper = shallow();
- const child = new ReactWrapper(wrapper.props().children('entered'));
+ const child = new ReactWrapper(
+ wrapper
+ .dive()
+ .props()
+ .children('entered'),
+ );
assert.strictEqual(child.name(), 'div');
assert.strictEqual(child.hasClass(classes.container), true);
assert.strictEqual(child.hasClass('woofCollapse1'), true);
@@ -49,7 +53,12 @@ describe('', () => {
it('should render a wrapper around the children', () => {
const children = Hello
;
const wrapper = shallow({children});
- const child = new ReactWrapper(wrapper.props().children('entered'));
+ const child = new ReactWrapper(
+ wrapper
+ .dive()
+ .props()
+ .children('entered'),
+ );
assert.strictEqual(child.childAt(0).name(), 'div');
assert.strictEqual(
child
@@ -97,7 +106,7 @@ describe('', () => {
}}
/>,
);
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
element = { getBoundingClientRect: () => ({}), style: {} };
});
@@ -118,7 +127,7 @@ describe('', () => {
before(() => {
wrapper = shallow();
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
});
describe('handleEnter()', () => {
@@ -151,7 +160,7 @@ describe('', () => {
it('should call handleEntering', () => {
const onEnteringStub = spy();
wrapper.setProps({ onEntering: onEnteringStub });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleEntering(element);
assert.strictEqual(onEnteringStub.callCount, 1);
@@ -168,7 +177,7 @@ describe('', () => {
restore = theme.transitions.getAutoHeightDuration;
theme.transitions.getAutoHeightDuration = stub().returns('woofCollapseStub');
wrapper.setProps({ timeout: 'auto' });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
});
after(() => {
@@ -197,7 +206,7 @@ describe('', () => {
it('number should set timeout to ms', () => {
timeoutMock = 3;
wrapper.setProps({ timeout: timeoutMock });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleEntering(element);
assert.strictEqual(element.style.transitionDuration, `${timeoutMock}ms`);
@@ -206,7 +215,7 @@ describe('', () => {
it('nothing should not set timeout', () => {
const elementBackup = element;
wrapper.setProps({ timeout: undefined });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleEntering(element);
assert.strictEqual(
@@ -227,7 +236,7 @@ describe('', () => {
handleEnteredWrapper = shallow();
onEnteredSpy = spy();
handleEnteredWrapper.setProps({ onEntered: onEnteredSpy });
- handleEnteredInstance = handleEnteredWrapper.instance();
+ handleEnteredInstance = handleEnteredWrapper.dive().instance();
element = { style: { height: 666, transitionDuration: '500ms' } };
handleEnteredInstance.handleEntered(element);
});
@@ -265,7 +274,7 @@ describe('', () => {
it('should call onExiting', () => {
const onExitingStub = spy();
wrapper.setProps({ onExiting: onExitingStub });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleExiting(element);
assert.strictEqual(onExitingStub.callCount, 1);
@@ -282,7 +291,7 @@ describe('', () => {
restore = theme.transitions.getAutoHeightDuration;
theme.transitions.getAutoHeightDuration = stub().returns('woofCollapseStub2');
wrapper.setProps({ timeout: 'auto' });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
});
after(() => {
@@ -311,7 +320,7 @@ describe('', () => {
it('number should set timeout to ms', () => {
timeoutMock = 3;
wrapper.setProps({ timeout: timeoutMock });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleExiting(element);
assert.strictEqual(element.style.transitionDuration, `${timeoutMock}ms`);
@@ -320,7 +329,7 @@ describe('', () => {
it('nothing should not set timeout', () => {
const elementBackup = element;
wrapper.setProps({ timeout: undefined });
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
instance.handleExiting(element);
assert.strictEqual(
@@ -346,8 +355,8 @@ describe('', () => {
it('should return autoTransitionDuration when timeout is auto', () => {
const wrapper = shallow();
- assert.strictEqual(wrapper.props().timeout, null);
- instance = wrapper.instance();
+ assert.strictEqual(wrapper.dive().props().timeout, null);
+ instance = wrapper.dive().instance();
const next = spy();
const autoTransitionDuration = 10;
@@ -368,7 +377,7 @@ describe('', () => {
const timeout = 10;
const wrapper = shallow();
assert.strictEqual(wrapper.props().timeout, timeout);
- instance = wrapper.instance();
+ instance = wrapper.dive().instance();
const next = spy();
instance.addEndListener(null, next);
@@ -382,8 +391,9 @@ describe('', () => {
let mountInstance;
before(() => {
- const CollapseNaked = unwrap(Collapse);
- mountInstance = mount().instance();
+ mountInstance = mount()
+ .find('Collapse')
+ .instance();
});
it('instance should have a wrapper property', () => {
@@ -396,13 +406,18 @@ describe('', () => {
it('should work when closed', () => {
const wrapper = shallow();
- const child = new ReactWrapper(wrapper.props().children('entered'));
+ const child = new ReactWrapper(
+ wrapper
+ .dive()
+ .props()
+ .children('entered'),
+ );
assert.strictEqual(child.props().style.minHeight, collapsedHeight);
});
it('should be taken into account in handleExiting', () => {
const wrapper = shallow();
- const instance = wrapper.instance();
+ const instance = wrapper.dive().instance();
const element = { style: { height: 666, transitionDuration: undefined } };
instance.handleExiting(element);
assert.strictEqual(element.style.height, collapsedHeight, 'should have 0px height');