Emular y probar otros exploradores

Para asegurarse de que el sitio web funciona para todos los usuarios, pruebe su sitio web en otros exploradores y dispositivos. No todos los usuarios usarán el explorador y el dispositivo que usó al desarrollar. Le recomendamos que consulte las soluciones para la emulación proporcionadas por otros exploradores, además de usar la herramienta Emulación de dispositivos en Microsoft Edge DevTools.

Resumen

Hay varios niveles diferentes de pruebas que puede realizar para probar su sitio web en diferentes condiciones:

• Los emuladores de explorador le ayudan a probar rápidamente cómo se ve y se comporta el sitio web en diferentes tamaños de pantalla y resoluciones, con emulación de eventos táctiles y reemplazando la cadena de User-Agent que envía el explorador. Use emuladores de explorador desde el explorador en el que está desarrollando. Consulte Emuladores de explorador, a continuación.

• Los emuladores y simuladores de dispositivos le permiten ejecutar otros dispositivos desde la máquina de desarrollo y probar el sitio web como si estuviera usando estos otros dispositivos. Consulte Emuladores de dispositivos y simuladores a continuación.

• Los emuladores basados en la nube permiten ejecutar pruebas automatizadas para el sitio web en distintas plataformas. Consulte Emuladores y simuladores basados en la nube a continuación.

Emuladores de explorador

Los emuladores de explorador son excelentes para probar la apariencia y el comportamiento del sitio web en diferentes tamaños de pantalla y resoluciones, o cuando se habilitan eventos táctiles, o cuando la cadena de User-Agent se establece en la cadena de User-Agent de otro explorador.

Los emuladores de explorador se usan desde el explorador en el que se está desarrollando. Por ejemplo, en Microsoft Edge, puede usar la herramienta Emulación de dispositivos en DevTools para obtener una aproximación de cómo se ve y se comporta el sitio web en distintos dispositivos. Para obtener más información sobre cómo usar la herramienta Emulación de dispositivos en Microsoft Edge DevTools, consulte Emulación de dispositivos móviles (emulación de dispositivo).

Los emuladores de explorador no emulan las diferencias en la compatibilidad con la API web o la compatibilidad con CSS. Por ejemplo, la herramienta Emulación de dispositivos en Microsoft Edge no emula cómo se admiten las distintas API web o características CSS que el sitio podría usar en Firefox o Safari. Para asegurarse de que todo se comporta según lo esperado, pruebe el sitio en exploradores que se ejecutan en dispositivos reales.

Estos son algunos emuladores de explorador que puede usar para probar el sitio web en otros exploradores:

• Modo de diseño con capacidad de respuesta de Firefox.
• Modo de dispositivo Chrome.
• Modo de diseño con capacidad de respuesta de Safari.

Emuladores y simuladores de dispositivos

Los simuladores y emuladores de dispositivos simulan todo el dispositivo, en lugar de simplemente simular el entorno del explorador. Cada simulador es útil para probar aspectos que requieren integración con el sistema operativo determinado, como la entrada de formulario mediante teclados de dispositivos móviles.

Instale emuladores de dispositivos y simuladores en la máquina de desarrollo, de modo que pueda seguir probando el sitio web en la misma máquina en la que está desarrollando, a la vez que simula la experiencia de uso de un dispositivo diferente.

Emulador de Android

Por el momento, no hay ninguna manera de instalar Microsoft Edge en un emulador de Android. Sin embargo, puede usar android browser, el shell de contenido de Chromium y Firefox para Android, que se tratan más adelante en este artículo. Chromium Shell de contenido ejecuta el mismo motor de representación Chromium que Microsoft Edge, pero no incluye características específicas del explorador.

Para usar el emulador de Android:

1. Descargue android studio para descargar el emulador de Android, que se empaqueta como parte del SDK de Android.

2. Configure un dispositivo virtual siguiendo los pasos descritos en Creación y administración de dispositivos virtuales.

3. Inicie el emulador siguiendo los pasos descritos en Ejecutar aplicaciones en Android Emulator.

4. Después de arrancar el emulador, seleccione el icono Explorador y pruebe su sitio web en el antiguo Stock Browser para Android.

Chromium shell de contenido en Android

Para instalar el shell de contenido de Chromium para Android, mantenga el emulador en ejecución y ejecute el siguiente comando:

git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/*.sh
./chromium-android-installer/install-chromeandroid.sh

Ahora puede probar su sitio web con el shell de contenido de Chromium.

Firefox en Android

De forma similar a la Chromium Content Shell, puedes obtener un APK para instalar Firefox en el emulador.

Descargue el archivo .apk correcto.

Para instalar el archivo en un emulador abierto o en un dispositivo Android conectado, ejecute el siguiente comando:

adb install <path_to_APK>/fennec-XX.X.XX.android-arm.apk

Simulador de iOS

El simulador de iOS para Mac OS X viene con Xcode, que se instala desde el App Store.

Cuando haya terminado, aprenda a trabajar con el simulador a través de la documentación para desarrolladores de Apple.

Para evitar tener que abrir Xcode cada vez que quiera usar el simulador de iOS, abra el simulador de iOS, haga clic con el botón derecho en el icono del simulador de iOS en el dock y, a continuación, seleccione Mantener en dock. Ahora puede hacer clic en el icono siempre que lo necesite.

Máquinas virtuales

Para probar el sitio web en otros sistemas operativos, puede ejecutar máquinas virtuales en el dispositivo de desarrollo. Por ejemplo, Hyper-V es una herramienta de virtualización que permite ejecutar varias versiones de Windows y Linux. Para más información, consulte Introducción a Hyper-V en Windows 10.

Para otras máquinas virtuales, consulte Máquinas virtuales en Estrategias para realizar pruebas en MDN.

Emuladores y simuladores basados en la nube

Los emuladores y simuladores basados en la nube son soluciones comerciales para probar su sitio web en diferentes dispositivos y exploradores sin instalar nada en el equipo de desarrollo. Son útiles cuando no tiene acceso a dispositivos reales o cuando no puede usar emuladores locales. Las soluciones basadas en la nube también son útiles para automatizar las pruebas en distintas plataformas.

Consulte Emuladores en Estrategias para realizar pruebas en MDN.

Vea también

• Emulación de dispositivos móviles (emulación de dispositivo)
• Introducción a Hyper-V en Windows 10

Diseño con capacidad de respuesta:

• Modo de diseño con capacidad de respuesta : Firefox.
• Simulación de dispositivos móviles con modo de dispositivo : Chrome.
• Modo de diseño con capacidad de respuesta : Safari.

Android:

• Android Studio
• Creación y administración de dispositivos virtuales : para configurar un dispositivo virtual.
• Ejecutar aplicaciones en Android Emulator : para iniciar el emulador.
• Elige qué navegador Firefox descargar en tu idioma: Firefox Android Beta - para descargar el archivo .apk correcto.

Manzana:

• Xcode
• Ayuda del simulador

MDN:

• Estrategias para realizar pruebas en MDN.
  • Emuladores
  • Máquinas virtuales

Nota:

Las partes de esta página son modificaciones basadas en el trabajo creado y compartido por Google y usadas según los términos descritos en la licencia internacional creative Commons Attribution 4.0. La página original se encuentra aquí y está creada por Meggin Kearney y Paul Bakaus.

Esta obra está licenciada bajo una Licencia Internacional Creative Commons Attribution 4.0.