Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix flakey ProfileModal tests #6613

Merged
merged 1 commit into from
Oct 14, 2024
Merged

Conversation

robertknight
Copy link
Member

@robertknight robertknight commented Oct 14, 2024

The ProfileModal tests would sometimes fail with this error:

FAILED TESTS:
  ✖ "after each" hook for "shows modal on "openProfile" event"
    Chrome Headless 129.0.0.0 (Linux x86_64)
  Error: Failed to execute 'showModal' on 'HTMLDialogElement': The element is not in a Document.

The HTMLDialogElement.showModal call happens in an effect when the ModalDialog component is rendered with the isClosed prop set to false. In the ProfileModal tests, the component was rendered in a disconnected DOM node, so this error should have happened on every run. However the emitter.publish("openProfile") call which triggered this render was not wrapped in act and so the effect which calls showModal was scheduled, but often did not actually run before the component was unmounted in the afterEach hook.

Fix the issue by:

  • Wrapping all emitter.publish("openProfile") calls in act, so they synchronously execute the effect.
  • Rendering the ProfileModal component in a connected DOM container which is removed after the test runs. This is what actually fixes the error shown above.
  • For consistency, update the NotebookModal tests to work in the same way as the ProfileModal tests, with a single container element which is removed at the end of the test

The ProfileModal tests would sometimes fail with this error:

```
FAILED TESTS:
  ✖ "after each" hook for "shows modal on "openProfile" event"
    Chrome Headless 129.0.0.0 (Linux x86_64)
  Error: Failed to execute 'showModal' on 'HTMLDialogElement': The element is not in a Document.
```

The `HTMLDialogElement.showModal` call happens in an effect when the
`ModalDialog` component is rendered with the `isClosed` prop set to false. In
the ProfileModal tests, the component was rendered in a disconnected DOM node,
so this error should have happened on every run. However the
`emitter.publish("openProfile")` call which triggered this render was not
wrapped in `act` and so the effect which calls `showModal` was scheduled, but
often did not actually run before the component was unmounted in the `afterEach`
hook.

Fix the issue by:

 - Wrapping all `emitter.publish("openProfile")` calls in `act`, so they
   synchronously execute the effect.
 - Rendering the `ProfileModal` component in a connected DOM container
   which is removed after the test runs
 - For consistency, update the `NotebookModal` tests to work in the same
   way as the ProfileModal tests, with a single container element which
   is removed at the end of the test
Copy link

codecov bot commented Oct 14, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 99.42%. Comparing base (7fdab18) to head (85421f1).
Report is 9 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #6613   +/-   ##
=======================================
  Coverage   99.42%   99.42%           
=======================================
  Files         270      270           
  Lines       10175    10175           
  Branches     2419     2419           
=======================================
  Hits        10117    10117           
  Misses         58       58           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@robertknight robertknight merged commit 0340a9f into main Oct 14, 2024
4 checks passed
@robertknight robertknight deleted the fix-flakey-profile-modal-test branch October 14, 2024 14:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants