去年6月，我有幸在SMX Advanced上介绍了我最喜欢的话题之一:改进SEOs和开发人员之间的协作。
虽然我的演讲是关于用于SEO的JavaScript，但我借此机会介绍了一种实践，我认为它可以解决一个令人痛苦的业务问题:在开发过程中使用自动化测试技术捕获SEO问题，在生产中捕获SEO问题的成本很高。
你多久会在错误的页面上发现一个noindex元机器人标签并导致大量的SEO流量下降?
让我们从一开始就学习如何防止这种错误和类似的错误发生。
专业开发中的自动化测试
现代的专业开发人员需要快速地添加新特性或修复bug，通常依赖自动化测试来保持代码的高质量。
在我的会话中，我提到这是一个完美的地方，以尽早捕获一些SEO错误，在他们的损害太昂贵之前。
在本文中，我们将详细探讨这个概念，回顾一些实际示例，并概述开发人员和SEO的职责。
对现代web应用程序前端的剖析
现代web应用程序的前端通常使用控制器、视图和组件以模块化的方式构建。
控制器将页面请求路由到应用程序的正确视图，视图是页面加载时看到的。
视图被进一步分解为组件。例如，在搜索页面中，搜索结果网格可以由一个组件提供支持。
这些组件可以在服务器端、客户端或两边呈现，就像混合呈现解决方案那样。
搜索引擎优化范围
理解这些概念很重要，因为不是每个应用程序控制器、视图或组件都需要SEO输入或自动化测试。
一种判断方法是询问组件的功能对搜索引擎爬虫是否可见。
例如，登录表单背后的所有组件或动作都不在SEO的范围内，因为搜索引擎爬虫无法看到它们。
不同类型的自动化测试
自动化测试是一个广泛的主题，但是当涉及到SEO时，我们需要了解两种主要类型的自动化测试:单元测试和端到端测试。
开发人员通常编写单元测试来执行单个组件和方法级别的检查。其思想是验证应用程序的每个部分是否按预期的方式独立地工作。
然而，虽然各个部分可以正常工作，但当它们一起工作时可能会出现故障。这就是集成测试(又称端到端测试)的作用。它们测试组件也可以一起工作。
我们应该在开发期间编写这两种类型的测试来检查SEO问题。
让我们回顾一些实际的例子。
编写SEO单元测试
在准备我的演示时，我编写了一个AngularJS应用程序来监控谷歌趋势主题。我专注于尝试优化它的基本SEO最佳实践。
在Angular中，我们可以使用Jasmine来编写单元测试。让我们回顾一下单元测试是什么样子的，以及我们可以用它们做什么。
例如，让我们看一下应用程序中的Category Topics组件，它负责列出所选类别的谷歌Trends主题。
我们添加了这些单元测试来检查基本的SEO标记。
上面的测试确保组件设置了正确的规范url、页面标题和元描述。
您可以很容易地扩展这个列表，以包括其他元标签，如元机器人和hreflang标签。
在编写了这些测试之后，通常需要在更新应用程序之后执行它们。
下面是使用Jasmine运行它们的方法。在Angular中，你输入命令:ng test
输出是这样的。
当开发人员向网站或应用程序添加新功能，然后运行测试时，他们可以在忘记添加重要SEO标签或引入错误标签时得到即时反馈。
作为SEO，您正在进行的工作之一就是确保单元测试涵盖了新的相关组件。
编写SEO集成测试
接下来，让我们回顾一下我为应用程序编写的一些集成测试，以便您可以看到它们的样子。
在Angular中，我们可以使用量角器来运行端到端测试。
您可能想知道为什么我们需要两种不同的工具来运行自动化测试?
端到端测试通过自动化浏览器来执行我们指定的脚本操作，从而在web浏览器上独家运行。这与单元测试非常不同，在单元测试中，我们可以只运行正在测试的特定后端/前端代码。
如果我们看一下示例应用程序的类别主题页面，就会发现我们添加了端到端测试来检查提前发布的问题。
示例测试将检查基本的SEO标记在页面呈现后是否正确工作。这是一个需要在浏览器中加载页面并等待JavaScript代码执行的测试。
我们添加的一个简单检查是确保