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(mount): Handle multiple calls to componentDidMount #191

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

Conversation

brdlyptrs
Copy link
Collaborator

@brdlyptrs brdlyptrs commented Jun 27, 2023

Closes #189

Reason

It seems that componentDidMount is called multiple times when using functions like useNavigate, resulting in hCaptcha's render function to be called multiple times as well (see screenshot). A single hCaptcha element is only allowed to render once in an element, which results in the error outlined in the linked issue.

Note: This seems to be an issue with React.StrictMode as well, see StackOverflow

Result

Add check to validate hCaptcha has already been created to prevent calling hCaptcha.render again if a component already exists.

Evidence

image

@brdlyptrs brdlyptrs self-assigned this Jun 27, 2023
src/index.js Outdated Show resolved Hide resolved
@brdlyptrs brdlyptrs marked this pull request as ready for review June 27, 2023 21:26
@brdlyptrs brdlyptrs requested a review from a team as a code owner June 27, 2023 21:26
zoryana94
zoryana94 previously approved these changes Jun 28, 2023
Copy link
Contributor

@zoryana94 zoryana94 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall testing shows the console error is gone! 👍
I haven't encountered any breaking changes!

src/index.js Outdated Show resolved Hide resolved
@zoryana94
Copy link
Contributor

Re-tested it in multiple apps
The console error doesn't appear anymore

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.

Issue with react-router-dom and useNavigate()
3 participants