Edit

Remotely debug Surface Duo emulators

  • Article

In this article, you walk through the process of remotely debugging your web content in the Microsoft Edge app on a Surface Duo emulator from a desktop instance of Microsoft Edge. For information on debugging on a Surface Duo device, follow our guide for remote debugging Android devices.

Before you begin

Step 1: Go to edge://inspect

  • Open a desktop instance of Microsoft Edge, and go to edge://inspect:

The edge://inspect page in Microsoft Edge on the desktop

If the edge://inspect page doesn't recognize the Surface Duo emulator, restart the emulator.

Step 2: Launch the Surface Duo emulator

  • Launch the Surface Duo emulator. The emulator displays two different screens running on the emulator:

The Surface Duo emulator

Step 3: Load your web content in Microsoft Edge on the Surface Duo emulator

  1. On either screen, swipe up on the Favorites Tray of the Surface Duo emulator to display the Apps Drawer.

  2. Click Edge to launch the Microsoft Edge app:

    The Microsoft Edge app on the Surface Duo emulator

  3. In the Microsoft Edge app, go to the website or app that you want to debug.

Step 4: Debug your web content from the Surface Duo emulator

  1. Switch back to the desktop instance of Microsoft Edge.

    The edge://inspect page now shows the SurfaceDuoEmulator with a list of the open tabs or PWAs that are running on the Surface Duo emulator:

    The edge://inspect page shows a list of the open tabs in the Microsoft Edge app running on the emulator

  2. From the list of open tabs running on the emulator, click inspect on the tab that has the web content to be debugged. DevTools opens in a new window.

  3. Click Toggle Screencast (Toggle Screencast) to view the web content from your Surface Duo emulator in the DevTools window.

You can now use the Microsoft Edge DevTools to debug your web content on the Surface Duo emulator:

Using the Microsoft Edge DevTools to debug Bing in the Microsoft Edge app on the Surface Duo emulator

Troubleshooting

If SurfaceDuoEmulator isn't displayed on the edge://inspect page, try opening or closing tabs in the Microsoft Edge app on the Surface Duo Emulator.

For additional troubleshooting steps, see troubleshooting section for Android devices.

How the hinge impacts the layout of your web content

If you span the Microsoft Edge app across both screens in the emulator, the screencast will reflect the new size of the app but not the hinge.

To understand how the hinge impacts the layout of your web content, use the Surface Duo emulator instead of the screencast.

Additional Resources

The web is a great platform for the new class of foldable and dual-screen devices, because you can write your HTML, CSS, and JavaScript once, and have it look great across single-screen, dual-screen, and foldable devices. See the following additional resources to get started building web content for these new devices.