Tu trabajo no finaliza cuando te aseguras de que el sitio funcione perfectamente en Chrome y Android. Aunque Device Mode puede simular otros dispositivos, como iPhones, te recomendamos que veas otros soluciones de navegadores para emulación.
Resumen
- Cuando no tienes un dispositivo en particular o quieres hacer un control al azar de algo, la mejor opción es emular el dispositivo directamente dentro del navegador.
- Los emuladores y simuladores de dispositivos te permiten imitar el sitio de desarrollo en diferentes dispositivos, desde tu estación de trabajo.
- Los emuladores basados en la nube te permiten automatizar pruebas de unidades para tu sitio en diferentes plataformas.
Emuladores de navegadores
Los emuladores de navegadores son excelentes para probar la capacidad de respuesta de un sitio, pero no emulan diferencias. en API, compatibilidad con CSS y ciertos comportamientos que verías en un navegador para dispositivos móviles. Prueba tu sitio en navegadores que se ejecutan en dispositivos reales para asegurarse de que todo se comporte como se espera.
Firefox Vista de diseño responsivo
Firefox tiene una vista de diseño responsivo que te alienta a dejar de pensar en términos de y explorar cómo cambia tu diseño en tamaños de pantalla comunes o tu propio tamaño arrastrando los bordes.
Emulación con F12 de Edge
Para emular los teléfonos Windows Phone, usa la emulación integrada de Microsoft Edge.
Dado que Edge no incluye compatibilidad con versiones heredadas, usa la emulación de IE 11 para simular la forma en que tu esta página se vería en versiones anteriores de Internet Explorer.
Emuladores y simuladores de dispositivos
Los simuladores y emuladores de dispositivos simulan no solo el entorno del navegador, sino todo el dispositivo. Son útiles para probar elementos que requieren integración en el SO, como entradas de formulario con teclados.
Android Emulator
Navegador Stock en Android Emulator
Por el momento, no se puede instalar Chrome en un emulador de Android. Sin embargo, puedes usar navegador de Android, Chromium Content Shell y Firefox para Android, que abordaremos más adelante en este . Chromium Content Shell usa el mismo motor de renderización de Chrome, pero viene sin ninguna de las funciones específicas del navegador.
El emulador de Android incluye el SDK de Android que debes descargar desde aquí. Después sigue las instrucciones para configurar un dispositivo virtual y, luego, iniciar el emulador.
Una vez que se inicie el emulador, haz clic en el ícono del navegador para probar el sitio en la Stock Browser para Android.
Chromium Content Shell en Android
Content Shell de Android Emulator
Para instalar Chromium Content Shell para Android, deja el emulador en ejecución y ejecuta lo siguiente: comandos en un símbolo del sistema:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Ahora puedes probar tu sitio con Chromium Content Shell.
Firefox en Android
Ícono de Firefox en Android Emulator
Al igual que con Content Shell de Chromium, puedes obtener un APK para instalar Firefox en el emulador.
Descarga el archivo .apk correcto del https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/.
Desde aquí, puedes instalar el archivo en un emulador abierto o en un dispositivo Android conectado con 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 incluye Xcode, que puedes instalar desde App Store.
Cuando hayas terminado, consulta la documentación de Apple para aprender a trabajar con el simulador.
Modern.IE
VM de IE moderna
Las máquinas virtuales de Modern.IE te permiten acceder a diferentes versiones de IE en tu computadora mediante VirtualBox (o VMWare). Elige una máquina virtual en esta página de descarga.
Emuladores y simuladores basados en la nube
Si no puedes usar los emuladores y no tienes acceso a dispositivos reales, entonces los emuladores basados en la nube son la mejor opción. Una gran ventaja de los emuladores basados en la nube en comparación con dispositivos reales y emuladores locales es que puedes automatizar pruebas de unidades para tu sitio en diferentes plataformas.
- BrowserStack (comercial) es el más fácil de usar para las pruebas manuales. Debes seleccionar un estado selecciona la versión del navegador y el tipo de dispositivo, selecciona una URL para navegar y, con la que puedes interactuar. También puedes activar varios emuladores en la en la misma pantalla, lo que te permite probar el aspecto de tu app en varios dispositivos al mismo tiempo. tiempo.
- SauceLabs (comercial) te permite ejecutar pruebas de unidades dentro de un emulador, que se pueden muy útil para crear un script de flujo por el sitio y ver la grabación de video de este luego en varios dispositivos. También puedes hacer pruebas manuales con tu sitio.
- Device Anywhere (comercial) no usa emuladores, sino dispositivos reales que puedes controlar. de forma remota. Esto es muy útil si necesitas reproducir un problema en un y no puede ver el error en ninguna de las opciones de las guías anteriores.
- LambdaTest (comercial) te ayudará a realizar pruebas manuales en varios navegadores en una combinación. de más de 2000 navegadores y de los sistemas operativos. Los usuarios podrán grabar videos de insectos complejos y vísperas y compártela a través de integraciones como MS Teams, Slack y muchas más. Los usuarios pueden acelerar sus pruebas ejecutando pruebas en paralelo.