jest-styled-components icon indicating copy to clipboard operation
jest-styled-components copied to clipboard

Child component className value regression from 7.0.7 to 7.0.8

Open dcaldastp opened this issue 2 years ago • 2 comments

Before (7.0.7)

Snapshot testing renders properly the child component styled component generated className

<div
  className="Align-sc-__sc-4yw49j-0 IconRoot-sc-__sc-1eorqw0-0 TQsYT ckURgz"

After (7.0.8)

Mismatch in snapshots, missing Align-sc-__sc-4yw49j-0 IconRoot-sc-__sc-1eorqw0-0

<div
-   className="Align-sc-__sc-4yw49j-0 IconRoot-sc-__sc-1eorqw0-0 TQsYT ckURgz"
+   className="TQsYT ckURgz"
    color="#BBB"

Our target component has the following tree structure

CustomIconComponent
|
|__ IconComponent  ===> this icon component has a styled component Align and IconRoot, respective className is missing

Looking at the changeset it seems that the only change in the latest patch has only changes related to babel & className

Details

Node version: 14.18.2 jest-styled-components: 7.0.8 (7.0.7 works fine) styled-components: 5.2.1 jest: 27.5.1

dcaldastp avatar Mar 17 '22 15:03 dcaldastp

I'm getting the same error with the latest version 7.0.8. Our tests that use the toHaveStyle matcher are broken :(

giancarlosisasi avatar May 24 '22 22:05 giancarlosisasi

Hey @GiancarlosIO, if it helps, locking to "7.0.7", fixed our problem.

    "jest-styled-components": "7.0.7",

dcaldastp avatar May 25 '22 07:05 dcaldastp