十大跨浏览器的测试工具基础入门_测试菜鸟指南

在实际使用中,我们往往会发现某些网站应用虽然能够在Mozilla和Chrome中运行良好,但是在其他浏览器上却总有一些违和感。也许就是因为某个网站的兼容性问题,导致您失去了一个又一个的访客或潜在用户。传统的处置方式是在计算机和移动设备上加载Web应用,在各种浏览器组合中对目标网站进行测试。不过,此举会消耗大量的时间、资源、精力和成本。因此,我们需要采用自动化

十大跨浏览器的测试工具基础入门

在实际使用中,我们往往会发现某些网站应用虽然能够在Mozilla和Chrome中运行良好,但是在其他浏览器上却总有一些违和感。也许就是因为某个网站的兼容性问题,导致您失去了一个又一个的访客或潜在用户。

十大跨浏览器的测试工具基础入门_测试菜鸟指南

传统的处置方式是在计算机和移动设备上加载Web应用,在各种浏览器组合中对目标网站进行测试。不过,此举会消耗大量的时间、资源、精力和成本。因此,我们需要采用自动化的测试工具来实现。

需要测试哪些环节?

在执行跨浏览器测试的过程中,我们需要测试如下几个方面:

  • CSS验证,HTML或XHTML验证
  • 通过启用或禁用JavaScript来进行页面验证
  • 多种屏幕分辨率下的页面布局
  • Ajax和jQuery功能
  • 对字体大小、所有图像和对齐效果进行验证
  • 页眉和页脚部分
  • 页面样式和日期格式
  • HTML字符编码或特殊字符

上述各种元素都会影响到目标网站在不同浏览器上的运行效果。在下文中,我们将比较目前十大跨浏览器测试工具的各自优缺点。

1. LambdaTest

LambdaTest是一个基于云的测试平台,它可以免费提供超过2,000种浏览器、操作系统和设备组合的跨浏览器测试。LambdaTest的特点在于:它为Web应用提供了手动和自动两种测试方式。因此,对于那些需要执行实时跨浏览器测试、实时交互式测试、以及应用可视化测试的人来说,可以选择手动;而对于需要自动化测试过程的个人而言,则可以在LambdaTest的可扩展云网格(cloud grid)上,运行自动化的Selenium脚本。在售价方面,LambdaTest提供一个每月15美元的标配“全家桶”方案。

LambdaTest能够提供的功能包括:

  • 无限制的实时浏览器测试、自动化测试、响应测试和屏幕截图测试
  • 适合于那些首次使用跨浏览器的用户
  • 在所有浏览器组合中,生成网页或应用的自动截屏
  • 在多种屏幕分辨率上测试网页的布局
  • 可以被用作Chrome的扩展程序和WordPress的插件
  • 与错误测试工具相集成,帮助您轻松地管理和跟踪错误
  • 通过Lambda Tunnel功能,来测试本地托管或私有托管的页面
  • LambdaTest专家团队提供全天候的支持

2. Experitest

如果您对测试Web应用的功能和性能感兴趣的话,一定听说过Experitest。它能够对大量的浏览器和操作系统组合进行持续的测试,以检查您的应用是否能够按照预期运行。同时,它允许您通过运行Selenium和Appium等测试脚本,在1,000多种浏览器、操作系统和设备的组合中,自动进行跨浏览器的测试。虽然Experitest支持的种类比LambdaTest要少一些,但是由于它提供的标准服务套餐为每个月9美元,这让那些预算有限的人更趋向于选择它。

Experitest附带的功能包括:

  • 能够针对iOS、Android和桌面浏览器,运行Selenium和Appium测试
  • 通过可扩展的、基于云网格的并行测试,来缩短测试的周期
  • 通过详细的报告(包括截屏、日志文件和视频),快速地检测并修复错误
  • 可以使用手动方法来调试代码,并测试目标站点的功能

3. Browserstack

作为一个老牌的测试工具,Browserstack允许用户在1500多种浏览器中,测试应用程序的浏览器兼容性。就像LambdaTest和Experitest一样,Browserstack也是一个基于云端的平台,因此您不需要在系统上进行任何安装。此外,它还带有预安装的开发人员工具,方便用户在测试时轻松地调试各种代码。而在售价方面,Browserstack要比LambdaTest贵很多:其网络测试版的起步价为每月29美元;其自动化测试版的售价则为每月99美元。

Browserstack能够提供的功能包括:

  • 测试各种网络应用、以及原生的移动应用
  • 使用地理定位的测试功能,来模拟某个位置所对应的安全且私有的IP,以检查Web应用在该国家/地区的执行情况
  • 设置全面的测试环境,以支持各种代理、活动目录和防火墙
  • 提供对于网页的响应式截屏测试
  • 使用localhost功能,来测试本地托管的网页

4. Browserling

Browserling是最便宜的一种在线测试工具,它提供了在真实机器上运行的真实浏览器,用户可以对Web应用和站点进行实时交互式的跨浏览器测试。Browserling具有出色的API支持、专有的服务器和出色的工具,可让您通过交互式浏览,来比较不同的截屏,进而查明设计上的问题。除了在线测试之外,Browserling还支持通过SSL加密,来测试本地托管应用的安全性。因此,如果您不是过于关注自动化测试的话,这款工具就比较适合您。在价格方面,其开发者版本的起售价为每月19美元,比LambdaTest略贵一点。

Browserling的主要功能包括:

  • 能够捕获测试过程的屏幕信息,并与团队成员共享
  • 测试在不同屏幕分辨率下的网页响应速度
  • 通过Chrome、Firefox、Opera和Safari的扩展插件,能够轻松实现跨浏览器的测试
  • 允许用户为常用的测试配置添加“书签”
  • 为跨浏览器测试提供无限的测试分钟(unlimited testing minutes)
  • 提供具有有限测试会话的免费测试计划

5. SmartBear的CrossBrowser Testing

SmartBear的CrossBrowser Testing是另一个基于云的平台,它可以帮助用户通过手动和自动的方法,来测试Web应用的在线浏览器、和设备兼容性等问题。通过类似BrowserStack的订阅设置,您可以访问移动端和桌面上的1,500多个远程浏览器。与其他工具不同的是,它提供了对于浏览器扩展、Chrome开发工具、以及FireBug等开发人员工具的访问,并能够方便用户调试前端的错误。CrossBrowser Testing工具针对自由职业者的定价为每月15美元。同时,它也为那些开源项目提供了免费的方案。

CrossBrowser Testing的基本功能包括:

  • 提供了可扩展的Selenium在线网格(online grid),能够在真实的设备和浏览器上运行Selenium和Appium脚本
  • 提供网页版并行测试,进而缩短了构建的时间
  • 使用可视化的UI测试功能,获取目标网页的整页截屏
  • 提供无代码记录(codeless record)和重放功能
  • 价格更低,可谓BrowserStack的替代品

6. Ranorex Studio

与其他工具略有不同,Ranorex Studio不仅是一个跨浏览器的测试工具,而且还可以作为Web应用一体化的解决方案。用户可以用它来针对HTML5、JavaScript网站、Java、Flash、Flex应用、以及Salesforce等技术与框架,开展自动化的测试。此外,它还支持shadow DOM、JxBrowser、跨域的iframe、以及混合桌面应用等元素。Ranorex Studio比较适合于识别那些具有动态ID的Web元素对象。它为所有用户都提供了30天的免费试用期。

Ranorex Studio的特色:

  • 能够提供数据驱动、以及Web应用的关键字驱动测试
  • 既能够进行并行测试,又能够在内置有Selenium WebDriver支持的Selenium网格上进行分布式测试
  • 通过有效的测试和维护量的减少,能够共享对象存储库和可重用的代码模块
  • 能够录制测试过程的视频,进而分析测试中发生的情况
  • 能够与TestRail、Git、Travis、以及Jira等实用程序轻松地集成

7. Browsershots

Browsershots是广为使用的跨浏览器测试平台之一。它允许用户在任何浏览器和操作系统中测试目标网站。通过Browsershots,您可以定制不同的浏览器版本、操作系统类型、界面颜色深度、屏幕分辨率、以及Flash的启停等选项,来进行全面测试。不过,此软件有一个缺点:它需要花费较长的时间,来显示那些针对多个浏览器的Web测试结果,有时甚至会出现超时。由于是一个开源平台,因此Browsershots并无订阅费用。

Browsershots的特点:

  • 能够提供测试网站、或Web应用的简单流程
  • 能够根据配置,将目标网站的URL传递到不同的分布式系统上
  • 支持诸如Epiphany、SeaMonkey、Iceweasel、Rekonq等小众浏览器
  • 支持几乎所有类型的浏览器
  • 能够在61个浏览器和操作系统中进行网站截图
  • 能够为单一的浏览器提供快速的测试结果

8. Functionize

如果您不想自行创建用于横跨多个浏览器与操作系统的Web测试脚本的话,那么Functionize便是您的理想选择。不同于其他工具,Functionize用到了人工智能,并使用NLP来创建测试。因此,您不必为不同的浏览器重新编写测试代码,只需要用简单的英语来描述便可,这样可以节省大量的时间。Functionize并未明确为其提供的服务标价,您可以使用其免费试用版来测试自己的Web应用。

Functionize的基本功能包括:

  • 在几分钟之内,便可创建针对各种浏览器和操作系统的测试
  • 允许对多种浏览器与操作系统组合,执行并行的测试
  • 提供代码调试和可视化测试等一致性的功能
  • 提供有关浏览器运行错误、以及特定浏览器异常代码的详细信息
  • 能够对复杂且密集的Web应用开展可视化的测试

9. Sauce Labs

作为基于云端的测试平台,Sauce Labs拥有超过10年的自动化测试经验。它可以被用来测试Web应用、以及横跨多种浏览器与设备的移动应用兼容性。Sauce Labs既不需要任何VM的设置便可运行测试用例,又能够提供实时断点的访问,并允许用户手动控制系统和检查各种问题。Sauce Labs为用户提供了可扩展的、且广泛的测试覆盖率,它可以加快软件测试的生命周期,进而缩短了整体的构建时间。与大多数跨浏览器测试工具类似,Sauce Labs的订阅计划取决于待测设备的类型。例如,对于某个虚拟化平台的费用就从每月19美元开始,之后按每月149美元收取自动化测试的费用。

Sauce Labs的特点:

  • 无需设置硬件VPN,它使用SSH Sauce Connect来代理800多种浏览器,进而对本地托管的网页开展测试
  • 支持所有的Selenium测试框架
  • 可以使用模拟器、以及真实的设备,来测试原生的移动应用
  • 能够通过Espresso、Appium和XCUITest等移动框架,来支持自动化类型的测试
  • 按照用户使用信息的执行时序,来列出各种测试

10. IETester

如今,虽然Google Chrome和Firefox已经非常普及,但是Internet Explorer仍有大量的全球用户。因此开发人员在所有版本的IE上测试目标应用是非常重要的一个环节。IETester就是一款专注于测试IE不同版本(从IE 5.5到IE 11)的工具。由于开源,它对于个人和专业网站来说都是免费的。

IETester的特点包括:

  • 能够在所有版本的IE上测试Web应用或目标站点
  • 支持8、7、Vista、XP等几乎所有版本的Windows操作系统
  • 可以在最新的IE版本上测试某个Web应用
  • 不需要支付任何费用
海计划公众号
(0)
上一篇 2020/03/26 23:33
下一篇 2020/03/26 23:33

您可能感兴趣的内容

  • Smoothslides入门基础知识一款基于 jQuery 的响应式幻灯片插件

    Smoothslides小白攻略 官方网址:http://kthornbloom.github.io/Smoothslides/ GitHub:https://github.com…

    2020/03/06
  • 探究 Go 语言 defer 语句的三种机制菜鸟教程下载_go入门基础教程

    探究 Go 语言 defer 语句的三种机制菜鸟教程下载 Golang 的 1.13 版本 与 1.14 版本对 defer 进行了两次优化,使得 defer 的性能开销在大部分场…

    2020/03/19
  • canvas旋转画笔新手入门_canvas基础知识

    canvas旋转canvas旋转画笔,可以使用rotate方法,rotate方法是绕着中心点旋转的,中心点默认是左上角的(0,0)位置,可以使用translate方法改变旋转的中心点,下面介绍两种方法旋转,可以根据自己的需求使用,关键是理解旋转的原理旋转方法1此种方法是,先将中心点平移到矩形中心,接着旋转,再将中心点平移回原点(0, 0),按照之前的位置和大

    2020/03/26
  • 未来有望干掉 Python 和 JavaScript 的编程语言使用指南_语言菜鸟知识

    Python 和 JavaScript 是两门非常有影响力的编程语言,二者都是我们在打造跨平台应用时会用到的主流语言。由于 Python 和 JavaScript 都是脚本语言,因此它们有很多共同的特性,都需要解释器来运行,都是动态类型,都支持自动内存管理,都可以调用 eval()来执行脚本等等脚本语言所共有的特性。在过去这些年来,Python 和 Java

    2020/03/22
  • Js语句后加不加分号;入门指南_语句菜鸟教程下载

    问题前一阵子猛然想到一个问题,JS有分号自动补全(ASI)机制,在写JS时我是习惯性在语句后面加上分号,在块语句后面不加分号。那么如果没有加分号的话,在什么情况下会出现问题?在JS语句后到底是应该加分号还是不加分号?解决问题面对这个问题,我来了兴趣。于是在网上查了一些资料。关于加不加分号的问题,知乎上一些回答这个问题的大佬普遍意见是,喜欢就好。嗯,很直接。关

    2020/03/29
  • bash快捷键整理菜鸟指南_快捷键入门教程

    今天敲命令行时想在单词间移动,竟然不记得快速移动的快捷键。试了Ctrl + W和Ctrl + B/F均不凑效,于是怀念之前某博主分享的终端快捷键说明图。好在很快好在很快从浏览记录中找到了链接。原博主(@linuxtoy)分享的终端跳转解说图为:虽然命令难记,但解说图清晰易懂,让人印象深刻。趁热打铁,马上找了篇解说bash快捷键的文章温习一下。博主Alan S

    2020/03/31
  • element ui tree控件父节点和子节点之间的关联问题攻略教程_element入门指南

    问题描述:当需改的时候如果父节点为选中状态子节点不是全选中这样会显示为子节点为全选中状态代码:<el-treev-model="data.xxx":data="xxx"show-checkboxnode-key="id"ref="tree":check-strictly="true"//在显示复选框的情况下,是否严格的遵循父子不互相关联的做法,默认为 fal

    2020/03/23
  • Brunch.io小白指南_轻量级HTML5编辑开发工具

    Brunch.io基础入门 官方网址:http://brunch.io/ GitHub:https://github.com/brunch/brunch.github.io 简介描…

    2020/03/06
  • GraphicsJS基础知识教程_一个强大的Js绘图库,基于SVG/VML技术

    GraphicsJS基础知识教程 官方网址:http://www.graphicsjs.org/ GitHub:https://github.com/anychart/graphi…

    2020/03/10
  • Js数组的一些骚操作入门基础知识_操作菜鸟指南

    如何操作数组在编程语言和脚本语言中是最基础的技能,Javascript也提供了内置的的数组操作函数和方法,今天我们主要介绍前端开发中经常遇到的操作数组的常规方法以及ES6操作数组的神奇方法。1.数组去重1)常规方法去重数组去重就是去掉数组中重复的项,我们使用常规的方法是定义一个新数组,遍历要去重的数组,然后一个个比对,如果数组中的值没有在新数组中出现,就将该

    2020/03/22
  • p5.js入门基础_一个为艺术家、设计师而开发的Javascript库

    p5.js入门基础知识 官方网址:http://p5js.org/ GitHub:https://github.com/processing/p5.js 简介描述:一个为艺术家、设…

    2020/03/06
  • 程序员和用户使用说明_程序员基础知识

    来源:外刊IT评论www.vaikan.com/how-client-use-their-software/我曾经说过,程序员不是一般的人,是具有某种超能里的人。但问题是,程序员往往意识不到自己的这种特异功能,在他们的眼里,会认为自己很普通,跟常人一样,所以,程序员能做到的事情,其他人——比如他们的客户/软件用户——也应该很容易做到。但事实上,由于大部分人—

    2020/04/05
  • 带宽与区块链:开发人员如何最小化负担零基础入门_区块链小白帮助

    区块链使整个世界保持在同一页面上。当每个区块被铸造时,新的账本状态就将取代先前的状态。共识机制致力于确保更广泛的社区同意该状态。在一个设计良好的系统中,激励措施可确保不变性。经过足够的时间之后,状态就不会被篡改。这些区块链为我们提供了可编程的货币,并顺理成章地引起了许多人的兴趣。比特币和以太坊是最早的两种区块链。事实证明,这些账本受人欢迎且健壮,但通常被诟病

    2020/03/29
  • Js通过.或者[]访问对象属性的语法、性能等区别入门教程_对象菜鸟教程网

    在JavaScript中可以使用 . 或者 [ ] 来访问对象的属性,但是对象中方法只能通过 . 来获取,例如:function Person() {this.name=” 张三 “; // 定义一个属性 namethis.say=function(){ // 定义一个方法say()return “我的名字是 ” + this.name ;}
    }
    var a

    2020/04/05
  • Js中被嫌弃的eval和with小白攻略_with入门教程

    eval和with经常被嫌弃,好像它们的存在就是错误。在CSS中,表格被嫌弃,在网页中只是用表格来展示数据,而不是做布局,都可能被斥为不规范,矫枉过正。那关于eval和with到底是什么情况呢?本文将详细介绍eval()函数和with语句 eval定义eval()是一个全局函数,javascript通过eval()来解释运行由javascript源代码组成的

    2020/03/24
  • vue-cli3.0中自定css、js和图片的打包路径指南教程_打包新手入门

    前言我们有时候因为一些特殊需求,可能需要将js/css/img等资源文件都打包到根路径下,但vue-cli3.0的路径配置中仅有assetsDir配置项能够配置所有的静态文件所在的文件夹,并不能针对css/js/img等资源文件分别来做设置,那么请看我如何尝试的吧!分析众所周知,vue-cli3.0使用了webpack进行打包处理,那么我们是否可以拿到目前打

    2020/03/26