Тесты моментальных снимков с использованием Styled-Components не выполняются в конвейере CI из-за другого индекса класса

Question

Я использую react-testing-library и jest-styled-components для выполнения тестов снимков. Раньше он работал нормально, но теперь тесты моментальных снимков многих компонентов не выполняются в конвейере CI (Gitlab) только из-за другого индекса в заполненных именах хешированных классов, генерируемых jest-styled-components:

   - Snapshot
+ Received

@@ -1,19 +1,19 @@
- .c4 {
+ .c3 {
    font-size: 14px;
    height: 14px;
    min-height: 14px;
    min-width: 14px;
    width: 14px;
  }

- .c4 > svg {
+ .c3 > svg {
    fill: currentColor;
    pointer-events: none;
  }

- .c4 > svg * {
+ .c3 > 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;
  }

  <div>
    <div
@@ -49,11 +49,11 @@
            placeholder="Select date"
            readonly=""
            value=""
          />
          <div
-           class="ant-calendar-picker-icon c3 c4"
+           class="c3 c4 ant-calendar-picker-icon"
            data-testid="icon_arrowDown"
            size="14"
          >
            <file-mock />
          </div>

  21 |   it('renders correctly', () => {
  22 |     const { container } = renderWithProps()
> 23 |     expect(container).toMatchSnapshot()
     |                       ^
  24 |   })
  25 | })
  26 | 

При локальном запуске тестов проблем нет.

Кто-нибудь имеет представление о том, что происходит не так?

Answer 1

Убедиться, что одни и те же версии пакетов используются локально и в CI решили это.

После удаления node_modules и выполнения той же команды установки, что и в CI, выполнение тестов локально изменило снимки. Я обновил снимки, зафиксировал и передал изменения, и конвейер успешно запустился.