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

[#77] Finally drop use of findDOMNode() #710

Merged
merged 1 commit into from
Jun 10, 2022
Merged

Conversation

stefcameron
Copy link
Member

Fixes #77
Fixes #704

For the longest time, since before I took over, we were filtering
specified containers through ReactDOM.findDOMNode(), but why?

The configured trap containers (via the containerElements prop)
must be elements already, which means they must already be rendered,
which means there's no point in passing them through findDOMNode()
to find an underlying DOM element because they aren't React elements
in the first place.

The removal of this call should mean that React Strict Mode will
finally be OK with focus-trap-react.

Note it's still possible to render a focus trap with a single React
element child. That works fine, and never needed findDOMNode()
anyway. We were already using a callback ref to get its element
to then auto-configure that element as the single container for
the focus trap.

Just to be sure, however, this will be released as a new major
version.

PR Checklist

Please leave this checklist in your PR.

  • Issue being fixed is referenced.
  • Source changes maintain:
    • Stated browser compatibility.
    • Stated React compatibility.
  • Unit test coverage added/updated.
  • E2E test coverage added/updated.
  • Prop-types added/updated.
  • Typings added/updated.
  • Changes do not break SSR:
    • Careful to test typeof document/window !== 'undefined' before using it in code that gets executed on load.
  • README updated (API changes, instructions, etc.).
  • Changes to dependencies explained.
  • Changeset added (run yarn changeset locally to add one, and follow the prompts).
    • EXCEPTION: A Changeset is not required if the change does not affect any of the source files that produce the package bundle. For example, demo changes, tooling changes, test updates, or a new dev-only dependency to run tests more efficiently should not have a Changeset since it will not affect package consumers.

Fixes #77
Fixes #704

For the longest time, since before I took over, we were filtering
specified containers through `ReactDOM.findDOMNode()`, but why?

The configured trap containers (via the `containerElements` prop)
 must be elements already, which means they must already be rendered,
which means there's no point in passing them through `findDOMNode()`
to find an underlying DOM element because they aren't React elements
in the first place.

The removal of this call should mean that React Strict Mode will
finally be OK with focus-trap-react.

Note it's still possible to render a focus trap with a single React
element child. That works fine, and never needed `findDOMNode()`
anyway. We were already using a callback ref to get its element
to then auto-configure that element as the single container for
the focus trap.

Just to be sure, however, this will be released as a new __major__
version.
@changeset-bot
Copy link

changeset-bot bot commented Jun 10, 2022

🦋 Changeset detected

Latest commit: 4e6929c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
focus-trap-react Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@codecov
Copy link

codecov bot commented Jun 10, 2022

Codecov Report

Merging #710 (4e6929c) into master (9947461) will decrease coverage by 0.09%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master     #710      +/-   ##
==========================================
- Coverage   92.76%   92.66%   -0.10%     
==========================================
  Files           1        1              
  Lines         152      150       -2     
  Branches       65       65              
==========================================
- Hits          141      139       -2     
  Misses         11       11              
Impacted Files Coverage Δ
src/focus-trap-react.js 92.66% <100.00%> (-0.10%) ⬇️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 9947461...4e6929c. Read the comment docs.

@stefcameron stefcameron merged commit 4a77d87 into master Jun 10, 2022
@stefcameron stefcameron deleted the find-dom-node branch June 10, 2022 00:11
@stefcameron stefcameron mentioned this pull request Sep 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
1 participant