Mobile Extension External Links Not Rendering

Having a problem related to my Twitch extension opening a link to an external site in mobile mode. I have whitelisted the domain and even the specific link but every time I try the page does not render and I am unsure of how to access logs of the Twitch apps webview.

Currently testing on Android and it seems like because the page I am linking out to is a client side Vue app without SSR the mobile webview cant render it on Android. I have not tested on iOS yet.

Here is an example of a URL that will not render in the mobile webview: https://app.readyup.com/series/bc94bc85-4931-453e-aebd-2a928d249224

Thanks!

Opening the link you shared on Android here from discourse, it takes a good while to load in chrome.

If I had to guess, it simply takes a good long while, but that is a bad user experience to begin with.

If you control the target website, I suggest you add some in-site logging into the DOM to debug it, that’s how I have debugged my own extension on mobile, but you can also use adb to read the logcat live if set up correctly and that may catch some additional info if you are lucky. (Note that I have not tested it and don’t know how useful logcat is for it, but it may be worth a shot if you have no other option.)

Other than that: Your target app seems to, in the end, just open a VOD/live stream of LEC/RiotGames - you should most likely just link to that directly, so the user stays within the Twitch App, which is a WAY better experience on mobile than having the embeds visible in a WebView.

Thanks for the response, the ADB logs are pretty verbose, any clues as to what I would be looking for exactly? Something around webview and twitch but currently its very needle in the heystack.

Turns out this is an issue with the Content Security Policy in the webview. Currently the app is being blocked from loading, but I am not sure exactly what part of the CSP is being violated.

Link to new topic with more specific error: CSP Blocking External Links in Mobile Webview