# Black screen on mobile browser only

**URL:** <https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239>\
**Category:** Phaser 3\
**Created:** [February 18, 2020, 12:26am UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239 "2020-02-18T00:26:44Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bradley\_Hein](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/bradley_hein/32/2816_2.png) [@Bradley\_Hein](https://phaser.discourse.group/u/Bradley_Hein)\
**Post date:** [February 18, 2020, 12:26am UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/1 "2020-02-18T00:26:44Z")

</div>

Very new to Phaser. I followed the “making your first game” tutorial and made some modifications for learning: [https://phaser.io/tutorials/making-your-first-phaser-3-game/part1](https://phaser.io/tutorials/making-your-first-phaser-3-game/part1)

Everything works great on a desktop inside of Chrome. I deployed it to Heroku at this URL: [https://immense-shelf-18574.herokuapp.com/](https://immense-shelf-18574.herokuapp.com/)

When I try to access that on iPhone XR using Chrome or Safari, all i get is a black screen. Is it being blocked in some way by iOS? I can see in the Heroku logs that the request is accepted… and Im not seeing any errors in that log. Desktop is accessible and works just fine.

Im not sure where to go from here. I’ve googled around, but haven’t had much luck. Any help would be great! Thanks!

---

<div class="post-metadata">

**Author:** ![Nemesis](https://avatars.discourse-cdn.com/v4/letter/n/96bed5/32.png) [@Nemesis](https://phaser.discourse.group/u/Nemesis)\
**Post date:** [February 18, 2020, 3:35am UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/2 "2020-02-18T03:35:41Z")

</div>

It works fine on my Android Device. Probably your phone doesn’t supports WebGL

---

<div class="post-metadata">

**Author:** ![philipgriffin](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/philipgriffin/32/2800_2.png) [@philipgriffin](https://phaser.discourse.group/u/philipgriffin)\
**Post date:** [February 18, 2020, 8:12am UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/3 "2020-02-18T08:12:14Z")

</div>

Works for me too, Android - chrome.

---

<div class="post-metadata">

**Author:** ![AturSams](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/atursams/32/2819_2.png) [@AturSams](https://phaser.discourse.group/u/AturSams)\
**Post date:** [February 18, 2020, 10:02am UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/4 "2020-02-18T10:02:55Z")

</div>

Did you try debugging remotely to see the error message or using an emulator?

---

<div class="post-metadata">

**Author:** ![Bradley\_Hein](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/bradley_hein/32/2816_2.png) [@Bradley\_Hein](https://phaser.discourse.group/u/Bradley_Hein)\
**Post date:** [February 18, 2020, 1:43pm UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/5 "2020-02-18T13:43:45Z")

</div>

Thank you everyone for the replies.

I will look into trying an emulator and additional debugging remotely. Through terminal in VS code, I was able to watch the logs —tail while I accessed the site on my iPhone. No error messages popped in there.

I’ll keep digging around. Thank you again!

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [February 18, 2020, 6:03pm UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/6 "2020-02-18T18:03:53Z")

</div>

In Safari:

```nohighlight
[Error] ReferenceError: Can't find variable: BasicButton
	create (singlephase.js:80)
	create (phaser.js:74006)
	loadComplete (phaser.js:73918)
	emit (phaser.js:1867)
	loadComplete (phaser.js:167611)
	fileProcessComplete (phaser.js:167577)
	onProcessComplete (phaser.js:4398)
	(anonymous function) (phaser.js:13176)

```

---

<div class="post-metadata">

**Author:** ![Bradley\_Hein](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/bradley_hein/32/2816_2.png) [@Bradley\_Hein](https://phaser.discourse.group/u/Bradley_Hein)\
**Post date:** [February 18, 2020, 10:56pm UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/7 "2020-02-18T22:56:05Z")

</div>

Thank you! This helped.

What I did that fixed it… I removed the \< script \> tag from the index.html file that was including the BasicButton and instead used import { BasicButton } from ‘./BasicButton.js’ at the top of the file. I also made sure the export the BasicButton class in the BasicButton.js file.

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [February 18, 2020, 11:26pm UTC](https://phaser.discourse.group/t/black-screen-on-mobile-browser-only/5239/8 "2020-02-18T23:26:41Z")

</div>

You can remove `phaser.js` and keep `phaser-arcade-physics.js`.