如何在稍后的测试中重用产生的值

Question

上下文：我在第 1 页有一个带有 innerText 的元素，在第 2 页有另一个带有 innerText 的元素。我需要比较第 3 页中的这两个值。所以我需要找到一种方法将这些值保存在全局变量中，以便它们可以稍后使用。

我尝试过的事情：

试验 1：不起作用，因为 page1value 范围仅限于 cy.get()

  cy.get('#selector').invoke('text').then(text => {
      const page1value = text
  })

试验 2：每当我尝试在外部打印值时，它都不起作用，它是未定义的或初始化时使用的值。

it('TC Name', () => {

    let page1value,
        cy.get('#selector').invoke('text').then(text => {
            page1value = text
        })

    cy.log(page1value) //comes as undefined

})

试验 3：使用 .as() 以及它的到来是未定义的。

let page1value;
cy.get('#selector').invoke('text').as('page1value');
cy.log(page1value) //comes as undefined

如果有人能告诉我我哪里做错了，那就太好了。

Answer 1

赛普拉斯命令被推入（入队）一个队列（称为命令队列——基本上是一个数组），然后串行（一个接一个）和异步执行。

虽然您的cy.log()will 也将异步执行，但在上一个命令之后，您传递给它的值 ( page1value) 将同步传递/评估，在您将命令推送到队列时（在回调传递给的时间评估it()为称为---在测试开始时）。

这只是常规的 JavaScript 行为，与 Cypress 无关。所有命令cy.*都只是cy对象上的方法（函数），它们会被立即调用。没有立即调用（执行）的是每个命令执行的逻辑（例如，查询您提供给的选择器的 DOM，cy.get()调用时记录到命令日志cy.log('string')等）。

因此，在您的第二个示例中：

1. 你声明page1value。
2. 然后立即将命令cy.get()、cy.invoke、 加入队列cy.then()。
3. 你也立即入队cy.log，你传递给它page1value（此时仍然是undefined）。
4. 在所有命令排队后，它们开始执行，从上到下。当cy.then命令轮流执行时，page1value变量被赋值，但在测试的其余部分不再在任何地方使用（读取）它（回想一下，当您cy.log在上一步中将它传递给命令时，您已经读取了它）。

因此，您想要做的是：

cy.get('#selector').invoke('text').then(text => {
  cy.log(text);
});

在您的第三个示例中，如果您为某些内容设置别名，则需要使用另一个命令访问该值（请记住，一切都是异步的，因此您无法像您一样以同步方式访问异步设置的值），在这种情况cy.get('@aliasName')：

cy.get('#selector').invoke('text').as('page1value');
cy.get('@page1value').then( value => {
  cy.log(value);
});

请注意，为简单起见，上述解释略有不准确和不详尽（幕后还有更多事情发生）。但作为对事物如何运作的介绍，他们应该这样做。

无论如何，您绝对应该阅读赛普拉斯简介。

您还可以查看我涉及相关概念的旧答案：

• 如何在 Cypress 的 API 调用中使用变量作为参数
• 在 Cypress 中何时使用自定义命令与任务？