Sandbox does not work on mobile phone

[triska]

trafficstars

When I use Safari on iPhone to visit the link shown in https://github.com/guregu/trealla-js/issues/4#issuecomment-1263938831, I see (as expected) the intended query.

However, when I post the query, the browser is unexpectedly redirected to https://php.energy/trealla.html? instead of showing the answer. What could be the reason for this?

[guregu]

Safari issue it seems, I can also reproduce. Probably just missing one of the APIs I use. I’ll hook up a debugger and figure it out

[guregu]

Pushed an update. Works on my phone now. It'll also pop up an alert window when it runs into an error now which should hopefully help debug. As a bonus, it now looks nicer (although still terrible) on mobile too ;)

Let me know if it doesn't work for you.

[triska]

On an iPhone, I now only get "Loading..." as description for the query button. No error is indicated.

[guregu]

Hmm, that's not good. What version of iOS are you using? I'm on a slightly older one.

[triska]

I cannot open the image you posted, I get: "Did Not Connect: Potential Security Issue".

I tried it with iOS 14.4.1 on an iPhone SE.

[guregu]

That's odd, the image is nothing particularly special, just uploaded using GitHub's drag and drop 🤔 I wonder if there's some kind of certificate issue with the hosts I'm using. Can you access these URLs?

• javascript source: https://esm.sh/[email protected]
• wasm binary: https://registry-cdn.wapm.io/contents/guregu/trealla/0.7.1/tpl.wasm

If those look OK (should be source code and a binary download) then it must be an issue with the JS APIs I'm using.

[triska]

I meant this image: https://user-images.githubusercontent.com/131059/193401473-1bcce844-3211-4aec-8a89-775b8bf7f184.png

[guregu]

Ah yeah, those URLs I posted are the ones the playground uses internally. I don't think they are related to the Github image issue, but the Github images not working points to a potential greater problem I think. Like maybe your root certificates are different than mine.

Are you using Firefox on iOS, btw? Maybe it's a Firefox thing. I'll give it a shot.

[triska]

I can view the png file with iOS, on an iPhone. However, on iOS (using Safari), I only get "Loading..." where the Query button should be, and I cannot post any query.

On OSX (I am using 10.11.3, so the TLS certificates may be outdated), I cannot view the png file you linked to. And with the latest changes, I now only get "Loading..." on OSX too (using Firefox). In summary, I currently have no device in reach where the playground works. Note that until a few hours ago, I could post queries using this OSX version.

[guregu]

I have an a Mac with an old version of OS X, let me see if I can reproduce. Sorry about the breakage. I'm going to experiment with embedding the WebAssembly binary inside of the JS package, loading the WASM binary could potentially be the issue. Will update you after I try some things.

[guregu]

I think I fixed the thing I probably broke a few hours ago. It was an issue with the URL parameters breaking the server-side part of it.

I tried running it on OS X 10.14.6, Firefox 105 and it seems OK. Unfortunately that's all I have to test with.

I also tried reducing the usage of new JS stuff like toplevel await so maybe that will help. Please try again 🙏

[triska]

With Firefox on OSX, I now get the following error in a message box:

ReferenceError: FinalizationRegistry is not defined

The web console states:

Uncaught (in promise) ReferenceError: FinalizationRegistry is not defined
    trealla 0.9.1/es2021/trealla.js:2
    init https://php.energy/trealla.html:64

[triska]

On iOS, I only see "Loading..." for the query button, and no error message.

[guregu]

Aha, progress! I added a check for FinalizationRegistry support in the library and a workaround. It looks like you are one version behind its support. I have pushed the updates.

For mobile, are you on a slow connection (like 3G)? It could take a minute or so to load. I believe it's around ~750KB transferred at the moment. It is possible to slim it down further with some effort. For comparison, SWI sits around 8MB and Ciao 15MB on their sites. Tau is something like 100KB.

[triska]

On OSX, I still get the error message: ReferenceError: FinalizationRegistry is not defined

[guregu]

Whoops, I made a mistake on the check. Published a fix. Please try again.

[triska]

Thank you, on OSX it works now. But the issue on iOS persists: I only get "Loading...", also after many seconds, certainly enough to download 1 MB (over LTE).

[guregu]

Glad to hear at least one part was fixed. Thanks for bearing with me. I will try some other techniques. Will report back later.

[guregu]

I put up a new test build on the demo site. It uses esbuild with the target ['firefox76', 'safari14'] so hopefully it should work for you. This version also has the binary bundled inside of it so maybe that will help too.

[triska]

Thank you for these changes. On iOS, I tried it with Firefox 37 (this is from last year) and Safari using (still) iOS 14.4.1, and I only get "Loading..." on both browsers. I think it would be nice to at least display what is going wrong or what is needed, for example to detect when a browser cannot run the page.

[guregu]

I got a hold of Safari 14 and figured it out (I think). It seems to be missing support for BigUint64Array, which our single dependency (wasmer-js) relies on. https://caniuse.com/?search=BigUint64Array%20 Support was added in Safari 15.

Looks like wasmer-js uses it for the virtual filesystem. I would like to probably switch away from wasmer-js to something more lightweight but it might involve reimplementing all the WASI syscalls.