App.spec.jsのテストでエラー発生

[siida36]

実行環境

• front, backともに最新の状態

発生したエラー

>>> yarn run cy:run-ct
yarn run v1.22.15
$ cypress run-ct
[@cypress/webpack-dev-server]: removing HtmlWebpackPlugin from configuration.
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme

====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:        9.7.0                                                                          │
  │ Browser:        Electron 100 (headless)                                                        │
  │ Node Version:   v16.13.1 (/usr/local/bin/node)                                                 │
  │ Specs:          1 found (components/App/App.spec.js)                                           │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘

────────────────────────────────────────────────────────────────────────────────────────────────────

  Running:  components/App/App.spec.js                                                      (1 of 1)
webpack compiled successfully

  App
    ✓ renders sauna marker (598ms)
    1) renders marker popup

  App render an alert when backend geocoding returns not found
    ✓ renders not found popup (876ms)

  2 passing (6s)
  1 failing

  1) App
       renders marker popup:
     CypressError: Timed out retrying after 4050ms: `cy.click()` failed because the center of this element is hidden from view:

`<button class="MuiButton-root MuiButton-contained MuiButton-containedInfo MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButtonBase-root  css-1jery5v-MuiButtonBase-root-MuiButton-root" tabindex="0" type="button" style="font-size: 10px; color: black;">...</button>`

Fix this problem, or use `{force: true}` to disable error checking.

https://on.cypress.io/element-cannot-be-interacted-with
      at $Cy.ensureDescendents (http://localhost:8080/__cypress/runner/cypress_runner.js:186043:76)
      at ensureDescendents (http://localhost:8080/__cypress/runner/cypress_runner.js:171524:8)
      at ensureDescendentsAndScroll (http://localhost:8080/__cypress/runner/cypress_runner.js:171531:14)
      at ensureElIsNotCovered (http://localhost:8080/__cypress/runner/cypress_runner.js:171663:5)
      at runAllChecks (http://localhost:8080/__cypress/runner/cypress_runner.js:171853:52)
      at retryActionability (http://localhost:8080/__cypress/runner/cypress_runner.js:171877:16)
      at tryCatcher (http://localhost:8080/__cypress/runner/cypress_runner.js:26302:23)
      at Function.Promise.attempt.Promise.try (http://localhost:8080/__cypress/runner/cypress_runner.js:23576:29)
      at whenStable (http://localhost:8080/__cypress/runner/cypress_runner.js:190957:65)
      at http://localhost:8080/__cypress/runner/cypress_runner.js:190412:14
      at tryCatcher (http://localhost:8080/__cypress/runner/cypress_runner.js:26302:23)
      at Promise._settlePromiseFromHandler (http://localhost:8080/__cypress/runner/cypress_runner.js:24237:31)
      at Promise._settlePromise (http://localhost:8080/__cypress/runner/cypress_runner.js:24294:18)
      at Promise._settlePromise0 (http://localhost:8080/__cypress/runner/cypress_runner.js:24339:10)
      at Promise._settlePromises (http://localhost:8080/__cypress/runner/cypress_runner.js:24419:18)
      at Promise._fulfill (http://localhost:8080/__cypress/runner/cypress_runner.js:24363:18)
  From Your Spec Code:
      at $Chainer.<computed> [as click] (http://localhost:8080/__cypress/runner/cypress_runner.js:193925:176)
      at http://localhost:8080/__cypress/src/static/js/spec-0.chunk.js:331:38
  at Array.forEach (<anonymous>)
      at Context.<anonymous> (http://localhost:8080/__cypress/src/static/js/spec-0.chunk.js:330:12)
      at Context.runnable.fn (http://localhost:8080/__cypress/runner/cypress_runner.js:195826:19)
      at callFn (http://localhost:8080/__cypress/runner/cypress_runner.js:146613:21)
      at Test.../driver/node_modules/mocha/lib/runnable.js.Runnable.run (http://localhost:8080/__cypress/runner/cypress_runner.js:146600:7)
      at http://localhost:8080/__cypress/runner/cypress_runner.js:202908:30
      at PassThroughHandlerContext.finallyHandler (http://localhost:8080/__cypress/runner/cypress_runner.js:22856:23)

  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        3                                                                                │
  │ Passing:      2                                                                                │
  │ Failing:      1                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  1                                                                                │
  │ Video:        true                                                                             │
  │ Duration:     6 seconds                                                                        │
  │ Spec Ran:     components/App/App.spec.js                                                       │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘

  (Screenshots)

  -  /Users/shohei_iida/ascetic/smart-sauna-map-front/cypress/screenshots/components/     (1280x720)
     App/App.spec.js/App -- renders marker popup (failed).png

====================================================================================================

  (Run Finished)

       Spec                                              Tests  Passing  Failing  Pending  Skipped
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ ✖  components/App/App.spec.js               00:06        3        2        1        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    ✖  1 of 1 failed (100%)                     00:06        3        2        1        -        -

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[siida36]

さきほどCopyrightのテストを修正していたらなぜか通りました。わからん。。。

>>> yarn run cy:run-ct
yarn run v1.22.15
$ cypress run-ct
[@cypress/webpack-dev-server]: removing HtmlWebpackPlugin from configuration.
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme

====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:        9.7.0                                                                          │
  │ Browser:        Electron 100 (headless)                                                        │
  │ Node Version:   v16.13.1 (/usr/local/bin/node)                                                 │
  │ Specs:          1 found (components/App/App.spec.js)                                           │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘

────────────────────────────────────────────────────────────────────────────────────────────────────

  Running:  components/App/App.spec.js                                                      (1 of 1)
webpack compiled successfully

  App
    ✓ renders sauna marker (668ms)
    ✓ renders marker popup (1329ms)

  App render an alert when backend geocoding returns not found
    ✓ renders not found popup (783ms)

  Copyright
    ✓ should display the correct copyright (79ms)

  4 passing (3s)

  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        4                                                                                │
  │ Passing:      4                                                                                │
  │ Failing:      0                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  0                                                                                │
  │ Video:        true                                                                             │
  │ Duration:     2 seconds                                                                        │
  │ Spec Ran:     components/App/App.spec.js                                                       │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘

====================================================================================================

  (Run Finished)

       Spec                                              Tests  Passing  Failing  Pending  Skipped
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ ✔  components/App/App.spec.js               00:02        4        4        -        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    ✔  All specs passed!                        00:02        4        4        -        -        -

✨  Done in 13.20s.

[siida36]

コードを一切変更せずに連打していてもテストに通る時とエラーが発生する時の２パターンに遭遇します。 タイムアウトの秒数を長めに持てばエラーが発生しないかもしれません。