diff --git a/packages/material-ui-styles/src/makeStyles/makeStyles.test.js b/packages/material-ui-styles/src/makeStyles/makeStyles.test.js
index 64bf12710e41d1..be2b0740e2d6f5 100644
--- a/packages/material-ui-styles/src/makeStyles/makeStyles.test.js
+++ b/packages/material-ui-styles/src/makeStyles/makeStyles.test.js
@@ -244,45 +244,80 @@ describe('makeStyles', () => {
assert.deepEqual(sheetsRegistry.registry[0].classes, { root: 'MuiTextField-root' });
});
- it('should support the overrides key', () => {
- const useStyles = makeStyles(
- {
- root: {
- padding: 8,
- margin: [1, 3],
+ describe('overrides', () => {
+ it('should support the overrides key', () => {
+ const useStyles = makeStyles(
+ {
+ root: {
+ padding: 8,
+ margin: [1, 3],
+ },
},
- },
- {
- name: 'MuiTextField',
- },
- );
- const StyledComponent = () => {
- useStyles();
- return
;
- };
-
- mount(
- {
+ useStyles();
+ return ;
+ };
+
+ mount(
+
+
+
+
+ ,
+ );
+
+ assert.strictEqual(sheetsRegistry.registry.length, 1);
+ assert.deepEqual(sheetsRegistry.registry[0].rules.raw, {
+ root: { padding: 9, margin: [2, 2, 3] },
+ });
+ });
+
+ it('can be used to remove styles', () => {
+ const theme = {
+ overrides: {
+ Test: {
+ root: {
+ margin: null,
+ },
},
- })}
- >
-
-
-
- ,
- );
+ },
+ };
- assert.strictEqual(sheetsRegistry.registry.length, 1);
- assert.deepEqual(sheetsRegistry.registry[0].rules.raw, {
- root: { padding: 9, margin: [2, 2, 3] },
+ const useStyles = makeStyles({ root: { margin: 5, padding: 3 } }, { name: 'Test' });
+ function Test() {
+ const classes = useStyles();
+ return ;
+ }
+
+ const wrapper = mount(
+
+
+
+
+ ,
+ );
+
+ const div = wrapper.find('div').instance();
+
+ assert.strictEqual(sheetsRegistry.registry.length, 1);
+ assert.deepEqual(sheetsRegistry.registry[0].rules.raw, {
+ root: { margin: null, padding: 3 },
+ });
});
});