blog

  • Home
  • blog
  • Debug WebGL and HTML5 Mobile Experiences with Visual Studio Emulators

Debug WebGL and HTML5 Mobile Experiences with Visual Studio Emulators

This article is part of a web development series from Microsoft. Thank you for supporting the partners who make SitePoint possible.

With the recent availability of Visual Studio 2015 RTM came the free Visual Studio Emulator for Android. In this article, I’ll show you how to test your WebGL experiences on these very fast Android emulators.

First, download Visual Studio 2015 RTM (such as the free community edition) or install the Android emulators directly without Visual Studio. Then, read Introducing Visual Studio’s Emulator for Android, which explains how this cool emulator works and the features supported.

Note: I recently published an article describing how to remotely debug and profile the performance of HTML5 websites and apps on Windows Phone. You can now use the same approach to debug Windows Mobile 10 and Mobile Edge with the release of the Windows 10 SDK Tools.

[author_more]

WebGL testing

Once installed, you can launch the tool:

VSE

And choose the image you’re interested in:

VSEandroid

Let’s choose “5″ Lollipop (5.0) XXHDPI Phone – Similar to Samsung Galaxy S4” and press play. If it’s the first time you’re launching the emulator, it will configure the Hyper-V network settings for you.

Once started, launch the default installed browser and try, for instance, to navigate to http://www.babylonjs.com/, the best available WebGL framework to date . If you try to launch one of our scenes, you’ll see an error:

babylon-gs

Indeed, the default browser shipped with this Lollipop image doesn’t support WebGL. We need to install Chrome on it.

Search for an x86 version of the Chrome APK such as this one: Chrome 43.0.2357.93 (x86) and drag’n’drop the APK directly into the emulator. It should install it:

vseforandroid

Continue reading %Debug WebGL and HTML5 Mobile Experiences with Visual Studio Emulators%

LEAVE A REPLY