Leadfeeder 的系统由多个应用程序组成，主要用 Ruby 编写。我们希望确保每个组件都能按预期运行，因此我们用单元测试覆盖代码，对于 Rails 应用程序，还用控制器规范覆盖代码。
然而，有时良好的单元测试覆盖率可能还不够，格鲁吉亚电话号码数据 仍然可能导致经典的“2 个单元测试，0 个集成测试”的情况，就像下面的 meme 中的情况一样：
为了防止这种情况，针对系统中更关键的部分，我们会编写涵盖从上到下的整个功能的 UI 测试。
我们必须处理的一个主要问题是，我们的应用可能可以通过任何设备/浏览器访问。尽管浏览器开发人员试图遵守标准，但每个浏览器的行为都略有不同。
哦，还有 Internet Explorer…
您可能已经想到，我们不会针对市场上所有浏览器运行手动测试。相反，掌握多浏览器测试 我们开发了自己的测试工具包，该工具包可在CrossBrowserTesting 平台上的一组真实设备上运行一套测试。
在这篇文章中，我想一步一步地向您展示我们如何整合所有活动部件以创建这样的工具包——希望您也可以在自己的项目中设置类似的东西。
阅读完本文后，您可以在此存储库中找到整个代码。
注意：免费试用Leadfeeder 14 天。您没看错，免费试用两周。
步骤 0 – 准备被测应用程序
让我们准备一个名为 LinkShortener 的简单 Rails 6.1 应用程序。掌握多浏览器测试 它的唯一用途是根据用户提供的 URL 创建短链接。类似于 bit.ly 的功能。
该应用程序既不美观（我将使用 Rails 生成器生成的默认视图），促进高绩效销售人员的持续培训 也不用户友好，但它足以编写一个简单的 UI 测试套件。
该应用程序由四个端点组成：现在，让我们编写几个简单的规范并将它们放入 中spec/features/links_spec.rb。第一个规范将验证创建和重定向是否正常工作。另一个规范将通过指向无效 URL 来测试尝试保存短链接时的不愉快路径。让我们通过调用来运行测试套件$ bundle exec rspec。输出应如下所示：
第 2 步 – 使用 ngrok 隧道
太棒了，我们有一个可以运行的 Capybara 设置和一个通过测试的套件。很多人会在这里停下来，但我们不会！最终，我们希望 CrossBrowserTesting 的浏览器能够运行我们的测试，所以我们必须以某种方式允许他们的计算机访问 LinkShortener 应用程序。
CrossBrowserTesting 的帮助文档建议使用 SmartBear SecureTunnel CLI，它可以在他们的服务器和您的计算机之间建立 HTTP 隧道。我尝试过使用它，但不得不说体验相当糟糕……很多时候测试会由于连接错误而失败。此外，掌握多浏览器测试 一些 CBT（主要是 Mac/iOS）电话号码 bl 设备无法访问localhost:7654，我不得不通过调用来访问应用程序local:7654。幸运的是，我们不必使用 crossbrowsertesting.com 建议的 CLI，因为ngrok可以帮上忙！
如果您还不了解 ngrok – 它是一个允许您在计算机上设置 HTTP(s) 隧道到所需端口的工具。一旦运行它，您就会收到将流量从互联网路由到本地主机的 HTTP 和 HTTPS URL。
运行 亲自尝试一下$ ngrok HTTP 7654。如您所见，它创建了两个指向 的 URL localhost:7654。不要害怕我们的“专业”计划 – 本教程中所需的功能也可在免费套餐中使用。