Depuración remota de emuladores de Surface Duo

En este artículo, recorrerá el proceso de depuración remota del contenido web en la aplicación Microsoft Edge en un emulador de Surface Duo desde una instancia de escritorio de Microsoft Edge. Para obtener información sobre la depuración en un dispositivo Surface Duo, sigue nuestra guía para la depuración remota de dispositivos Android.

Antes de empezar

• Instale el SDK de Surface Duo antes de ejecutar el emulador de Surface Duo. Consulta Obtener el SDK de Surface Duo.

Paso 1: Ir a edge://inspect

• Abra una instancia de escritorio de Microsoft Edge y vaya a edge://inspect:

Si la edge://inspect página no reconoce el emulador de Surface Duo, reinicie el emulador.

Paso 2: Iniciar el emulador de Surface Duo

• Inicie el emulador de Surface Duo. El emulador muestra dos pantallas diferentes que se ejecutan en el emulador:

Paso 3: Carga del contenido web en Microsoft Edge en el emulador de Surface Duo

1. En cualquier pantalla, desliza el dedo hacia arriba en la bandeja Favoritos del emulador de Surface Duo para mostrar el cajón de aplicaciones.

2. Haga clic en Edge para iniciar la aplicación Microsoft Edge:

   

3. En la aplicación Microsoft Edge, vaya al sitio web o a la aplicación que desea depurar.

Paso 4: Depurar el contenido web desde el emulador de Surface Duo

1. Vuelva a la instancia de escritorio de Microsoft Edge.

   En edge://inspect la página ahora se muestra SurfaceDuoEmulator con una lista de las pestañas abiertas o PWA que se ejecutan en el emulador de Surface Duo:

   

2. En la lista de pestañas abiertas que se ejecutan en el emulador, haga clic en Inspeccionar en la pestaña que tiene el contenido web que se va a depurar. DevTools se abre en una nueva ventana.

3. Haz clic en Toggle Screencast () (Alternar transmisión de pantalla) para ver el contenido web del emulador de Surface Duo en la ventana DevTools.

Ahora puedes usar Microsoft Edge DevTools para depurar el contenido web en el emulador de Surface Duo:

Solución de problemas

Si SurfaceDuoEmulator no se muestra en la edge://inspect página, intenta abrir o cerrar pestañas en la aplicación Microsoft Edge del emulador de Surface Duo.

Para ver pasos adicionales de solución de problemas, consulte la sección solución de problemas para dispositivos Android.

Cómo afecta la bisagra al diseño del contenido web

Si abarca la aplicación Microsoft Edge en ambas pantallas del emulador, la difusión de pantalla reflejará el nuevo tamaño de la aplicación, pero no la bisagra.

Para comprender cómo afecta la bisagra al diseño del contenido web, usa el emulador de Surface Duo en lugar de la difusión en pantalla.

Recursos adicionales

La web es una excelente plataforma para la nueva clase de dispositivos plegables y de doble pantalla, ya que puede escribir su HTML, CSS y JavaScript una vez, y hacer que tenga un aspecto excelente en dispositivos de pantalla única, doble pantalla y plegables. Consulte los siguientes recursos adicionales para empezar a compilar contenido web para estos nuevos dispositivos.

• Documentación para desarrolladores de Surface Duo : documentación para crear aplicaciones en dispositivos de doble pantalla.

• Web Platform Primitives for Enlightened Experiences on Foldable Devices (Primitivas de plataforma web para experiencias habilitadas en dispositivos plegables ): explicador de plataforma web de Microsoft Edge para nuevas API, con el fin de crear experiencias web en dispositivos plegables y de doble pantalla.

• Cómo crear experiencias de doble pantalla para el sitio web y las aplicaciones web : grabación de la sesión del Día del desarrollador de Microsoft 365.