iframeResizer.js:132 [iFrameSizer][Host page: some-id] Ignored iFrame, already setup.

[jarodtaylor]

I'm getting the following warning whenever I update state in my component.

 [iFrameSizer][Host page: some-id] Ignored iFrame, already setup.

To reproduce this you can just have something like:

import React, { Component } from 'react';
import ReactIframeResizer from 'react-iframe-resizer-super';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showModal: false,
    };
  }

  toggleModal = () => {
    this.setState(prevState => {
      showModal: !prevState.showModal
    }
  }

  render() {
    const iframeResizerOptions = {
      checkOrigin: false
    };
    return (
      <div className="App">
           <ReactIframeResizer
              src="something.html"
              iframeResizerOptions={iframeResizerOptions}
              iframeResizerUrl={false}
              iframeResizerEnable={true}
            />
            <SomeModalComponent show={this.state.showModal} />
            <button onClick={this.toggleModal}>Show Modal</button>
      </div>
    );
  }
}

export default App;

Any thoughts on how I can silence this warning, or is there a better way of using this?

[khangiskhan]

I just looked at this, looks like it's because resizeIframe is called twice when the component is mounted: once in componentDidMount and again in componentWillReceiveProps.

Inside resizeIframe, it triggers the init function of the iframe-resizer library.

if (props.iframeResizerEnable) {
  iframeResizerLib(props.iframeResizerOptions, frame);
}

[dmason30]

@khangiskhan So is the fix to set a flag either in state or as a local variable to prevent it from being called twice?