首页 文章

跨浏览器测试:一台机器上的所有主流浏览器

提问于
浏览
138

本指南的目标:

  • 运行Internet Explorer的 multiple unmodified native 版本,
    Safari,Opera,Chrome和Firefox on a single machine, side-by-side .

涵盖part 1

  • 目录

  • 必须测试哪些浏览器?

  • 如何创建快速启动且永不过期的Windows XP VM?

  • 哪里可以下载必要的软件(虚拟机映像,浏览器......)?

也包含在_2788818中:

  • IE,Firefox,Opera,Chrome和Safari的安装和配置指南 .

  • 开发人员工具和快捷方式 .

  • Time and disk space costs .

许多部分都是独立的 . 例如,有关运行多个版本浏览器的说明通常是适用的 .

3 回答

  • 101

    目录哪些浏览器需要测试?经验法则:应包含哪些浏览器?准备Windows XP Windows 7(适用于IE9)浏览器下载Internet Explorer Firefox Opera Chrome Safari Adobe Flash Player下载摘要Sandboxie第2部分:安装和配置Internet Explorer Firefox Opera Chrome Safari开发人员工具(和快捷方式)测量设置时间和磁盘空间时间每个浏览器需要(安装和配置)最佳用法主页在http://10.0.2.2:8888/


    1.哪些浏览器需要测试?

    统计数据很快就过时了 . 出于这个原因,我在维基百科上提到了Usage share of web browsers,并在以下网站上提供了最新的浏览器 version 信息 . 每个站点都有一个简短的使用指南 .

    • Can I use - 浏览器使用表,基于StatCounter和其他来源的数据 .

    • StatCounter - 统计:浏览器版本|时间段:上个月截图 .

    • W3Counter - 查看存档的报告: January 2012 (选择上个月) . 屏幕截图 .

    • Wikimedia - 转到底部打开最新报告SquidReportClients .

    • Clicky - 此网站提供各个版本截图的统计信息 .

    经验法则:应包含哪些浏览器?

    • Firefox:最新ESR release最新稳定主要版本 . 发行说明|对于开发人员|快速发布时间表

    • Opera:12.x最新稳定版 . 版本历史
      从Opera 15开始,Opera使用与Chrome相同的引擎 . 相当多的用户仍在使用Opera 12(当Opera 15发布时,UX显着改变了) .

    • Safari:5.1.7(Windows)最新版本 . 发行说明
      不幸的是,Apple放弃了对Windows的支持,因此您需要获取Mac或在VM中运行OS X来测试Safari中的页面 .

    • Chrome:最新稳定版 . 发行说明

    • Internet Explorer:IE8 . 功能历史
      这实际上取决于您的客户 . 本指南教导如何获得IE6和7,但这些浏览器已经死了,或者已经死了 . IE8是Windows XP上最后一个受支持的Internet Explorer版本,它仍然使用很多 .

    备注

    目前,大多数Web浏览器都使用某种形式的快速发布和自动更新 . 编写本指南时,发布版本并不频繁,因此在不必回头的情况下设置一组浏览器非常有用 .
    除非您有意在旧浏览器中测试应用程序,否则只需获取最新版本的浏览器并让自动更新程序负责管理版本 .

    如果你不需要太多的灵活性,并且很快就想测试一个页面,我建议你去看看BrowserStack.com . 注册后,您可以直接在浏览器中进行30分钟的免费试用,以便您访问许多桌面和移动浏览器 .


    2.准备

    在设置机器之前,请下载所有必需的文件(请参阅本节末尾的"Download summary") . 所有文件都将通过共享文件夹与虚拟机共享?怎么样? .

    • 虚拟化软件(推荐使用VirtualBox,即使是商业用途也是免费的 . 以下说明以VirtualBox为主 . )

    • Windows XP

    • modern.IE网站下载VirtualBox的IE6 XP映像 . 解压缩 .ova 文件并运行它以将其导入VirtualBox . (图像也可用于其他虚拟化产品,如VMware,Parallels,Virtual PC和Hyper-V)

    • IE6 XP image for VirtualBox on Windows约764MB

    • IE6 XP image for VirtualBox on Mac约717MB

    • IE6 XP image for VirtualBox on Linux约771MB

    • 准备使用图像:

    • VirtualBox settings :启用网络适配器,但执行 not 将VM连接到实际网络 .

    • VirtualBox settings :创建只读共享文件夹 . 此文件夹将用于在主机操作系统和来宾操作系统之间传输数据 .

    • 运行 net use x: \\vboxsvr\WinShared (假设共享文件夹名为 WinShared . 这会将网络目录绑定到 x: 驱动器) .

    • 可选:安装 AntiWPA 以禁用激活检查,如果您将使用图像超过30天 .

    • 可选: Disable the paging file (计算机>属性>高级>性能>高级>虚拟内存>更改>无分页>设置[确认]) .

    • 可选:通过 Start > Run > services.msc 禁用unnecessary services
      按列 Startup Type 排序行,并根据图像将所有"Automatic"服务切换为"manual" . 每当要安装MSI软件包时,请运行 net start msiServer ("Windows Installer"):

    Windows XP - services.msc

    • 可选:Disable Desktop clean-up wizardDesktop > Properties > Desktop > Customize Desktop > Disable "Desktop Cleanup wizard every 60 days"

    • 可选:安装并配置 Sandboxie (用于在同一个IE6虚拟机中运行IE7和IE8)

    • 可选:安装CCleaner,运行它来配置它并清理垃圾 .

    • 可选:安装7-Zip(用于多个Chrome)

    • 通过客户操作系统(WinXP)关闭系统 .

    • VirtualBox settings :将VM连接到真实网络 .
      (安装期间只有Internet Explorer需要Internet)

    • 可选:创建VM的快照,以便在下一步中陷入困境时进行恢复 .

    • Windows 7+ (for IE9+)

    • modern.IE网站下载预构建的虚拟机映像 .
      这些图像是定时轰炸的,它们在首次使用后30天到期 . 当图像过期后,它们会在使用一小时后关闭 . 如果您不希望每次都重新创建映像,请在激活映像之前更改VM的硬件时钟 .
      例如,在VirtualBox中,您可以使用 VBoxManage modifyvm NAME_OF_VM --biossystemtimeoffset +3600000000 将时间设置为将来1000小时(如果要将其设置为过去的某个点,请使用减去) .

    • Browsers downloads

    • Internet Explorer:

    • 如果您想在一台机器上使用IE 6-8,推荐使用的方法:

    • Requires Sandboxie (我建议完整版paying,或look on YouTube) .

    • IE6 - Pre-installed in XP VM

    • IE7IE8完整的离线安装程序

    • Internet Explorer Developer toolbarrelease information)(适用于IE6 7)

    • IE9+ - 使用modern.IE中预先构建的图像 .

    • Firefox:

    • Profile Manager轻松管理多个配置文件

    • Download the latest version from Mozilla.org .

    • ftp.mozilla.org下载旧版本(如果您只对最近的旧版本感兴趣,请参阅releases.mozilla.org) .

    • 或,使用Utilu Mozilla Firefox Collection .

    • 歌剧:

    • Download any Opera version from Opera.com.

    • Chrome:

    • 下载7-zip以解压缩Chrome安装程序 .

    • Download a specific version at FileHippo.com. Make sure that you select "FileHippo" mirror to get the archived version. 否则,您将被重定向到Google服务器的最新版本 .

    • Safari:

    • Apple.com下载最新版本 .

    • Download other versions from Oldapps.com.

    • Adobe Flash Player

    • 下载version 10.3 3 MB,如果Flash必须在IE6中工作 . 否则,请下载the latest version .

    • 下载最新的插件for other browsers .

    下载摘要

    为方便起见,将所有安装文件放在共享文件夹中是明智的 . 这是所有必要文件的简要(完整)列表(按步骤排序):


    3.沙盒

    Sandboxie是一个轻量级工具,可以在沙箱中运行应用程序 . 它还可用于在单台Windows计算机上安装 multiple versions of IE/Safari .

    安装后:

    • Disable tips :"Configure > Tips > Hide All Tips"

    • 默认情况下,沙盒应用程序周围会出现黄色边框 . 如果你不喜欢这个,请转到 Configure base :"Sandbox > DefaultBox > Sandbox Settings > Appearance" .

    对于每个新的IE / Safari版本,您必须执行以下步骤:

    • Create :"Sandbox > Create New Sandbox" - 输入名称,例如"IE8"并确认 .

    • Install :"IE8 > Run Sandboxed > Run Any Program"
      选择所需的安装程序,然后按确定 .

    • Shortcut :完成安装后,使用"IE8 > Explore contents",找到二进制文件并创建应用程序的桌面快捷方式 .

    所有沙盒文件/注册表更改都保存在 C:\Sandbox 中 . 默认情况下,此目录中的应用程序在沙箱中启动 . 其他程序可以通过contextmenu:"Run Sandboxed"或"Send To > Sandboxie > IE8"在沙盒中轻松启动 .

    Cleaning up using CCleaner :在主环境中运行CCleaner,然后在各个沙箱中运行 .

    导航至:Part 2

  • 59

    第2部分的内容(导航至:第1部分)4 . Internet Explorer 5. Firefox 6. Opera 7. Chrome 8. Safari 9.开发人员工具(和快捷方式)10 . 测量的设置时间和磁盘空间•每个所需的时间浏览器(安装和配置)11 . 最佳使用•主页在http://10.0.2.2:8888/


    安装和配置

    浏览器配置提示:

    • 主页

    • 禁用检查:"Default browser"和"updates" .

    • 激活开发人员工具


    1. Internet Explorer

    Windows 7不允许运行较旧的IE实例,但请参阅下面的注释 . 这就是需要Win XP VM的原因 .

    IE无法降级,因此从最低版本开始,然后在 separate Sandboxie 中升级IE . 在升级之前在最低浏览器版本中设置首选项,这样您只需设置一次主要首选项 .

    • IE6 - 默认安装在WinXP中

    • IE7 / IE8 - 在Sandboxie中安装(WinXP)

    • IE9 - 从modern.IE网站获取预构建的Windows虚拟机映像 .
      这些图像在首次使用后30天到期 . 当图像过期后,它们会在使用一小时后关闭 . 如果您不希望每次都重新创建映像,请在激活映像之前更改VM的硬件时钟 .
      例如 . 如果您使用VirtualBox,请启动终端并发出以下命令(将大写的名称替换为合理的名称):
      VBoxManage modifyvm NAME_OF_VM --biossystemtimeoffset <OFFSET IN MS, prefixed by plus or minus>

    IE6(甚至IE5.5)的完全脱机安装程序可用at this site .

    对于IE6和IE7,应安装Internet Explorer Developer Toolbar . IE8有built-in F12 Developer tools .

    Configuration

    • 启动IE6设置:主页,安全性,Cookies,默认浏览器 .

    • IE7:通过(IE7 Sandboxie)注册表摆脱第一次运行页面 . 见this post on Microsoft's TechNet forum .

    • IE8:摆脱"Set Up Windows Internet Explorer 8"对话框 . 这可以通过启动IE8,然后单击"Later"或modifying the registry来完成 .

    实际上可以通过应用程序虚拟化在Windows 7中运行IE6-8 . VMWare ThinApp效果很好,但设置需要相当多的时间,因为您需要捕获Internet Explorer的安装 . 此外,软件包非常昂贵(keygens是免费提供的,但不道德) .


    1. Firefox

    Option 1 (lazy)
    Utilu Mozilla Firefox Collection . 此工具包含所有Firefox版本(200 MB)的安装程序 . 还包括Firebug,Web Developer工具栏和Flash .

    Option 2
    可以轻松地同时安装和执行多个Firefox版本 .

    • Download Mozilla的官方Profile Manager .

    • http://releases.mozilla.org/pub/mozilla.org/firefox/releases/下载相关的Firefox版本 . 旧版本可在ftp.mozilla.org找到 .

    • 安装每个Firefox版本 . 选择一个主目录("Firefox")很方便,并使用版本号作为子目录的名称("3.6") .

    • 扩展程序:启动 oldest Firefox版本,并获取您最喜欢的扩展程序:

    • Firebug - 旧Firefox版本必备 . 最新的Firefox版本并不是真正需要的,它有一套很好的built-in dev tools .

    • HttpFox - 一种测量HTTP请求的简单而有效的工具 .

    • Web Developer - 一个非常有用的Web开发工具栏 . 节省了很多时间 .

    • Console2 - 增强内置控制台(Ctrl Shift> J) .

    • 首选项: Tools > Options (Windows), Edit > Preferences (Linux)

    • 总则:主页

    • 安全性:取消选中除"Warn me when sites try to install add-ons"之外的所有设置 .
      (不要忘记通过底部的按钮查看警告消息设置) .

    • 高级:

    • 一般:

    • 检查默认浏览器:关闭

    • 提交崩溃报告:关闭

    • 更新:禁用所有更新

    • 清理:关闭所有选项卡,按Ctrl Shift Del并检查所有内容 . 然后关闭Firefox .

    • Firefox'Profile Manager

    screenshot

    • 通过 Copy 选项复制每个配置文件 .

    • A dialog screenshot打开 . 选择适当的名称(例如 Firefox 3.6 )和目的地 .

    • 使用 Firefox version 选项选择默认值适用于 Profiles 的Firefox版本 .

    • 另请检查 Start new instance [-no-remote] 框,以允许同时运行多个Firefox版本 .

    • 完成

    • 使用 Start Firefox 按钮启动Firefox实例 .

    • 让附加兼容性检查在必要时运行并更新 .

    • 使用Ctrl Shift Del清除缓存,历史记录等 .

    • 对每个Firefox版本重复此步骤 .


    6.歌剧

    OperaOpera.com上提供了所有安装程序的列表 . 可以并排安装多个版本而不会出现任何问题 . 在安装过程中,选择"Custom"和 different 目录 .
    在安装时,还要为所有用户选择使用相同的配置文件 .

    Important preference: Settings > Preferences > Advanced > Security > Do not check for updates.

    注意:Opera 15使用与Chrome相同的渲染和JavaScript引擎 .


    1. Chrome

    Chrome :可以从File Hippo下载独立安装程序 .
    也可以并排运行多个Chrome版本 .

    虽然可以使用Sandboxie,但建议使用下一个本机方法,以便并行运行多个版本 .

    • File Hippo下载所需的版本 .

    • Create 主目录,例如 C:\Chrome\ .

    • Extract 安装程序(= without installing ),例如使用7-Zip .
      解压缩后,将创建 chrome.7z 存档 . 同时提取此文件,然后下载创建的 Chrome-bin 目录 .
      现在,你看到 chrome.exe 和像 18.0.1025.45 这样的目录 .
      chrome.exe 移动到 18.0.1025.45 ,然后将此目录移动到 C:\Chrome . 可以安全地删除 Chrome-bin 中的其余文件 .

    • 创建快捷方式 for each version

    "C:\Chrome\18.0.1024.45\chrome.exe" --user-data-dir="..\User Data\18" --chrome-version=18.0.1025.45
    

    此快捷方式的说明:

    • "C:\Chrome\18.0.1024.45\chrome.exe" •这是 launcher

    • --user-data-dir="..\User Data\18" •用户配置文件,相对于 chrome.exe 的位置 . 您也可以使用 --user-data-dir="C:\Chrome\User Data\18" 获得相同的效果 . Set your preferences for the lowest Chrome version, and duplicate the User profile for each Chrome version. 较旧的Chrome版本拒绝使用新版本的用户 Profiles .

    • --chrome-version=18.0.1025.45Location 二进制文件:

    • 位置(例如 18.0.1025.45 )必须是目录的名称:

    • 必须以数字开头和结尾 . 两者之间可能出现一个点 .

    • 这些数字不一定要与实际版本号匹配(尽管使用真实版本号很方便......) .

    关于配置:所有首选项都可以设置为 chrome://settings/ . 我通常会更改主页和"Under the hood"设置 .

    有了很多Chrome版本,安装所有版本都是不切实际的 . 我创建了一个自动执行这些步骤的VB脚本,因此我可以存储安装程序,然后在需要测试旧版Chrome时运行脚本:https://gist.github.com/Rob--W/2882558


    1. Safari

    注意:Windows上的Safari支持已停止 . Windows上最后一个支持的Safari版本是5.1.7;您需要Mac或OS X VM来在较新的Safari版本中测试您的网站 .

    Safari并排执行not natively support多个版本或用户配置文件 . Safari 4是close to death,所以你只需要测试5. * . 所有Safari版本均可从Old Apps下载 .

    • 下载并安装Safari 5.0 .

    • 启动Safari,设置首选项 .

    • Create a new Sandboxie sandbox for each additional installation .
      最初安装 oldest 版本非常重要,这样可以通过较新版本调整用户配置文件 .

    • 有关在Sandboxie中安装的详细信息,请参阅Sandboxie和Internet Explorer部分 .

    必须通过 Preferences > Advanced > Show Developer menu in menu bar 启用开发人员工具 . 安装Safari后,通过 Control panel > Add/Remove software 卸载Apple软件更新程序 .


    9.开发人员工具(和快捷方式)


    10.测量的设置时间和磁盘空间

    • 设置基本环境需要 30 minutes .

    • 安装浏览器不需要太多时间 .

    • 根据浏览器的数量,配置它们可能需要一些时间 .

    • 使用本指南中列出的浏览器设置WinXP VMOpera 12 beta:

    • 下载大小:585MB

    • 12个浏览器

    • 使用时间:1:09小时(32分钟到达IE)

    • 设备尺寸:1.1G /进口尺寸:2.2G .

    • Detailed log: http://pastebin.com/R7WGPK99

    • 设置庞大的WinXP VM以进行详细的浏览器兼容性测试:

    • 24个浏览器

    • 使用时间:2:15小时

    • 设备尺寸:1.4G /进口尺寸:3.0G

    • Log: http://pastebin.com/SJEgxNyr

    每个浏览器所需的时间(安装和配置)

    • 歌剧:2分钟

    • Internet Explorer:3分钟*

    • Safari:4分钟*

    • Firefox:5分钟

    • Chrome:6分钟

    *不包括设置Sandboxie Sandbox的时间(<1分钟) .


    11.最佳使用

    安装完成后,使用CCleaner清理垃圾,然后:

    • 导出设备(此设备可以作为备份保存在其他位置) .

    • 删除新创建的虚拟机

    • 导入设备(这些步骤会减小VM的文件大小)

    • 创建快照(用作检查点)

    从现在开始,当您完成网页测试后,请关闭VM,然后选择“恢复快照” . 这将使您的VM保持整洁和快速 .

    Turn off machine > Restore snapshot

    主页:http://10.0.2.2:8888 /

    来宾操作系统可以通过IP地址 10.0.2.2 访问主机操作系统 . 即使主机没有互联网连接,也可以通过 http://10.0.2.2:8888/ 在访客上访问在端口 8888 上运行的服务器 .

    因此,建议将 http://10.0.2.2:8888/ 设置为主页 .

    可能的用例:

    • 测试单页 .

    • 自动显示某个页面,具体取决于公开的用户代理(例如,通过重定向) .

    • 摆弄:在Chrome中创建一个小提琴,并在Firefox中测试它 .

    • 分享文字和链接 .

    以前的所有内容都可以在一个简单的服务器上轻松实现(例如,我使用了Node.js) .

  • 11

    为了宣传,微软最近开始提供名为modern.IE的免费服务:

    modern.IE是我的一项承诺,我的微软可以更轻松地为Internet Explorer浏览器进行跨浏览器测试 . Microsoft创建了modern.IE,为开发人员和设计人员提供了一套便于IE浏览器测试的工具 . 使用modern.IE,您有两种方法可以在IE中测试您的网站 . 首先,modern.IE为您提供三个月免费使用基于Web的浏览器测试服务BrowserStack . 您只需要一个Facebook帐户登录并开始测试 . modern.IE提供的第二种方法是从IE 6到IE 10的每个浏览器的虚拟化映像,可以在VirtualBox,Virtual PC,Hyper-V或Windows,Mac或Linux上的VMWare Player等虚拟化软件上运行 . 此外,modern.IE还提供了一个工具,可以扫描您的网页以查找常见的编码问题,并列出它们以供您更正,以便它们在所有IE版本中正确显示 .

    资料来源:modern.IE - Cross-Browser IE Testing Tools Suite

    Note: 已删除链接的文章 . 链接现在转到页面的Wayback Machine存档 .

相关问题