search

styled-components / jest-styled-components

🔧 💅 Jest utilities for Styled Components
MIT License
1.58k stars 144 forks source link

Child component className value regression from 7.0.7 to 7.0.8 #405

Open dcaldastp opened 2 years ago

dcaldastp commented 2 years ago

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

GiancarlosIO commented 2 years ago

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

dcaldastp commented 2 years ago

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

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