JakeGinnivan / react-popout

React popout is a React component wrapping window.open allowing you to host content in a browser popup window.
MIT License
189 stars 59 forks source link

IE11 with URL not working? #43

Open byoder7 opened 6 years ago

byoder7 commented 6 years ago

Trying to get example3 working on IE11 - but it only seems to work with Chrome. Ran into issues, so just tried to get example3 to work on IE11 without success. I can get IE11 to work without the URL setting, but I need the URL to load CSS and javascript link into new window.

Seems to complain about this: react-popout.jsx:123

TypeError: Object doesn't support property or method 'addEventListener'

Which is strange, because I know IE11 does support addEventListener...

(line number, code...) 120 | const popoutWindow = ownerWindow.open(this.props.url, this.props.name || this.props.title, this.createOptions(ownerWindow)); 121 | this.setState({ popoutWindow }); 122 |

123 | popoutWindow.addEventListener('load', this.popoutWindowLoaded); 124 | popoutWindow.addEventListener('beforeunload', this.popoutWindowUnloading); 125 | 126 | // If they have no specified a URL, then we need to forcefully call popoutWindowLoaded()

byoder7 commented 6 years ago

I think the issue is a race condition. For IE11 the load callback can fail, if you try to add it before the document is ready. Therefore, I think a better approach is to check document.readyState to ensure IE is loaded, and this won't have the same issue. I am writing my own custom compoent to fix this issue - and have decided to use react router with a window.open call myself. Seems like a more solid solution to me for complex popout windows.

jayvanhu commented 6 years ago

@byoder7 Can you show how you got it to work for IE? I'm trying to check document.readyState as well, but it always returns uninitialized. I'm guessing for me the problem is when I'm checking it?

sidharthancr commented 4 years ago

I have reimplemented the react-popout with IE support and more flexible

https://www.npmjs.com/package/react-popout-v2