Question

我正在测试一个集成了Gmail，Slack，Dropbox等的网络应用程序。我正在尝试使用Cypress.io编写端到端测试来验证auth流程是否正常工作。赛普拉斯限制我在应用程序域外导航并给我一个Cross Origin Error。赛普拉斯的文档说，测试不应涉及在应用程序之外导航。但是，测试我的应用程序的整个目的是确保这些外部身份验证流程正常运行。

文档也说你可以添加 “chromeWebSecurity”：false 到cypress.json文件来解决这个限制。我已经做到了这一点，但我仍然得到了交叉原点错误（这是我的问题的核心。我理想地会绕过这个限制）。

我尝试过cypress的单点登录示例。 https://github.com/cypress-io/cypress-example-recipes#logging-in---single-sign-on 我无法使其工作，而且代码比我认为的要多得多。

我在github上对这个帖子发表了评论，但还没有回复。

完整的错误消息：

Error:     CypressError: Cypress detected a cross origin error happened 
on page load:

  > Blocked a frame with origin "https://www.example.com" from 
accessing 
    a cross-origin frame.

    Before the page load, you were bound to the origin policy:
      > https://example.com

A cross origin error happens when your application navigates to a new 
superdomain which does not match the origin policy above.

This typically happens in one of three ways:

1. You clicked an <a> that routed you outside of your application
2. You submitted a form and your server redirected you outside of your 
application
3. You used a javascript redirect to a page outside of your application

Cypress does not allow you to change superdomains within a single test.

You may need to restructure some of your test code to avoid this 
problem. 

Alternatively you can also disable Chrome Web Security which will turn 
off this restriction by setting { chromeWebSecurity: false } in your 
'cypress.json' file.

https://on.cypress.io/cross-origin-violation

Answer 1

如果您要主张对gmail的正确导航...
您应该对处理该函数的函数进行打桩，并断言该请求包含必要的键值对。如果没有有关此测试意图的更多信息，则很难给出具体建议。听起来您好像想要一个“间谍”（测试类型为double）。

以下是间谍的文档： https://docs.cypress.io/guides/guides/stubs-spies-and-clocks.html#Stubs

如果您要验证电子邮件的内容
您将需要使用一个库来处理gmail。 cy.task可用于从外部库调用javascript。这篇中型文章很好地写了如何做到这一点。

中篇文章：https://medium.com/@levz0r/how-to-poll-a-gmail-inbox-in-cypress-io-a4286cfdb888

TL；文章的DR
-设置并定义将检查gmail（在示例中使用“ gmail-tester”）的自定义任务（方法）
-使用cypress触发电子邮件（很明显）
-捕获/定义数据（如电子邮件主题，动态链接，电子邮件内容）
-确认gmail-tester返回的数据符合预期

不要
在您的测试中使用GMail UI，以避免测试出现问题（所有UI测试都带有脆弱性），并且可能会对Gmail应用程序进行可能的UI更改，而这些更改需要更新您的测试。与UI相比，gmail-tester使用的后端方法不太可能随时间变化。您还可以避免CORS错误。

如果必须要禁用跨域安全性（请注意漏洞！）
如果需要，请将chromeWebSecuirty: false添加到cypress.json配置文件中。确保将其添加到花括号内。该文件中应该只有一组大括号。

注意：：一个人不能简单地使用 cy.visit(<diffSuperDomain>)；有一个开放的issue。显然，这是对柏树进行的非常困难的改变。

一种可能的解决方法是每个测试仅拥有一个超级域。如果将chromeWebSecurity:设置为false并且每个测试只有一个域（it块），则该方法应该起作用。小心，因为它会使您面临级联故障，因为一个测试将依赖于下一个测试。希望他们能尽快解决此问题。

https://docs.cypress.io/guides/guides/web-security.html#Disabling-Web-Security

Answer 2

对于这些常见情况，有一些简单的解决方法：不要在测试中点击<a>链接，这些链接会在应用程序之外导航。无论如何，这都不值得测试。您应该问自己：单击并转到另一个应用程序有什么意义？您可能只关心href属性是否符合您的期望。因此，对此进行断言。在我们的“制表符处理和链接”示例食谱中，您可以看到更多测试锚链接的策略。

您正在测试使用单点登录（SSO）的页面。在这种情况下，您的Web服务器可能会在超域之间重定向您，因此您会收到此错误消息。您可以通过使用cy.request()自己手动处理会话来解决此重定向问题。

如果您发现自己陷于困境并且无法解决这些问题，则可以在cypress.json文件中进行设置。但是在这样做之前，您应该真正理解并阅读这里的推理。

// cypress.json

{
  "chromeWebSecurity": false
}

赛普拉斯e2e测试 - 如何解决Cross Origin Errors？

2 个答案: