赛普拉斯中的异步性和变量覆盖

Question

我的问题是，如何覆盖异步函数中超出此范围的变量？我读到 here 说问题是缺少回调。添加回调后，变量在它被更改的范围之外（但变量本身仍然在正确的范围内）returns“未定义”。我做错了什么？

测试：

const savedVariableCallback = (variable) =>
  console.log(`Variable saved ${variable}`);

describe(() => {
      ...
      it("Sample input type", () => {
         let fixValue;
         cy.fixture("example.json").then(({ email }) => {
            actionsPage
            .selectSampleInput()
            .then((input) => {
               checkAmountOfElements(input, 1);
               checkVisiblity(input);
            })
            .type(email)
            .then((input) => {
               checkIfValue(input, email);
               fixValue = "Nice work";
               savedVariableCallback(fixValue);
            });
         });
         cy.log(`fixValue is: ${fixValue}`);
     });
})

我希望第一个日志显示 Variable saved Nice work，第二个日志显示变量 fixValue is: Nice work。但是现在，我进入了第一个日志 Variable saved Nice work，但在第二个日志中我得到了 undefined。我希望在 it() 方法范围内可以访问该变量。

Answer 1

编辑：由于参考无效，我建议使用 allias

来处理它

const savedVariableCallback = (variable) =>
    console.log(`Variable saved ${variable}`);

describe(() => {
...
    it("Sample input type", () => {
        cy.fixture("example.json").then(({ email }) => {
            actionsPage
                .selectSampleInput()
                .then((input) => {
                    checkAmountOfElements(input, 1);
                    checkVisiblity(input);
                })
                .type(email)
                .then((input) => {
                    checkIfValue(input, email);

                    let fixValue = "Nice work";
                    savedVariableCallback(fixValue);
                    cy.wrap(fixValue).as('fixValue')
                });
        });
        cy.get('@fixValue')
            .then(fixValue => {
                cy.log(`fixValue is: ${fixValue.value}`);
            })
    });
})

Answer 2

如果你改变

cy.log(`fixValue is: ${fixValue}`)

至

console.log(`fixValue is: ${fixValue}`)

可以看到记录的顺序

固定值为：未定义
变量已保存干得漂亮

so cy.log() 抓取命令加入队列时fixValue的值 ，那是在 cy.fixture() 有运行之前，即使它实际上在 cy.fixture().

之后运行s

您可以通过添加另一个 .then()

将其推迟到 cy.fixture() 完成

cy.fixture("example.json").then(data => {
  ...
})
.then(() => {
  // enqueued after the fixture code
  cy.log(`fixValue is: ${fixValue}`)     // now it sees the changed value
})

当然，下游所有需要使用 fixValue 的内容都必须在 .then() 回调中。

你也可以推迟对值的“抢”

cy.then(() => cy.log(`fixValue is: ${fixValue}`))

或将cy.fixture()拆分为before()，这将在测试开始前解析变量

let fixValue;

before(() => {
  cy.fixture("example.json").then(data => {
    ...
    fixValue = ...
  })
})

it('tests', () => {
  cy.log(`fixValue is: ${fixValue}`)     // sees the changed value
})

赛普拉斯中的异步性和变量覆盖

Asynchronicity, and variable overrides in Cypress

javascript

asynchronous

callback

cypress