Open
Description
dom-testing-library
version: 5.11.9react-testing-library
version: 11.2.5
Relevant code or config:
Problem Statement:
I was trying to test the styling of some components (applied via Material UI styling solution) and it seems that toHaveStyle
doesn't work properly. The component style is computed/rendered properly in the web dom, the TabeHead cells styles show up as:
color: #fff;
background-color: #000;
But when using Testing library...
expect(screen.getByText("Calories")).toHaveStyle(`color: #FFF`);
It throws the following error: Expected - color: rgb(255, 255, 255); + color: rgba(0, 0, 0, 0.87);
rgba(0, 0, 0, 0.87)
is doesn't match with hex #FFF
At the same time this weirdly works with background-color.
Please check the code sandbox for more context, if you need further explanation let me know and Im happy to help 😃