GearVR WebVR Samsung Browser - viewing JS console output - virtual-reality

I'm trying to view the JavaScript console output of a WebVR scene, that's being loaded in the Samsung GearVR browser. If it was in the Chrome browser I could use some form of remote debugging, but with the Samsung browser that wouldn't work.
I looked around the web, but nothing mentioned the particular Samsung Browser WebVR debugging situation.
Does anyone have any ideas or links?
I appreciate your help :)

Actually, chrome remote debugging works on Samsung Internet for GearVR. Just connect adb through wifi (GearVR USB won't work, it's charging only), open chrome://inspect in the desktop chrome and when the headset is active, the page should be visible on the list. All active webkit instances are on that list, not only Chrome. For example you can also sniff gmail app html views.
For this to work, you have to have the headset's screen active - it's hard to have it on your head while debugging so I suggest you use some paper sticky tape to cover the sensor that is between the lenses.

Related

how to debug html rendering issue on Apple mail client

We are facing few HTML/CSS issues on rendering our HTML email on Apple mail client on iPhones
Is there a way one can inspect and debug the issue?
Does Apple provide any emulator/tool to do the same?
What worked for us is Epiphany browser. It mimicked the restricted ability of Apple mail client to render HTML far more closely than any of the solutions below -
google chrome, firefox, safari in responsive design mode
Someone suggested to try emulator in XCode but I couldn't get hold of Apple mail in Xcode -> Window -> Devices and Simulators
You can download an emulator in xcode and visually inspect most Apple devices in emulation.
A simple approach is to use Google Chrome. The engine powering Chrome is based on Webkit, which is the same html engine that powers Safari and IOS and iPadOS devices. The Inspector can allow you to inspect a variety of devices in emulation.
You can do much of this with Apple Safari as well.
A third approach is go post your code, define the problem and let people see if they can determine a fix.
Good luck.

Chrome DevTools not giving accurate mobile view compared to real mobile view

I am trying to make my webpage mobile friendly. So, I am using Chrome DevTools to design a mobile version of my webpage. I have it the way I want it to look in DevTools. I uploaded it to my website & viewed it on a actual mobile phone & objects are not in the same places as they are in DevTools. I used the iPhone 6 mobile design in DevTools and also view it on an actual iPhone 6. They don't match. Anyone else have this problem? I have read articles about this, but don't know how to fix it. Any ideas? Should I use a different emulator?
This is Chrome DevTools version on iPhone 6:
This is how it really looks on an iPhone 6:
DevTools technical writer here. DevTools is just a simulation of mobile devices. It can't truly simulate an iPhone. So it's always a good idea to check how it actually looks on the devices that you care about (like you did). I don't think there's any bug or issue here. It's just an instance where the DevTools simulation doesn't reflect reality 100%.
Mac users can use Xcode's Simulator (that's the actual name of the simulator) to emulate any Apple mobile device and see exactly how their website will appear on it.
You can use it to open Safari and access your localhost. I used it to fix issues on my website, issues that I could not reproduce in DevTools' device simulator.
Clear the cache for on your browser to ensure that your phone is accessing the most recent updates to your code.

Chrome Dev Tools Toggle Device Remote Url

I've found the fantastic Chrome Toggle Device for mobile testing in Chrome.
Is it possible to find out the url that Chrome uses for online testing within the Toggle Device Mobile emulator screen?
I wish to use the Mobile Emulator within a iframe for a specific url.
Chrome Mobile Example Image
Thanks!
The URL is the same one that is in your omnibar's address area. All Device Mode is doing is hitting that URL but modifying the headers sent to the server to look like the specified device type. And then making the local viewport look like the given device's size.

How can i troubleshoot web page on IPhone?

I have been working on a web site that i want to work on any device. It works great on all my devices except my work IPhone. Is there any kind of console or other trick I can use to troubleshoot why it is not working? Something like chrome and firefox ctrl+shift+j would be nice.
In Chrome Dev Tools you can emulate a multitude of devices with differing resolutions and other limitations: Sitepoint blog regarding emulation
you can attempt to use emulation using most any browser F12 or Inspect or the multitude of online ones (google it)
In chrome on PC hit f12 then Ctrl-shift-M

Can I debug Desktop Safari with Chrome Devtools?

Safari's Web Inspector is absolutely awful, and it keeps crashing on me. One of my colleagues suggested using Chrome Devtools to inspect Safari pages via Remote Debugging. I haven't found anything on Google for how to do such a thing--is that possible?
Safari and Chrome use different debugging protocols (initially these were very similar, but over time they grew into separate things). Thankfully, there is a Google project that does the translation between these protocols - iOS WebKit Debug Proxy. It doesn't mention desktop Safari though.