diff --git a/packages/material-ui/src/Box/Box.test.js b/packages/material-ui/src/Box/Box.test.js
index b30637bf6e3e27..c7f605772ceea8 100644
--- a/packages/material-ui/src/Box/Box.test.js
+++ b/packages/material-ui/src/Box/Box.test.js
@@ -1,12 +1,13 @@
import * as React from 'react';
-import { assert } from 'chai';
+import { expect } from 'chai';
+import { createClientRender } from 'test/utils/createClientRender';
import { createMount } from '@material-ui/core/test-utils';
import describeConformance from '@material-ui/core/test-utils/describeConformance';
import Box from './Box';
describe('', () => {
let mount;
-
+ const render = createClientRender();
before(() => {
mount = createMount({ strict: true });
});
@@ -21,22 +22,25 @@ describe('', () => {
refInstanceof: window.HTMLDivElement,
}));
- const testChildren =
Hello World
;
+ const testChildren = (
+
+ Hello World
+
+ );
it('renders children and box content', () => {
- const wrapper = mount(
+ const { container, getByTestId } = render(
{testChildren}
,
);
-
- assert.strictEqual(wrapper.contains(testChildren), true);
- assert.strictEqual(wrapper.find('span').length, 1);
+ expect(container.firstChild).contain(getByTestId('child'));
+ expect(container.querySelectorAll('span').length).to.equal(1);
});
it('does not forward style props as DOM attributes', () => {
const elementRef = React.createRef();
- mount(
+ render(
', () => {
);
const { current: element } = elementRef;
- assert.strictEqual(element.getAttribute('color'), null);
- assert.strictEqual(element.getAttribute('font-family'), null);
- assert.strictEqual(element.getAttribute('font-size'), null);
+ expect(element.getAttribute('color')).to.equal(null);
+ expect(element.getAttribute('font-family')).to.equal(null);
+ expect(element.getAttribute('font-size')).to.equal(null);
});
});