Why is this window object null on my iphone?

Question

Alright, so I have a game in React. When the user losers in this game, a new window pops up.

 const lossWindow = window.open(
    "",
    "",
    "width=500, height=300, top=200, left = 200"
  );
  lossWindow.document.write(
    '<img style = "width: 40%" src = "https://dennismarkham.github.io/week-4-game/assets/images/redx.png"><p>OH NOES, YOU ARE TEH LOOS!!!</p>'
  );

This works fine on my laptop and PC, but when I try to play the game on my iPhone with the Safari browser, the loss produces an error which says "null is not an object (evaluating 'lossWindow.document'). Why would this be?

that indicates the window failed to open - probably some type of popup blocking is causing this — Jaromanda X, Jun 07 '23 at 03:32
the window.open is being blocked by Safari, refer: https://stackoverflow.com/questions/20696041/window-openurl-blank-not-working-on-imac-safari — eternityparadigm, Jun 07 '23 at 03:33

score 0 · Answer 1 · answered Jun 07 '23 at 04:53

0

You either need to bind the open function to an onclick event or use target = '_blank'. Maybe there is a popup blocker prevent you from open additional window as well, so you should check that.

answered Jun 07 '23 at 04:53

Thuan Tran

43
6

score 0 · Answer 2 · answered Jun 07 '23 at 05:01

The reason you're encountering the error "null is not an object (evaluating 'lossWindow.document')" on your iPhone with Safari is because the window.open() method might not be fully supported in all mobile browsers, including Safari. Some mobile browsers have limitations on opening new windows or tabs programmatically due to security and user experience concerns.

Instead of opening a new window, you can consider rendering a modal or an overlay within your existing React application to display the loss message. Modals are commonly used to display pop-up messages or notifications in a more user-friendly and mobile-compatible way.

Why is this window object null on my iphone?

2 Answers2