模拟和测试其他浏览器

若要确保您的网站适用于所有用户,请在其他浏览器和设备上测试您的网站。 并非所有用户都将使用你在开发时使用的浏览器和设备。 除了在 Microsoft Edge DevTools 中使用设备仿真工具外,我们建议你检查其他浏览器提供的仿真解决方案。

摘要

可以在不同条件下执行多个不同级别的测试来测试网站:

  • 浏览器模拟器 通过触摸事件仿真以及重写浏览器发送的 User-Agent 字符串,帮助你快速测试网站在不同屏幕大小和分辨率下的外观和行为。 使用正在开发的浏览器中的浏览器模拟器。 请参阅下面的 浏览器模拟器

  • 借助设备模拟器和模拟器 ,你可以从开发计算机运行其他设备,并像使用其他设备一样测试网站。 请参阅下面的 设备模拟器和模拟器

  • 基于云的仿真器 使你能够跨不同平台为网站运行自动测试。 请参阅下面的 基于云的模拟器和模拟器

浏览器模拟器

浏览器模拟器非常适合测试网站在不同屏幕大小和分辨率下的外观和行为方式,或者当启用触摸事件时,或者当 User-Agent 字符串设置为另一个浏览器的 User-Agent 字符串时。

使用正在开发的浏览器中的浏览器模拟器。 例如,在 Microsoft Edge 中,可以使用 DevTools 中的 设备仿真 工具获取网站在不同设备上的外观和行为方式的近似值。 有关如何在 Microsoft Edge DevTools 中使用 设备仿真 工具的详细信息,请参阅 模拟移动设备 (设备仿真)

浏览器模拟器不会模拟 Web API 支持或 CSS 支持方面的差异。 例如,Microsoft Edge 中的 设备仿真 工具不会模拟在 Firefox 或 Safari 中如何支持站点可能使用的不同 Web API 或 CSS 功能。 若要确保一切按预期运行,请在实际设备上运行的浏览器上测试站点。

下面是一些浏览器模拟器,可用于在其他浏览器上测试网站:

设备模拟器和模拟器

设备模拟器和模拟器模拟整个设备,而不仅仅是模拟浏览器环境。 每个模拟器都可用于测试需要与特定操作系统集成的方面,例如使用移动设备键盘的表单输入。

在开发计算机上安装设备模拟器和模拟器,以便可以继续在正在开发的同一台计算机上测试网站,同时模拟使用其他设备的体验。

Android 仿真器

目前,无法将 Microsoft Edge 安装在 Android 仿真器上。 但是,可以使用 Android 浏览器、Chromium Content Shell 和 Firefox for Android,本文稍后将介绍这些内容。 Chromium Content Shell 运行的Chromium呈现引擎与 Microsoft Edge 相同,但没有特定于浏览器的功能。

若要使用 Android 模拟器,请执行以下操作:

  1. 通过下载 Android Studio,下载作为 Android SDK 的一部分打包 的 Android 模拟器。

  2. 按照创建和管理虚拟设备中的步骤设置 虚拟设备

  3. 按照在 Android Emulator 上运行应用中的步骤启动模拟器。

  4. 启动仿真器后,选择“ 浏览器 ”图标,并在旧的适用于 Android 的常用浏览器上测试网站。

Android 上的Chromium内容 shell

若要安装适用于 Android 的 Chromium Content Shell,请保持仿真器运行并运行以下命令:

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

现在,可以使用 Chromium Content Shell 测试网站。

Android 上的 Firefox

与 Chromium Content Shell 类似,你可以获取 APK 以将 Firefox 安装到模拟器上。

下载正确的.apk文件

若要将文件安装到打开的仿真器或连接的 Android 设备上,请运行以下命令:

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

iOS 模拟器

适用于 Mac OS X 的 iOS 模拟器附带 Xcode,可从App Store安装

完成后,请通过 Apple 开发人员文档了解如何使用模拟器。

若要避免每次要使用 iOS 模拟器时都不得不打开 Xcode,请打开 iOS 模拟器,右键单击扩展坞中的 iOS 模拟器图标,然后选择“ 保留在扩展坞中”。 现在,只需在需要时单击图标即可。

虚拟机

若要在其他操作系统上测试网站,可以在开发设备上运行虚拟机。 例如, Hyper-V 是一种虚拟化工具,可用于运行各种版本的 Windows 和 Linux。 若要了解详细信息,请参阅 Windows 10 上的 Hyper-V 简介

有关其他虚拟机,请参阅用于在 MDN 执行测试的策略中的虚拟机

基于云的模拟器和模拟器

基于云的仿真器和模拟器是商业解决方案,可以在不同的设备和浏览器上测试网站,而无需在开发计算机上安装任何内容。 当你无权访问真实设备或无法使用本地模拟器时,它们非常有用。 基于云的解决方案也可用于跨不同平台自动执行测试。

请参阅用于在 MDN 中执行测试的策略中的模拟器

另请参阅

响应式设计:

Android:

苹果:

MDN:

注意

此页面的某些部分是根据 Google 创建和共享的作品所做的修改,并根据 Creative Commons Attribution 4.0 International License 中描述的条款使用。 原始页面 在这里 找到,由梅金·基尔尼和保罗·巴考斯创作。

Creative Commons 许可证 本作品根据 Creative Commons Attribution 4.0 International License 获得许可。