javascript 如何在Cypress中读取fixture JSON文件?

ljo96ir5  于 2023-09-29  发布在  Java
关注(0)|答案(4)|浏览(197)

我想在我的测试用例中从Cypress中的JSON fixture文件读取数据。
不管出于什么原因,它不起作用。我遵循了几个指示和例子,根本不能使它工作。我做错了什么?
这是我的文件和代码片段。
测试用例:

describe('Test for user data via JSON', ()=> {

 
    // Use the cy.fixture() method to pull data from fixture file
    before(function () {
        cy.fixture('users').then(function (userData) {
            this.userData = userData;
            })
        })

    it.only('Login Test. User1', () => {
        
        cy.wait(500)
        cy.visit('http://localhost/')

        cy.wait(500)

        onLoginPage.usernameInput(this.userData[0].username)
        onLoginPage.passwordInput(this.userData[0].password)
        onLoginPage.buttonGo()

    })
})

JSON文件
文件名:users.json

[
    {
        "id": 0,
        "username": "User1",
        "password": "password1",
        "_comment": "All rights"
    },
    {
        "id": 1,
        "username": "User2",
        "password": "password2",
        "_comment": "All rights"
    },
    {
        "id": 2,
        "username": "User3",
        "password": "password3",
        "_comment": "Reading only"
    }
]

错误消息为:“Cannot read properties of undefined(阅读'users')”错误消息将“u”或“userData”标记为:

onLoginPage.usernameInput(this.**u**serData[0].username)

fixture文件夹按层次结构位于此处:“../fixtures/users”
我看到的例子看起来很简单。不知道我错过了什么。
非常感谢

v440hwme

v440hwme1#

除非您只打算编写一个测试,否则不要使用this上下文来访问fixture数据。
Test Isolation将清除该数据,以确保一个测试不会污染下一个测试的范围。
如果您只打算在登录测试中使用userData,那么可以在该测试中使用cy.fixture()来简化。

it('Login Test. User1', function() {
  cy.fixture('users').then(data => {

    userData = data.find(d => d.username === 'User1')

    cy.visit('/')
    onLoginPage.usernameInput(userData.username)
    onLoginPage.passwordInput(userData.password)
    onLoginPage.buttonGo()
  })
})
bwitn5fc

bwitn5fc2#

尝试在then()中使用箭头函数,就像稍后在only()中所做的那样。箭头函数和“常规”匿名函数的作用域不同,这意味着该函数中的this引用不同的作用域。因此,您可能在不同的对象上设置了userData属性,而不是稍后访问的对象。
注意:我假设您的错误消息指的是this.userData,而不是this.users,因为您实际上从未在代码中读取此属性。

6rqinv9w

6rqinv9w3#

重构箭头函数:将describe,before的箭头函数替换为常规函数,它会阻塞:

describe('Test for user data via JSON', function() {

before(function() {
    cy.fixture('users').then(function(userData) {
        this.userData = userData;
    });
});

it.only('Login Test. User1', function() {
    cy.wait(500);
    cy.visit('http://localhost/');

    cy.wait(500);

    onLoginPage.usernameInput(this.userData[0].username);
    onLoginPage.passwordInput(this.userData[0].password);
    onLoginPage.buttonGo();
});
});

进入固定装置:您当前的代码似乎是正确的。只需确保users.json文件直接位于fixtures文件夹中。
自定义命令:确保在commands.js文件中正确定义了自定义命令(onLoginPage.usernameInput等),并且正确导入了它们。

wvmv3b1j

wvmv3b1j4#

我通过这篇文章找到了一个解决方案:
How to Use cy.fixture along with Array when multiple records in JSON fixture file
我指的是这部分:

cy.fixture('testdata').then(testdata  => {

            const ModuleID = testdata[0].ModuleID 
            const LoginName = testdata[0].LoginName
            const gameid = testdata[0].gameid

        cy.get('#ModuleID').type(ModuleID)
        cy.get('#LoginName').type(LoginName)
        cy.get('#gameid').type(gameid)
        cy.get('#btnSubmit').click()

这样我就可以读取我的.json文件。
我没有做beforeEach,我可以在测试用例中使用它。
谢谢大家帮助我。
用这个解决方案结案。

相关问题