jest-styled-components

jest-styled-components copied to clipboard

It seems like the spaces are not ignored in colour which is making this test fail. It seems similar to Issue https://github.com/styled-components/jest-styled-components/issues/89

I have tried below

it("should pass but it fails", () => {
  const Wrapper = styled.i`
    > svg {
      fill: rgb(185, 185, 185);
    }
  }
  `
  const Svg = styled.svg``

  const tree = renderer
    .create(
      <Wrapper>
        <Svg />
      </Wrapper>,
    )
    .toJSON()
  expect(tree).toHaveStyleRule("fill", "rgb(185, 185, 185)", { modifier: `> svg` })
})

but it returns with an error

Value mismatch for property 'fill'

    Expected
      "fill: rgb(185, 185, 185)"
    Received:
      "fill: rgb(185,185,185)"

I have facing this false positive as well. One way to get around of it is removing the spaces, like:

  expect(tree).toHaveStyleRule("fill", "rgb(185,185,185)", { modifier: `> svg` })