Web浏览器兼容性测试工具如何选择？

对于前端开发工程师来说,网页兼容性测试工程师而言，确保代码在各种主流浏览器的各个版本中都能正常工作是件很费时的事情，幸运的是，有很多优秀的工具可以帮助测试浏览器的兼容性，领测软件测试网向您推荐12款很棒的浏览器兼容性测试工具 让我们一起看看这些很棒的工具吧。

　　Spoon Browser Sandbox

　　点击你需要测试的浏览器环境，安装插件就可以进行测试了。帮助你测试网页在Safari、Chrome、Firefox和Opera浏览器中是否正常，IE以前也有的，网站上说应微软的要求去掉了。

　　Superpreview

　　这是为微软自己发布的跨浏览器测试工具，您可以同时查看您的网页在多个浏览器的呈现情况，对页面排版进行直观的比较。

　　IETester

　　专门用于测试网页在IE浏览器各个版本中兼容性的工具，版本包含IE5.5至IE9的各个版本，很不错的一款工具，推荐。

　　BrowserShots

　　BrowserShots 是一款免费的跨浏览器测试工具，捕捉网站在不同浏览器中的截图。这是最有名，也是最古老的浏览器兼容性测试工具。

　　Multiple IEs

　　这款工具同样用于测试网页在IE浏览器各个版本的兼容性。

　　IE netrenderer

　　Netrenderer 也是用于检查你的网站在IE浏览器中的呈现情况，包括各个常用版本的检测。

　　Viewlike.Us!

　　Viewlike 是一款新推出的工具，帮助你检查浏览器在不同分辨率下得呈现情况。

　　BrowserSeal

　　这款工具的两个主要特色是独立的浏览器支持和带有自动化脚本的命令行界面。

　　Browsera

　　Browsera 是一个可测试您的网站的跨浏览器布局的工具，您会看到您网站上存在的兼容性错误。

　　WebDevLab

　　这款工具专门用于测试你的网站在苹果Safari浏览器中是什么样子的。

　　Litmus

　　这个工具可以帮助你检查你的网站在多个浏览器中的呈现情况，跟踪Bug并创建报告。

　　Browsercam

　　最后这款工具是要付费的，可以帮助你检查 Javascript 和 DHTML，提供不同的测试环境平台。

如今，市面上的浏览器种类越来越多（尤其是在平板和移动设备上），这就意味着你所测试的站点需要在这些你声称支持浏览器上都能很好的工作。

同时，主流浏览器（IE，Firefox，Chrome，Opera，Safari）版本更新更加频繁，终端用户甚至不会感知这些浏览器版本的升级。

这两点就导致了对于日益增多的浏览器做兼容性测试显示十分必要，但也使得这种兼容性测试变得十分耗时。

通过全覆盖的测试，你就可以明确的知道你的站点支持哪些浏览器，哪些有兼容性问题。一个最简单的减少浏览器兼容性测试的办法，就是停止对老版本浏览器的支持。这个策略对一些公司是适用的，但并不适用所用的公司。

停止对老版本浏览器的支持，并不意味这你的产品在这些老版本上就没有bug， 这仅仅是你可以忽略那些老版本上的潜在问题，把精力放在那些当前支持的浏览器版本上。

一、分散风险

一个途径就是在多浏览器环境中执行日常的测试工作。

举个例子来讲，你要测试这样一个web应用：用户登入，生成报表，发送报表，退出系统。这个应用还包含一个管理功能，管理员或经理登入后可查看哪些人做了哪些改动。

为了覆盖更多的浏览器，你可以用一种浏览器来测试登入功能，在另一个浏览器中测试“发送报表”的功能，用第三种浏览器测试“审计变动”的功能。

这是一个有效的方法，在日常的功能测试的过程中，同时覆盖多浏览器兼容性测试。上面这个例子还是存在一些问题的，比如讲，如果“审计变动”这个功能在第一种，或第二种浏览器里是有问题，那么就会发现不了。这种方法节省下来的时间，可以让你在做兼容性测试策略时，更有侧重。

二、让其他人帮你做测试

对于一些明显的页面兼容性问题，有一些在线工具可以帮着你检查，例如Browser Shots，它可以将你的页面载入到它所支持的浏览器中(它支持浏览器种类和版本很丰富)，然后截屏，你可以查看在这些浏览器下的载入情况了.

这是一个很棒的工具，但那些需要登入验证的应用，或则你的应用中包含的页面太多 ，这个工具就显得有点力不从心了.

三、和标准进行对比

你可以对你的站点进行HTML语法标准检查，如果通过了，在多浏览器兼容性上，你可以更有自信一点了，但即使通过了，还是总有一些浏览器（比如万恶的360）渲染你的页面是会有兼容性问题。

四、自动化

Web UI的测试可以通过webdriver这个工具来实现自动化，可以使用selenium Grid来将自动化脚本在多浏览器上运行。如果不会写代码的话可以使用TestWriter，完全零编码进行测试。 　　前提是你得有Web UI自动化的投入。Web UI自动化可以发现一些功能上的问题，但对于多浏览器页面布局方面的差异，通过它是很难发现的。

五、Fight Layout Bugs

你可以写一些自动化脚本来检查页面在不同浏览器下渲染效果。Fighting Layout bugs是一个开源的工具，可以用来检查页面布局方面的bug

六、手工测试

你可以手工测试所有的浏览器版本，为了避免混淆，你可以将不同的浏览器安装在不同的虚拟机上（uedde的确这这样做的），当有其他人需要用是，可以直接克隆这些虚拟机，或则直接访问这些虚拟机。但这太耗时，费力了，但还是有必要做一次这样的多浏览器手工测试的。

七、分类

你可以依据内核来划分浏览器。

chrome & safari使用的是webkit内核，Firefox则是Gecko， IE系列的是Trident内核，Opera使用Presto内核。最新的Opera好像也开始使用webkit内核了。

这样你就可以认为，如果在chrome上没有问题，那么“理应”在safari也应该没问题。

八、模拟

市面上有一些工具可以模拟不同的浏览器，有一些浏览器也附带了工具来兼容老版本。但使用这些工具是要谨慎，这样的模拟并不一定准确。慎重。

九、outsource selenium

如果你没有条件搭建selenium grid测试环境，你可以尝试着使用Sauce Labs 和 testingbot 这样的服务。

多浏览器的支持我们心中永远的痛，特别是如今浏览器更新如此频繁的状况下。哎~ 你可以选择上面的适合你的方法。

PS：有些浏览器有兼容模式，可以通过兼容模式来模拟老版本。有些浏览器，如chrome，提供了开发者工具可以帮着定位问题。

学习资源分享

最后感谢每一个认真阅读我文章的人，看着粉丝一路的上涨和关注，礼尚往来总是要有的，虽然不是什么很值钱的东西，如果你用得到的话可以直接拿走

这些资料，对于做【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴我走过了最艰难的路程，希望也能帮助到你！凡事要趁早，特别是技术行业，一定要提升技术功底。希望对大家有所帮助…….

浏览器相关兼容性测试时的测试要点：

1. 测试Web页面在不同浏览器的界面是否一致:

   a)界面是否正常加载；

   b)界面的CSS样式是否显示完全；

   c)文字图片的统一性；

   d)排版是否整齐一致；

   e)数据是否正确；

   f)特效是否正常显示等；

2. 测试web页面在不同浏览器的易用性（易于使用）是否一致和正常:

   a)界面中的所有控件是否能正常显示和使用；

   b)提示信息是否正常和完整；

   c)在不同分辨率下界面是否友好和正常显示；

   d)窗口的最大化和最小化 是否能正常显示等；

3. 测试web页面在不同浏览器的功能是否正常运转:

   a)登录注册功能，搜索功能，导航功能，添加修改删除功能，导入导出功能；

   b)上传下载图片功能，下载文件功能；

   c)地图功能，视频播放功能，音频播放功能；

   d)系统数据计算功能，链接跳转功能；

4. 测试web页面在不同浏览器一些键位是否能正确运作:

   a)返回键；

   b)回车键;

   c)刷新键;

   d)空格键；

   e)快捷键等；

5. 测试web页面在不同浏览器性能方面是否正常和一致:

   a)连接速度是否一致；

   b)在同一环境下的，压力和负载测试的结果是否一致等；

6. 测试web页面在不同浏览器安全性方面是否正常和一致:

   a)数据传输是否加密;

   b)是否加密形式储存等。

结合以上3个因素，做浏览器兼容性测试时，主要会用以下浏览器进行测试：

chrome、Firefox、Safari、IE7、IE8、IE9、IE11、搜狗、QQ、2345浏览器

PS：可以依据内核来测试浏览器

chrome & safari使用的是webkit内核，Firefox则是Gecko, IE系列的是Trident内核，Opera使用Presto内核。最新的Opera好像也开始使用webkit内核了。

作者：赵客缦胡缨v吴钩霜雪明
链接：https://www.jianshu.com/p/93cec6397e28
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

作者：赵客缦胡缨v吴钩霜雪明
链接：https://www.jianshu.com/p/93cec6397e28
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。