From af8fe149295c35c147a7d2a3ec6cac91da2c35b9 Mon Sep 17 00:00:00 2001 From: Oyinda David Date: Mon, 17 May 2021 15:46:28 +0100 Subject: [PATCH 1/5] fix for #26338 --- .../material-ui-styled-engine-sc/src/index.js | 3 ++- .../src/styled.test.js | 17 ++++++++++++++++- 2 files changed, 18 insertions(+), 2 deletions(-) diff --git a/packages/material-ui-styled-engine-sc/src/index.js b/packages/material-ui-styled-engine-sc/src/index.js index 871b5318d652c0..a8ea20c6b02fe4 100644 --- a/packages/material-ui-styled-engine-sc/src/index.js +++ b/packages/material-ui-styled-engine-sc/src/index.js @@ -8,9 +8,10 @@ export default function styled(tag, options) { displayName: options.label, shouldForwardProp: options.shouldForwardProp, }); + } else { + stylesFactory = scStyled(tag); } - stylesFactory = scStyled(tag); if (process.env.NODE_ENV !== 'production') { return (...styles) => { diff --git a/packages/material-ui-styled-engine-sc/src/styled.test.js b/packages/material-ui-styled-engine-sc/src/styled.test.js index 87d0bc2bfdb67a..cab9fa22b5490a 100644 --- a/packages/material-ui-styled-engine-sc/src/styled.test.js +++ b/packages/material-ui-styled-engine-sc/src/styled.test.js @@ -1,7 +1,10 @@ import { expect } from 'chai'; -import styled from './index'; +import { createClientRender } from 'test/utils'; +import styled from '@material-ui/styled-engine-sc'; describe('styled', () => { + const render = createClientRender(); + it('should help debug wrong args', () => { expect(() => { expect(() => { @@ -23,4 +26,16 @@ describe('styled', () => { 'Material-UI: the styled("span")(...args) API requires all its args to be defined', ); }); + + it('should respect the options', () => { + const StyledComponent = styled('div', { + shouldForwardProp: prop => prop !== 'color', + label: 'TestComponent', + })({ color: 'red' }); + + const { container } = render(); + expect(container.firstChild).not.to.have.attribute('color'); + expect(container.querySelector('[class^=TestComponent]')).to.not.equal(null); + }); + }); From 2f1dcb0341a970977e446b6dd64020fbe179c43c Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Mon, 17 May 2021 17:10:14 +0200 Subject: [PATCH 2/5] Update packages/material-ui-styled-engine-sc/src/styled.test.js --- .../src/styled.test.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/material-ui-styled-engine-sc/src/styled.test.js b/packages/material-ui-styled-engine-sc/src/styled.test.js index cab9fa22b5490a..c03c1876c267d3 100644 --- a/packages/material-ui-styled-engine-sc/src/styled.test.js +++ b/packages/material-ui-styled-engine-sc/src/styled.test.js @@ -28,14 +28,14 @@ describe('styled', () => { }); it('should respect the options', () => { - const StyledComponent = styled('div', { - shouldForwardProp: prop => prop !== 'color', - label: 'TestComponent', - })({ color: 'red' }); - - const { container } = render(); - expect(container.firstChild).not.to.have.attribute('color'); - expect(container.querySelector('[class^=TestComponent]')).to.not.equal(null); - }); + const StyledComponent = styled('div', { + shouldForwardProp: prop => prop !== 'color', + label: 'TestComponent', + })({ color: 'red' }); + + const { container } = render(); + expect(container.firstChild).not.to.have.attribute('color'); + expect(container.querySelector('[class^=TestComponent]')).to.not.equal(null); + }); }); From 98d27bf2d3e851bc01ce72b82367cb815e521b7c Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Mon, 17 May 2021 17:14:38 +0200 Subject: [PATCH 3/5] prettier --- packages/material-ui-styled-engine-sc/src/index.js | 1 - packages/material-ui-styled-engine-sc/src/styled.test.js | 3 +-- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/material-ui-styled-engine-sc/src/index.js b/packages/material-ui-styled-engine-sc/src/index.js index a8ea20c6b02fe4..8504ceb156558b 100644 --- a/packages/material-ui-styled-engine-sc/src/index.js +++ b/packages/material-ui-styled-engine-sc/src/index.js @@ -12,7 +12,6 @@ export default function styled(tag, options) { stylesFactory = scStyled(tag); } - if (process.env.NODE_ENV !== 'production') { return (...styles) => { const component = typeof tag === 'string' ? `"${tag}"` : 'component'; diff --git a/packages/material-ui-styled-engine-sc/src/styled.test.js b/packages/material-ui-styled-engine-sc/src/styled.test.js index c03c1876c267d3..18fe1b11d48884 100644 --- a/packages/material-ui-styled-engine-sc/src/styled.test.js +++ b/packages/material-ui-styled-engine-sc/src/styled.test.js @@ -29,7 +29,7 @@ describe('styled', () => { it('should respect the options', () => { const StyledComponent = styled('div', { - shouldForwardProp: prop => prop !== 'color', + shouldForwardProp: (prop) => prop !== 'color', label: 'TestComponent', })({ color: 'red' }); @@ -37,5 +37,4 @@ describe('styled', () => { expect(container.firstChild).not.to.have.attribute('color'); expect(container.querySelector('[class^=TestComponent]')).to.not.equal(null); }); - }); From 1de5ee3dea8aefbc8cfbd7a8cbcfe62deb48c813 Mon Sep 17 00:00:00 2001 From: Marija Najdova Date: Mon, 17 May 2021 17:33:25 +0200 Subject: [PATCH 4/5] test update --- packages/material-ui-styled-engine-sc/src/styled.test.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/material-ui-styled-engine-sc/src/styled.test.js b/packages/material-ui-styled-engine-sc/src/styled.test.js index 18fe1b11d48884..993cd59601e943 100644 --- a/packages/material-ui-styled-engine-sc/src/styled.test.js +++ b/packages/material-ui-styled-engine-sc/src/styled.test.js @@ -1,3 +1,4 @@ +import * as React from 'react'; import { expect } from 'chai'; import { createClientRender } from 'test/utils'; import styled from '@material-ui/styled-engine-sc'; From f7917f972bdfbfef353520f6fca47e1e86ba6e21 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 17 May 2021 21:21:45 +0200 Subject: [PATCH 5/5] avoid to split the infinitive --- packages/material-ui-styled-engine-sc/src/styled.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/material-ui-styled-engine-sc/src/styled.test.js b/packages/material-ui-styled-engine-sc/src/styled.test.js index 993cd59601e943..878efeb07d0b9b 100644 --- a/packages/material-ui-styled-engine-sc/src/styled.test.js +++ b/packages/material-ui-styled-engine-sc/src/styled.test.js @@ -36,6 +36,6 @@ describe('styled', () => { const { container } = render(); expect(container.firstChild).not.to.have.attribute('color'); - expect(container.querySelector('[class^=TestComponent]')).to.not.equal(null); + expect(container.querySelector('[class^=TestComponent]')).not.to.equal(null); }); });