I cant get this to work for any sites (sandbox included)

[laurencefass]

ive set up a simple codesandbox to demonstrate a simple configuration:

https://codesandbox.io/s/iframe-resizer-react-nnky7

the IframeResizerComponent is not resizing to the src. Is there any additional configuration required beyond the simple case?

Does the iframe src need to contain code to work with iframeresizer?

If you have this working please can you look at the sandbox and advise what I have done wrong?

Thanks

[laurencefass]

Here is another example I picked randomly from google with the same problem.

https://codesandbox.io/s/hardcore-mclean-nsqe6?file=/src/index.js

Has the module or underlying API broken somewhere?

[neerajPortalwiz]

I'm also having the same issue, and the above code sandbox URL is not working.

[AlbinoGeek]

+1 does not work (tested with: YouTube Video)

/** @type {import('unified').Plugin<[], import('mdast').Root>} */
// eslint-disable-next-line react/prop-types
function YouTubeVideo({ id, children }: { id: string, children: ReactNode }) {
  return <IframeResizer
    src={`https://www.youtube.com/embed/${id}?modestbranding=1&rel=0`}
    log
    // minHeight required, because IframeResizer does not work atm
    style={{ width: '1px', minWidth: '100%', minHeight: '45vw' }}
    allow="accelerometer; autoplay; clipboard-write; gyroscope; picture-in-picture; encrypted-media"
    allowFullScreen
    frameBorder="0"
    checkOrigin={false}
    title="YouTube Video"
  >
    {children}
  </IframeResizer>
}

[yoDon]

Check if your inner page has a script tag to cause it to load the iframeResizer.contentWindow.js - if the inner page isn't loading that script, this react component wont work.

As I understand it, to use this react component, you have to be the author of the inner page so you can add that script to the inner page. The react component in the outer page is not able to automatically load the script into the the inner page, so you the author of the inner page have to do it manually in the inner page.

See, for example, the sample inner page in the example in this repo:

https://github.com/davidjbradshaw/iframe-resizer-react/blob/master/example/public/html/frame.content.html