title: Snapshot tests with Styled-Components fail in the CI pipeline due to different class index
body: <p>I am using <code>react-testing-library</code> and <code>jest-styled-components</code> to do snapshot tests. It has been working fine before but now the snapshot tests of many components are failing in the CI pipeline (Gitlab) just because of a different index in the hashed class name placeholders generated by <code>jest-styled-components</code>:</p>
  
  <pre><code>   - Snapshot
  + Received
  
  @@ -1,19 +1,19 @@
  - .c4 {
  + .c3 {
      font-size: 14px;
      height: 14px;
      min-height: 14px;
      min-width: 14px;
      width: 14px;
    }
  
  - .c4 &gt; svg {
  + .c3 &gt; svg {
      fill: currentColor;
      pointer-events: none;
    }
  
  - .c4 &gt; svg * {
  + .c3 &gt; svg * {
      height: 100%;
      width: 100%;
    }
  
    .c2 .ant-calendar-picker-input.ant-input {
  @@ -26,15 +26,15 @@
  
    .c0 {
      position: relative;
    }
  
  - .c3 {
  + .c4 {
      color: #00293a;
    }
  
  - .c1 .c3 {
  + .c1 .c4 {
      color: #00293a;
    }
  
    &lt;div&gt;
      &lt;div
  @@ -49,11 +49,11 @@
              placeholder="Select date"
              readonly=""
              value=""
            /&gt;
            &lt;div
  -           class="ant-calendar-picker-icon c3 c4"
  +           class="c3 c4 ant-calendar-picker-icon"
              data-testid="icon_arrowDown"
              size="14"
            &gt;
              &lt;file-mock /&gt;
            &lt;/div&gt;
  
    21 |   it('renders correctly', () =&gt; {
    22 |     const { container } = renderWithProps()
  &gt; 23 |     expect(container).toMatchSnapshot()
       |                       ^
    24 |   })
    25 | })
    26 | 
  </code></pre>
  
  <p>When running the tests locally, there is no problem. </p>
  
  <p>Does someone have an idea about what is going wrong?</p>