search

styled-components / styled-components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
https://styled-components.com
MIT License
40.11k stars 2.48k forks source link

Jest test fail on upgrading the styled-components lib version from 5.3.1 to 6.1.8 #4273

Open priyapwr7 opened 2 months ago

priyapwr7 commented 2 months ago

Hi All,

When I updated the styled-components library version from 5.3.1 to 6.1.8 , the jest test fail with error as mentioned below:

TypeError: p.compile is not a function

  36 |   };
  37 |   return {
> 38 |     ...rtlRender(ui, {
     |                 ^
  39 |       wrapper: AllTheProviders,
  40 |       queries: {
  41 |         ...queries,

  at d (node_modules/styled-components/dist/styled-components.cjs.js:453:13)
  at e.generateAndInjectStyles (node_modules/styled-components/dist/styled-components.cjs.js:600:85)
  at node_modules/styled-components/dist/styled-components.cjs.js:668:17
  at node_modules/styled-components/dist/styled-components.cjs.js:670:8
  at I (node_modules/styled-components/dist/styled-components.cjs.js:674:6)
  at renderWithHooks (node_modules/react-dom/cjs/react-dom.development.js:2719:157)

I have used the lib here:

import styled from 'styled-components';

export const CustomDatePicker = styled(Button)` && { margin-left: 1%; }

the jestconfig file has below properties set:

testPathIgnorePatterns: ['/node_modules/'], transformIgnorePatterns: ['/node_modules/(?!(@ui5|lit-html|d3|internmap)).*\.js$'], moduleNameMapper: { '\.(css|less)$': 'identity-obj-proxy', 'axios': "axios/dist/node/axios.cjs", }, moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx'], setupFilesAfterEnv: ['core-js', '/jestSetup.js'], moduleDirectories: ['/node_modules', '/src'],

The app runs fine but jest tests fail Please let me know how to solve this issue.