Translator|陈军审稿人|SunShujuan通常，测试JavaScript的过程对于新手测试人员来说是痛苦的。作为回应，该行业开发了许多现成的工具、技术和框架，以使该过程尽可能简单。其中，Mocha、Jasmine、Jest等工具提供测试结构，Istanbul、Blanket等工具可以生成代码覆盖率相关报告。可以说，在浏览器中，使用不同的方法测试JavaScript代码，往往会产生满足不同要求和目标的结果。仅用一种工具、技术或解决方案很难达到一刀切的效果。本文将向您介绍6种流行的如何在浏览器中测试JavaScript代码的测试方法，它们是：JSFiddleJSBinCodePen跨浏览器测试工具Karam+Jasmine+GoogleChromeLiveweave使用JavaScript，或者使用React或Vue等框架，JSFiddle是一个可以在浏览器中编写和测试JavaScript代码的在线工具。2009年以“Mooshell”之名推出。如果您正在开发Web应用程序并使用某种类型的JavaScript库，那么JSFiddle是一个合适的测试工具。它的界面非常简单，你只需要输入一些JavaScript脚本，甚至添加一些HTML和CSS，你就可以立即看到结果。因此，您可以使用JSFiddle来彻底测试JavaScript片段，然后再将它们添加到您自己的项目中。2.JSBinJSBin是JSFiddle替代品的一个简单干净的版本。如果你想使用一个更容易理解、界面更简洁的工具，那么JSBin会比JSFiddle更适合你。由于该平台同时提供免费和专业的访问权限，只要您成为专业（专业）用户，您就可以享受其高级功能，例如私人垃圾箱和无限同步保管箱。当然，您也可以使用JSBin的通用访问来轻松测试HTML、CSS和JavaScript的任意组合。3.CodePenCodePen是最好的在线测试HTML、CSS和JavaScript代码的工具之一。其开发者社区拥有丰富的资源。目前，作为一个开源学习环境，它不仅拥有高达33万的注册开发者用户，还致力于开发满足各种应用需求的前端应用。可以说是搭建和部署网站、全网推广您的产品、构建测试用例的最佳平台之一。4.跨浏览器测试工具虽然您可以使用JSFiddle和CodePen等工具轻松测试您的JavaScript代码，但这些工具不会向您展示您的目标代码在不同浏览器或移动浏览器中的输出有何不同。如果你想测试你的代码的跨浏览器兼容性，你需要使用像LambdaTest这样可以跨多个浏览器的在线测试工具。目前，跨浏览器测试工具支持实时交互浏览器测试、自动截图测试、响应式布局测试、智能可视化UI测试等。该工具可以大大加快您的测试周期，帮助您排查代码中的特定浏览器问题.5.Karam+Jasmine+GoogleChromeKarma是一个允许您根据各种实现意图在浏览器中测试JavaScript代码的工具。但是它本身无法测试代码，需要依赖Jasmine、Mocha等第三方库来执行代码进行测试。此外，它还需要交付形式中的真实浏览器。也就是说，您必须在本地计算机上安装GoogleChrome才能使用这种JavaScript测试方法。当然，它以无头模式启动谷歌浏览器以执行各种操作。6.Liveweave作为另一个可以用来测试JavaScript代码的在线工具，Liveweave具有实时预览功能，并配备参考标准，帮助您进行响应式设计。它的HTML、CSS和JavaScript代码提示使初学者可以轻松输入基本代码。此外，您还可以使用Liveweave将被测项目下载为.zip文件，以便您可以轻松地在代码中添加和使用包括jQuery、AngularJS和Bootstrap在内的外部库。7.小结除了上面介绍的6种流行的在浏览器中测试JavaScript代码的方法，你还可以使用CSSDeck和Dabblet等工具。它们同样方便且易于使用。当然，各大厂商提供的开发者工具，如Firebug、Chrome等，通常也会提供Javascript控制台，让你可以直接输入JavaScript代码并执行。它们不仅适用于原生浏览器，还适用于InternetExplorer8及以上版本、Opera、Safari和各种新兴浏览器。原文链接：https://dzone.com/articles/how-to-test-javascript-code-in-a-browser译者简介JulianChen，51CTO社区编辑，拥有十余年IT项目实施经验，擅长管控内外部资源和风险，重点传播网络与信息安全知识和经验；持续以博文、专题、翻译等形式分享前沿技术和新知识；经常开展信息化线上线下安全培训教学。
