Fixed firefox iframe append issue

no issue

Firefox doesn't allow adding content to iframe body without passing `srcDoc={`<!DOCTYPE html>` to the iframe, this allows iframe to load properly
This commit is contained in:
Rish 2020-04-22 19:39:06 +05:30
parent e7973cf37a
commit b50abb5ad2

View File

@ -3,6 +3,18 @@ import {createPortal} from 'react-dom';
export default class Frame extends Component {
componentDidMount() {
this.node.addEventListener('load', this.handleLoad);
}
handleLoad = () => {
this.setupFrameBaseStyle();
};
componentWillUnmout() {
this.node.removeEventListener('load', this.handleLoad);
}
setupFrameBaseStyle() {
this.iframeHtml = this.node.contentDocument.documentElement;
this.iframeHtml.style.fontSize = '62.5%';
@ -20,7 +32,7 @@ export default class Frame extends Component {
render() {
const {children, head, title = '', style = {}, ...rest} = this.props;
return (
<iframe {...rest} ref={node => (this.node = node)} title={title} style={style} frameBorder="0">
<iframe srcDoc={`<!DOCTYPE html>`} {...rest} ref={node => (this.node = node)} title={title} style={style} frameBorder="0">
{this.iframeHead && createPortal(head, this.iframeHead)}
{this.iframeRoot && createPortal(children, this.iframeRoot)}
</iframe>