diff --git a/packages/material-ui/src/Backdrop/Backdrop.test.js b/packages/material-ui/src/Backdrop/Backdrop.test.js
index 6abd4f5d2cc293..767318ca3f619c 100644
--- a/packages/material-ui/src/Backdrop/Backdrop.test.js
+++ b/packages/material-ui/src/Backdrop/Backdrop.test.js
@@ -7,6 +7,7 @@ import {
getClasses,
} from '@material-ui/core/test-utils';
import Backdrop from './Backdrop';
+import Fade from '../Fade';
describe('', () => {
let mount;
@@ -24,9 +25,11 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: Fade,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
it('should render a backdrop div', () => {
diff --git a/packages/material-ui/src/Collapse/Collapse.test.js b/packages/material-ui/src/Collapse/Collapse.test.js
index ee0d2da39825ef..5d3aeb89575cb0 100644
--- a/packages/material-ui/src/Collapse/Collapse.test.js
+++ b/packages/material-ui/src/Collapse/Collapse.test.js
@@ -2,10 +2,17 @@ import React from 'react';
import { ReactWrapper } from 'enzyme';
import { assert } from 'chai';
import { spy, stub, useFakeTimers } from 'sinon';
-import { createShallow, createMount, getClasses, unwrap } from '@material-ui/core/test-utils';
+import {
+ createShallow,
+ createMount,
+ describeConformance,
+ getClasses,
+ unwrap,
+} from '@material-ui/core/test-utils';
import Collapse from './Collapse';
describe('', () => {
+ let mount;
let shallow;
let classes;
const props = {
@@ -14,15 +21,23 @@ describe('', () => {
};
before(() => {
+ mount = createMount();
shallow = createShallow({ dive: true });
classes = getClasses();
});
- it('should render a Transition', () => {
- const wrapper = shallow();
- assert.strictEqual(wrapper.name(), 'Transition');
+ after(() => {
+ mount.cleanUp();
});
+ describeConformance(, () => ({
+ classes,
+ inheritComponent: 'Transition',
+ mount,
+ skip: ['refForwarding'],
+ testComponentPropWith: false,
+ }));
+
it('should render a container around the wrapper', () => {
const wrapper = shallow();
const child = new ReactWrapper(wrapper.props().children('entered'));
@@ -364,19 +379,13 @@ describe('', () => {
});
describe('mount', () => {
- let mount;
let mountInstance;
before(() => {
- mount = createMount();
const CollapseNaked = unwrap(Collapse);
mountInstance = mount().instance();
});
- after(() => {
- mount.cleanUp();
- });
-
it('instance should have a wrapper property', () => {
assert.notStrictEqual(mountInstance.wrapperRef, undefined);
});
diff --git a/packages/material-ui/src/Fade/Fade.test.js b/packages/material-ui/src/Fade/Fade.test.js
index d8163ac314814f..164eae2ea60ed0 100644
--- a/packages/material-ui/src/Fade/Fade.test.js
+++ b/packages/material-ui/src/Fade/Fade.test.js
@@ -1,7 +1,7 @@
import React from 'react';
import { assert } from 'chai';
import { spy } from 'sinon';
-import { createMount } from '@material-ui/core/test-utils';
+import { createMount, describeConformance } from '@material-ui/core/test-utils';
import Fade from './Fade';
describe('', () => {
@@ -20,10 +20,13 @@ describe('', () => {
mount.cleanUp();
});
- it('should render a Transition', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find('Transition').exists(), true);
- });
+ describeConformance(, () => ({
+ classes: {},
+ inheritComponent: 'Transition',
+ mount,
+ skip: ['refForwarding'],
+ testComponentPropWith: false,
+ }));
describe('event callbacks', () => {
describe('entering', () => {
diff --git a/packages/material-ui/src/FilledInput/FilledInput.test.js b/packages/material-ui/src/FilledInput/FilledInput.test.js
index 3a6e50e62ba474..0bf2c07eed6761 100644
--- a/packages/material-ui/src/FilledInput/FilledInput.test.js
+++ b/packages/material-ui/src/FilledInput/FilledInput.test.js
@@ -7,6 +7,7 @@ import {
getClasses,
} from '@material-ui/core/test-utils';
import FilledInput from './FilledInput';
+import InputBase from '../InputBase';
describe('', () => {
let classes;
@@ -21,24 +22,23 @@ describe('', () => {
mount.cleanUp();
});
- describeConformance(, () => ({
+ describeConformance(, () => ({
+ classes,
+ inheritComponent: InputBase,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
- it('should render a
', () => {
+ it('should have the underline class', () => {
const wrapper = mount();
const root = findOutermostIntrinsic(wrapper);
- assert.strictEqual(root.type(), 'div');
- assert.strictEqual(root.hasClass(classes.root), true);
assert.strictEqual(root.hasClass(classes.underline), true);
});
- it('should disable the underline', () => {
+ it('can disable the underline', () => {
const wrapper = mount();
const root = findOutermostIntrinsic(wrapper);
- assert.strictEqual(root.hasClass(classes.root), true);
assert.strictEqual(root.hasClass(classes.underline), false);
});
});
diff --git a/packages/material-ui/src/Grid/Grid.test.js b/packages/material-ui/src/Grid/Grid.test.js
index 07f13177f063af..46cba8e9aa94dc 100644
--- a/packages/material-ui/src/Grid/Grid.test.js
+++ b/packages/material-ui/src/Grid/Grid.test.js
@@ -19,6 +19,10 @@ describe('', () => {
classes = getClasses();
});
+ after(() => {
+ mount.cleanUp();
+ });
+
describeConformance(, () => ({
classes,
inheritComponent: 'div',
@@ -27,12 +31,6 @@ describe('', () => {
testComponentPropWith: 'span',
}));
- it('should render', () => {
- const wrapper = shallow();
- assert.strictEqual(wrapper.name(), 'div');
- assert.strictEqual(wrapper.hasClass('woofGrid'), true);
- });
-
describe('prop: container', () => {
it('should apply the container class', () => {
const wrapper = shallow();
@@ -47,13 +45,6 @@ describe('', () => {
});
});
- describe('prop: component', () => {
- it('should change the component', () => {
- const wrapper = shallow();
- assert.strictEqual(wrapper.name(), 'span');
- });
- });
-
describe('prop: xs', () => {
it('should apply the flex-grow class', () => {
const wrapper = shallow();
diff --git a/packages/material-ui/src/Grow/Grow.test.js b/packages/material-ui/src/Grow/Grow.test.js
index 65e84ed3248196..e8aef2caf69f11 100644
--- a/packages/material-ui/src/Grow/Grow.test.js
+++ b/packages/material-ui/src/Grow/Grow.test.js
@@ -1,7 +1,7 @@
import React from 'react';
import { assert } from 'chai';
import { spy, stub, useFakeTimers } from 'sinon';
-import { createMount } from '@material-ui/core/test-utils';
+import { createMount, describeConformance } from '@material-ui/core/test-utils';
import Grow from './Grow';
import { createMuiTheme } from '@material-ui/core/styles';
@@ -20,10 +20,18 @@ describe('', () => {
mount.cleanUp();
});
- it('should render a Transition', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find('Transition').exists(), true);
- });
+ describeConformance(
+
+
+ ,
+ () => ({
+ classes: {},
+ inheritComponent: 'Transition',
+ mount,
+ skip: ['refForwarding'],
+ testComponentPropWith: false,
+ }),
+ );
describe('event callbacks', () => {
describe('entering', () => {
diff --git a/packages/material-ui/src/Input/Input.test.js b/packages/material-ui/src/Input/Input.test.js
index 5a2be386aeaca3..d91d1db1435e9c 100644
--- a/packages/material-ui/src/Input/Input.test.js
+++ b/packages/material-ui/src/Input/Input.test.js
@@ -1,16 +1,14 @@
import React from 'react';
-import { assert } from 'chai';
-import {
- createMount,
- describeConformance,
- findOutermostIntrinsic,
-} from '@material-ui/core/test-utils';
+import { createMount, describeConformance, getClasses } from '@material-ui/core/test-utils';
import Input from './Input';
+import InputBase from '../InputBase';
describe('', () => {
+ let classes;
let mount;
before(() => {
+ classes = getClasses();
mount = createMount();
});
@@ -19,13 +17,10 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: InputBase,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
-
- it('should render a ', () => {
- const wrapper = mount();
- assert.strictEqual(findOutermostIntrinsic(wrapper).type(), 'div');
- });
});
diff --git a/packages/material-ui/src/Menu/Menu.test.js b/packages/material-ui/src/Menu/Menu.test.js
index 65ad22fedefee7..38e1f5aee347c3 100644
--- a/packages/material-ui/src/Menu/Menu.test.js
+++ b/packages/material-ui/src/Menu/Menu.test.js
@@ -26,16 +26,13 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: Popover,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
- it('should render a Popover', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find(Popover).exists(), true);
- });
-
describe('event callbacks', () => {
describe('entering', () => {
it('should fire callbacks', done => {
@@ -144,14 +141,6 @@ describe('', () => {
true,
);
});
-
- it('should spread other props on the Popover', () => {
- assert.strictEqual(wrapper.find(Popover).props()['data-test'], 'hi');
- });
-
- it('should have the user classes', () => {
- assert.strictEqual(wrapper.find(Popover).hasClass('test-class'), true);
- });
});
it('should open during the initial mount', () => {
diff --git a/packages/material-ui/src/MenuList/MenuList.test.js b/packages/material-ui/src/MenuList/MenuList.test.js
index c355dc50e5e5f1..8739ac988a4eda 100644
--- a/packages/material-ui/src/MenuList/MenuList.test.js
+++ b/packages/material-ui/src/MenuList/MenuList.test.js
@@ -4,6 +4,7 @@ import { stub } from 'sinon';
import { createMount, describeConformance } from '@material-ui/core/test-utils';
import MenuList from './MenuList';
import getScrollbarSize from '../utils/getScrollbarSize';
+import List from '../List';
function setStyleWidthForJsdomOrBrowser(style, width) {
style.width = '';
@@ -27,24 +28,13 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes: {},
+ inheritComponent: List,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLUListElement,
+ testComponentPropWith: false,
}));
- describe('list node', () => {
- let wrapper;
-
- before(() => {
- wrapper = mount();
- });
-
- it('should render a List', () => {
- assert.strictEqual(wrapper.props()['data-test'], 'hi');
- assert.strictEqual(wrapper.hasClass('test-class'), true);
- });
- });
-
describe('prop: children', () => {
it('should support invalid children', () => {
const wrapper = mount(
diff --git a/packages/material-ui/src/NativeSelect/NativeSelect.test.js b/packages/material-ui/src/NativeSelect/NativeSelect.test.js
index 79cb127a2d8935..11ad0be96b9b81 100644
--- a/packages/material-ui/src/NativeSelect/NativeSelect.test.js
+++ b/packages/material-ui/src/NativeSelect/NativeSelect.test.js
@@ -1,6 +1,6 @@
import React from 'react';
import { assert } from 'chai';
-import { getClasses, createMount } from '@material-ui/core/test-utils';
+import { getClasses, createMount, describeConformance } from '@material-ui/core/test-utils';
import Input from '../Input';
import NativeSelect from './NativeSelect';
@@ -28,10 +28,14 @@ describe('', () => {
mount.cleanUp();
});
- it('should render a correct top element', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find(Input).exists(), true);
- });
+ describeConformance(, () => ({
+ classes,
+ inheritComponent: Input,
+ mount,
+ refInstanceof: window.HTMLDivElement,
+ skip: ['rootClass'],
+ testComponentPropWith: false,
+ }));
it('should provide the classes to the input component', () => {
const wrapper = mount();
diff --git a/packages/material-ui/src/OutlinedInput/OutlinedInput.test.js b/packages/material-ui/src/OutlinedInput/OutlinedInput.test.js
index 9ec17e1b7cdfae..9dfecc9720f67c 100644
--- a/packages/material-ui/src/OutlinedInput/OutlinedInput.test.js
+++ b/packages/material-ui/src/OutlinedInput/OutlinedInput.test.js
@@ -1,17 +1,16 @@
import React from 'react';
import { assert } from 'chai';
-import {
- createMount,
- describeConformance,
- findOutermostIntrinsic,
-} from '@material-ui/core/test-utils';
+import { createMount, describeConformance, getClasses } from '@material-ui/core/test-utils';
import OutlinedInput from './OutlinedInput';
import NotchedOutline from './NotchedOutline';
+import InputBase from '../InputBase';
describe('', () => {
+ let classes;
let mount;
before(() => {
+ classes = getClasses();
mount = createMount();
});
@@ -20,17 +19,14 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: InputBase,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
- it('should render a ', () => {
- const wrapper = mount();
- assert.strictEqual(findOutermostIntrinsic(wrapper).type(), 'div');
- });
-
- it('should mount', () => {
+ it('should render a NotchedOutline', () => {
const wrapper = mount();
assert.strictEqual(wrapper.find(NotchedOutline).length, 1);
});
diff --git a/packages/material-ui/src/Popover/Popover.test.js b/packages/material-ui/src/Popover/Popover.test.js
index 70054c15404145..34437881058d2c 100644
--- a/packages/material-ui/src/Popover/Popover.test.js
+++ b/packages/material-ui/src/Popover/Popover.test.js
@@ -39,9 +39,11 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: Modal,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
describe('root node', () => {
diff --git a/packages/material-ui/src/Popper/Popper.test.js b/packages/material-ui/src/Popper/Popper.test.js
index 094c7a2d771f2c..416fee35c051db 100644
--- a/packages/material-ui/src/Popper/Popper.test.js
+++ b/packages/material-ui/src/Popper/Popper.test.js
@@ -2,7 +2,7 @@ import React from 'react';
import { assert } from 'chai';
import { spy } from 'sinon';
import PropTypes from 'prop-types';
-import { createShallow, createMount } from '@material-ui/core/test-utils';
+import { createShallow, createMount, describeConformance } from '@material-ui/core/test-utils';
import consoleErrorMock from 'test/utils/consoleErrorMock';
import Grow from '../Grow';
import Popper from './Popper';
@@ -10,31 +10,28 @@ import Popper from './Popper';
describe('', () => {
let shallow;
let mount;
- let anchorEl;
- let defaultProps;
+ const defaultProps = {
+ anchorEl: () => window.document.createElement('div'),
+ children: Hello World,
+ open: true,
+ };
before(() => {
- anchorEl = window.document.createElement('div');
- window.document.body.appendChild(anchorEl);
shallow = createShallow();
mount = createMount();
- defaultProps = {
- anchorEl,
- children: Hello World,
- open: true,
- };
});
after(() => {
mount.cleanUp();
- window.document.body.removeChild(anchorEl);
});
- it('should render the correct structure', () => {
- const wrapper = shallow();
- assert.strictEqual(wrapper.name(), 'Portal');
- assert.strictEqual(wrapper.childAt(0).name(), 'div');
- });
+ describeConformance(, () => ({
+ classes: {},
+ inheritComponent: 'div',
+ mount,
+ refInstanceof: React.Component,
+ testComponentPropWith: false,
+ }));
describe('prop: placement', () => {
before(() => {
diff --git a/packages/material-ui/src/RadioGroup/RadioGroup.test.js b/packages/material-ui/src/RadioGroup/RadioGroup.test.js
index 7be00c2e405cc9..9bfd225e7fe87d 100644
--- a/packages/material-ui/src/RadioGroup/RadioGroup.test.js
+++ b/packages/material-ui/src/RadioGroup/RadioGroup.test.js
@@ -27,14 +27,15 @@ describe('', () => {
}
describeConformance(, () => ({
+ classes: {},
+ inheritComponent: FormGroup,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ testComponentPropWith: false,
}));
- it('should render a FormGroup with the radiogroup role', () => {
+ it('the root component has the radiogroup role', () => {
const wrapper = mount();
- assert.strictEqual(wrapper.childAt(0).type(), FormGroup);
assert.strictEqual(findOutermostIntrinsic(wrapper).props().role, 'radiogroup');
});
diff --git a/packages/material-ui/src/Select/Select.test.js b/packages/material-ui/src/Select/Select.test.js
index cd6fd8390ddf40..17608bc755f517 100644
--- a/packages/material-ui/src/Select/Select.test.js
+++ b/packages/material-ui/src/Select/Select.test.js
@@ -32,16 +32,14 @@ describe('', () => {
});
describeConformance(, () => ({
+ classes,
+ inheritComponent: Input,
mount,
- only: ['refForwarding'],
refInstanceof: window.HTMLDivElement,
+ skip: ['rootClass'],
+ testComponentPropWith: false,
}));
- it('should render a correct top element', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find(Input).exists(), true);
- });
-
it('should provide the classes to the input component', () => {
const wrapper = mount();
assert.deepEqual(wrapper.find(Input).props().inputProps.classes, classes);
diff --git a/packages/material-ui/src/Slide/Slide.test.js b/packages/material-ui/src/Slide/Slide.test.js
index 17506074890635..65f415ebb7d16a 100644
--- a/packages/material-ui/src/Slide/Slide.test.js
+++ b/packages/material-ui/src/Slide/Slide.test.js
@@ -1,7 +1,12 @@
import React from 'react';
import { assert } from 'chai';
import { spy, useFakeTimers } from 'sinon';
-import { createShallow, createMount, unwrap } from '@material-ui/core/test-utils';
+import {
+ createShallow,
+ createMount,
+ describeConformance,
+ unwrap,
+} from '@material-ui/core/test-utils';
import Slide, { setTranslateValue } from './Slide';
import transitions, { easing } from '../styles/transitions';
import createMuiTheme from '../styles/createMuiTheme';
@@ -25,11 +30,18 @@ describe('', () => {
mount.cleanUp();
});
- it('should render a Transition', () => {
- const wrapper = shallow();
- assert.strictEqual(wrapper.name(), 'EventListener');
- assert.strictEqual(wrapper.childAt(0).name(), 'Transition');
- });
+ describeConformance(
+
+
+ ,
+ () => ({
+ classes: {},
+ inheritComponent: 'Transition',
+ mount,
+ refInstanceof: React.Component,
+ testComponentPropWith: false,
+ }),
+ );
it('should not override children styles', () => {
const wrapper = mount(
diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
index cb3dfb5c625d50..3c20147c9231e3 100644
--- a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
+++ b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
@@ -1,7 +1,7 @@
import React from 'react';
import { assert } from 'chai';
import { spy, stub } from 'sinon';
-import { createMount, unwrap } from '@material-ui/core/test-utils';
+import { createMount, describeConformance, unwrap } from '@material-ui/core/test-utils';
import Drawer from '../Drawer';
import SwipeableDrawer, { reset } from './SwipeableDrawer';
import SwipeArea from './SwipeArea';
@@ -58,6 +58,14 @@ describe('', () => {
mount.cleanUp();
});
+ describeConformance( {}} onClose={() => {}} open />, () => ({
+ classes: {},
+ inheritComponent: Drawer,
+ mount,
+ refInstanceof: React.Component,
+ testComponentPropWith: false,
+ }));
+
it('should render a Drawer and a SwipeArea', () => {
const wrapper = mount(
', () => {
refInstanceof: window.HTMLSpanElement,
}));
+ /* TODO Switch violates root component
+ describeConformance(, () => ({
+ classes,
+ inheritComponent: IconButton,
+ mount,
+ refInstanceof: window.HTMLSpanElement,
+ testComponentPropWith: false,
+ })); */
+
describe('styleSheet', () => {
it('should have the classes required for SwitchBase', () => {
assert.strictEqual(typeof classes.root, 'string');
@@ -46,12 +55,6 @@ describe('', () => {
wrapper = shallow();
});
- it('should render a span with the root and user classes', () => {
- assert.strictEqual(wrapper.name(), 'span');
- assert.strictEqual(wrapper.hasClass(classes.root), true);
- assert.strictEqual(wrapper.hasClass('foo'), true);
- });
-
it('should render SwitchBase with a custom span icon with the thumb class', () => {
const switchBase = wrapper.childAt(0);
assert.strictEqual(switchBase.type(), SwitchBase);
diff --git a/packages/material-ui/src/TableHead/TableHead.test.js b/packages/material-ui/src/TableHead/TableHead.test.js
index 03b90f2b3710ec..1f1e64f7cf6260 100644
--- a/packages/material-ui/src/TableHead/TableHead.test.js
+++ b/packages/material-ui/src/TableHead/TableHead.test.js
@@ -9,7 +9,7 @@ describe('', () => {
let classes;
function mountInTable(node) {
const wrapper = mount();
- return wrapper.find('table');
+ return wrapper.find('table').childAt(0);
}
before(() => {
diff --git a/packages/material-ui/src/TablePagination/TablePagination.test.js b/packages/material-ui/src/TablePagination/TablePagination.test.js
index 3116c5ec04fcec..af52d568402b86 100644
--- a/packages/material-ui/src/TablePagination/TablePagination.test.js
+++ b/packages/material-ui/src/TablePagination/TablePagination.test.js
@@ -1,13 +1,7 @@
import React from 'react';
import { assert } from 'chai';
import PropTypes from 'prop-types';
-import {
- createShallow,
- createMount,
- describeConformance,
- findOutermostIntrinsic,
- getClasses,
-} from '@material-ui/core/test-utils';
+import { createMount, describeConformance, getClasses } from '@material-ui/core/test-utils';
import consoleErrorMock from 'test/utils/consoleErrorMock';
import Select from '../Select';
import IconButton from '../IconButton';
@@ -20,7 +14,6 @@ import TablePagination from './TablePagination';
describe('', () => {
const noop = () => {};
let classes;
- let shallow;
let mount;
function mountInTable(node) {
@@ -38,7 +31,6 @@ describe('', () => {
classes = getClasses(
{}} page={0} rowsPerPage={1} />,
);
- shallow = createShallow({ dive: true });
mount = createMount();
});
@@ -49,86 +41,15 @@ describe('', () => {
describeConformance(
{}} page={0} rowsPerPage={1} />,
() => ({
+ classes,
+ inheritComponent: TableCell,
mount: mountInTable,
- only: ['refForwarding'],
refInstanceof: window.HTMLTableCellElement,
+ // can only use `td` in a tr so we just fake a different component
+ testComponentPropWith: props => | ,
}),
);
- it('should render a TableCell', () => {
- const wrapper = mount(
- ,
- );
- assert.strictEqual(wrapper.find(TableCell).hasClass(classes.root), true);
- });
-
- it('should spread custom props on the root node', () => {
- const wrapper = shallow(
- ,
- );
- assert.strictEqual(
- wrapper.props()['data-my-prop'],
- 'woofTablePagination',
- 'custom prop should be woofTablePagination',
- );
- });
-
- describe('prop: component', () => {
- it('should render a TableCell by default', () => {
- const wrapper = mount(
- ,
- );
- assert.strictEqual(wrapper.find(TableCell).hasClass(classes.root), true);
- assert.notStrictEqual(wrapper.find('td').props().colSpan, undefined);
- });
-
- it('should be able to use outside of the table', () => {
- const wrapper = mount(
- ,
- );
- assert.strictEqual(findOutermostIntrinsic(wrapper).name(), 'div');
- assert.strictEqual(wrapper.props().colSpan, undefined);
- });
- });
-
describe('mount', () => {
it('should use the labelDisplayedRows callback', () => {
let labelDisplayedRowsCalled = false;
diff --git a/packages/material-ui/src/Zoom/Zoom.test.js b/packages/material-ui/src/Zoom/Zoom.test.js
index d84f4cb7f3a96b..877751f25fe981 100644
--- a/packages/material-ui/src/Zoom/Zoom.test.js
+++ b/packages/material-ui/src/Zoom/Zoom.test.js
@@ -1,7 +1,7 @@
import React from 'react';
import { assert } from 'chai';
import { spy } from 'sinon';
-import { createMount } from '@material-ui/core/test-utils';
+import { createMount, describeConformance } from '@material-ui/core/test-utils';
import Zoom from './Zoom';
describe('', () => {
@@ -19,10 +19,18 @@ describe('', () => {
mount.cleanUp();
});
- it('should render a Transition', () => {
- const wrapper = mount();
- assert.strictEqual(wrapper.find('Transition').exists(), true);
- });
+ describeConformance(
+
+
+ ,
+ () => ({
+ classes: {},
+ inheritComponent: 'Transition',
+ mount,
+ skip: ['refForwarding'],
+ testComponentPropWith: false,
+ }),
+ );
describe('event callbacks', () => {
describe('entering', () => {
diff --git a/packages/material-ui/src/test-utils/describeConformance.js b/packages/material-ui/src/test-utils/describeConformance.js
index 0366cf28134189..0d1c71e596ac79 100644
--- a/packages/material-ui/src/test-utils/describeConformance.js
+++ b/packages/material-ui/src/test-utils/describeConformance.js
@@ -1,21 +1,31 @@
import { assert } from 'chai';
import React from 'react';
+import findOutermostIntrinsic from './findOutermostIntrinsic';
import testRef from './testRef';
/**
* Glossary
* - root component:
- * - has the `root` class
+ * - renders the outermost host component
+ * - has the `root` class if the component has one
* - excess props are spread to this component
* - has the type of `inheritComponent`
*/
-function findRootComponent(wrapper, { classes, component }) {
- /**
- * We look for the component that is `inheritComponent` and `.rootClassName`
- * Using find().find().first() is not equivalent since `find` searches deep
- */
- return wrapper.find(component).filter(`.${classes.root}`);
+/**
+ * Returns the component with the same constructor as `component` that renders
+ * the outermost host
+ *
+ * @param {import('enzyme').ReactWrapper} wrapper
+ * @param {object} options
+ * @param {import('react').ElementType} component
+ */
+function findRootComponent(wrapper, { component }) {
+ const outermostHostElement = findOutermostIntrinsic(wrapper).getElement();
+
+ return wrapper.find(component).filterWhere(componentWrapper => {
+ return componentWrapper.contains(outermostHostElement);
+ });
}
function randomStringValue() {
@@ -33,13 +43,16 @@ function randomStringValue() {
*/
function testClassName(element, getOptions) {
it('applies the className to the root component', () => {
- const { classes, inheritComponent, mount } = getOptions();
+ const { mount } = getOptions();
const className = randomStringValue();
const wrapper = mount(React.cloneElement(element, { className }));
- const root = findRootComponent(wrapper, { classes, component: inheritComponent });
- assert.strictEqual(root.hasClass(className), true, 'does have a custom `className`');
+ assert.strictEqual(
+ findOutermostIntrinsic(wrapper).hasClass(className),
+ true,
+ 'does have a custom `className`',
+ );
});
}
@@ -107,11 +120,35 @@ function describeRef(element, getOptions) {
});
}
+/**
+ * Tests that the root component has the root class
+ *
+ * @param {React.ReactElement} element
+ * @param {() => ConformanceOptions} getOptions
+ */
+function testRootClass(element, getOptions) {
+ it('applies to root class to the root component if it has this class', () => {
+ const { classes, mount } = getOptions();
+ if (classes.root == null) {
+ return;
+ }
+
+ const wrapper = mount(element);
+
+ // we established that the root component renders the outermost host previously. We immediately
+ // jump to the host component because some components pass the `root` class
+ // to the `classes` prop of the root component.
+ // https://github.com/mui-org/material-ui/blob/f9896bcd129a1209153106296b3d2487547ba205/packages/material-ui/src/OutlinedInput/OutlinedInput.js#L101
+ assert.strictEqual(findOutermostIntrinsic(wrapper).hasClass(classes.root), true);
+ });
+}
+
const fullSuite = {
- class: testClassName,
componentProp: testComponentProp,
+ mergeClassName: testClassName,
propsSpread: testPropsSpread,
refForwarding: describeRef,
+ rootClass: testRootClass,
};
/**