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

Frame re-renders on each load event inside iframe #198

Open
igorbt opened this issue Aug 18, 2021 · 3 comments
Open

Frame re-renders on each load event inside iframe #198

igorbt opened this issue Aug 18, 2021 · 3 comments

Comments

@igorbt
Copy link

igorbt commented Aug 18, 2021

React bubble up to the Frame component (iframe) each load event that happen in elements rendered inside it, even if browsers normally would stop this at iframe border. This is why on each such load (for example image load) Frame->handleLoad is called and the unconditional setState there would re-render the Frame.
For now I'm using a workaround like this:

<Frame>
  <div onLoad={ev => ev.stopPropagation()}>{children}</div>
</Frame>

But it would be nice to have a fix in the library. For example at least:

  handleLoad = () => {
    if (!this.state.iframeLoaded) {
      this.setState({ iframeLoaded: true });
    }
  };

or, maybe checking that the event target is really the iframe.

@ryanseddon
Copy link
Owner

Wanna have a go at a PR seems like you know how to fix this, I would agree that checking the event target is the frame might be the better approach

@ryanseddon
Copy link
Owner

Wanna try v5.2.2-alpha.0 prerelease. The changes in their should fix this in theory.

@AnthonyCrowcroft
Copy link

I'm getting a weird error with the Frame Component causing rerenders outside of an act when testing and was curious if there is any known ongoing issues in this regard?

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

No branches or pull requests

3 participants