【.com快译】在每一个Web应用中，作为用户直接可见的应用外观，“前端”包括：图形用户界面、相应的功能、以及它的整体站点可用性。可以毫不夸张地说：如果您的前端工作不正常，您将无法将新的潜在用户“吸引”到您的网站。这也是我们需要对Web应用进行前端测试的一个重要原因。为了保证web应用程序相应的前端无论发生什么变化都能够“隔离”bug，我们需要对前端进行各种测试，主要包括：测试前端的基本功能应用程序、用户界面和整体可用性。此外，以下因素也是驱动我们测试的其他方面：开发人员对JavaScript文件所做的更改通常会导致前端无法正常工作。即使对CSS进行很小的修改，也可能会破坏前端布局的外观，因此我们需要进行CSS回归测试。对于代码更改，应检查操作性能。由于前端测试往往涉及到上述几个方面，常常使测试人员面临各种新的挑战，因此需要借助专门的测试工具和框架来提高效率。在本文中，我们将讨论九种可以加快测试过程的前端测试工具和框架。1.Jasmine(https://jasmine.github.io/)Jasmine是Angular推荐给开发者广泛使用的最流行的前端测试框架之一。它是一个行为驱动的开发框架，可用于测试各种JavaScript代码。作为最古老的框架之一，它不仅拥有广泛的社区支持和资源，还可以帮助开发者通过简洁的语法快速编写不同的测试代码。而且，由于不依赖于任何其他JavaScript框架，用户可以通过Jasmine框架轻松快速的执行各种场景的前端测试。2.LambdaTest(https://www.lambdatest.com/)跨浏览器测试是Web应用测试的重要组成部分之一。它确保程序功能和跨浏览器、操作系统和设备的兼容性。但是，与手动测试相比，测试人员通常使用快速自动化的跨浏览器测试工具，例如LambdaTest。LambdaTest可以为超过2000种浏览器和不同Web应用程序操作系统的组合提供支持，因此测试人员可以在单个系统上对其Web应用程序进行多项测试。另外，它的配置并不复杂，只需要输入目标站点的网址，然后在里面选择具体的浏览器和对应的操作系统即可。此外，它还具有以下功能：实时测试、屏幕截图测试以及Chrome扩展和WordPress插件的外部录制和回放。3.Jest(https://jestjs.io/)Jest是一个受Jasmine启发的JavaScript测试框架，由经验丰富的Facebook团队开发和维护。作为Github上排名第一的测试框架，它拥有22,000颗星。Jest在开发人群中流行的主要原因是它易于使用且无需配置。此外，Jest拥有简洁明了的用户界面，以及高效的加载性能。默认情况下，它与间谍和模拟程序一起构建与测试相关的全局变量。同时还提供快照测试，可以使用内置的测试覆盖工具进行传输。因此，对于想要快速入门前端测试的初学者来说，Jest框架是他们的首选。4.Selenium(https://dzone.com/articles/comparing-top-10-cross-browser-testing-tools-in-20)作为广泛使用的开源前端测试工具，Selenium可以运行在Mac端-在多个平台和浏览器（包括Linux和Windows）上对Web应用程序进行端到端测试。实际上，它是由四种不同的框架组成的测试套件，包括最常用的SeleniumIDE和SeleniumWebDriver。由于它支持几乎所有当前流行的编程语言，它允许测试人员使用不同的语言编写测试脚本，例如Java、PHP或C#。Selenium具有简单直观的界面，使测试人员能够更快地开展测试工作，并提供一定的测试兼容性。此外，作为一款免费工具，它还提供了比一些付费框架更优秀的功能，例如：用户无需学习SeleniumIDE就可以直接使用自己测试的录音和回放功能。5.Karma(https://karma-runner.github.io/)如果你正在寻找最好的运行在浏览器中的测试框架，或者类似浏览器的环境，那么Karma是你理想的选择。作为通用用例前端测试框架，Karma受到了前端测试人员的广泛欢迎。同时可以为Jenkins、Travis等集成框架提供24/7的技术支持。使用Karma框架，您甚至可以在真实设备或HeadlessPhantomJS实例上运行测试。更实际一点，如果你使用Karma作为测试框架，你可以使用下面提到的Mocha或者上面提到的Jasmine来描述你自己的测试。当然，您也可以选择从终端、IDE或使用LambdaTest等服务远程运行测试。6.Mocha(http://mochajs.org/index.html)Mocha作为目前前端测试市场占有重要地位的框架，可以与模拟程序、第三方断言、检测工具等集成作为柴和酶。除了拥有庞大的社区网络，Mocha还可以提供完备的功能选项和完备的文档。由于可以与多种扩展结合使用，Mocha具有很高的兼容性和灵活性。目前，虽然已经有部分用户开始从Mocha迁移到Jest，但其庞大的社区资源和丰富的外部用例资源仍然让它成为名副其实的通用测试工具之一。7.Needle(https://needle.readthedocs.io/)专门用于CSS测试的Needle，可以确保目标Web应用的各种视觉元素（如字体、CSS、图像）能够在指定的屏幕尺寸上显示以及各种在设备上正常显示。通过对用户网站某部分的当前屏幕截图进行截屏，可以与开发者所期望的正常屏幕显示进行对比，进而分析web应用的各种功能。此外，测试人员还可以用它来评估HTML元素的CSS值和位置。8.QUnit(https://qunitjs.com/)QUnit是JavaScript应用程序的单元测试框架。它最初只是为了测试jQuery、jQueryUI和jQueryMobile而开发的。然而，后来的测试人员经常使用它来测试包含JavaScript代码的前端框架。与Junit等其他单元测试框架类似，QUnit不仅可以提供对Web浏览器等客户端环境的支持，还可以通过JavaScript相关的函数，协助测试人员测试浏览器中的代码异常处理等能力。9.YSlow(http://yslow.org/)作为一个专门的工具，YSlow可以以可视化的方式测试Web应用程序的性能。它通过评估页面上所有必需的组件（包括JavaScript等组件）来检查Web应用程序的效率。除了协助测试人员衡量页面的整体性能外，YSlow还可以为他们提供各种有价值的建议。结论众所周知，Web应用程序的外观和功能将对企业网站的访问量产生重大影响。一旦缺少某些组件甚至不兼容，用户就很难愿意再次访问该网站。因此，我们需要通过大量的测试，尽可能多地覆盖网站前端涉及的元素。除了上面给大家介绍的各种流行的测试框架和工具外，业界还有AVA、CypressChai、TestCafe等其他类型的框架。如果您有时间，您可以试用测试工具来找到最适合您手头项目的工具。原标题：ToolsandFrameworksforFasterFrontEndTesting，作者：NikhilTyagi
