[英]Cypress POM approach | How to read fixtures data in POM_Page.js file in cypress
I am new to cypress and trying to create framework on POM.我是 cypress 的新手,正在尝试在 POM 上创建框架。 I have followed these steps for creating framework
我已按照这些步骤创建框架
{
"RxClaims_LoginPage":
{
"UserName":"#f0",
"Password":"#f1",
"SignInButton":"#xlg0003"
}
}
/// <reference types="Cypress" />
import ORLoginPage from '../PageObjects/OR_Login'
describe('OR_Approach',function(){
it('RxClaimsLogin', function() {
const login = new ORLoginPage();
cy.visit('/')
cy.wait(2000)
login.EnterData_In_UserName()
login.Password()
login.SignInButton()
})
})
3.And I have created one other folder under Integration>POM which consists all the POMs - one of them named OR_Login.js looks like 3.我在 Integration>POM 下创建了另一个文件夹,其中包含所有 POM - 其中一个名为OR_Login.js看起来像
class ORLoginPage{
EnterData_In_UserName()
{
cy.fixture('example').then(function (dataJson) {
this.testData = dataJson;
})
cy.fixture('locators').then(function (oRdata) {
this.objRep = oRdata;
})
cy.enterDatainTextBox(this.objRep.RxClaims_LoginPage.UserName,this.testData.UserName)
return this
}
Password(){
return 'cy.enterDatainTextBox(this.objRep.RxClaims_LoginPage.Password,this.testData.Password)'
}
SignInButton(){
return 'cy.clickOnObject(this.objRep.RxClaims_LoginPage.SignInButton)'
}
}
export default ORLoginPage;
Cypress.Commands.add('enterDatainTextBox', (textBoxElePath, textValue) => {
cy.get(textBoxElePath).type(textValue)
})
So my question is I want to access locators.js data for all the functions in OR_Login.js .所以我的问题是我想访问 or_Login.js 中所有函数的locators.js数据。 I have tried beforeEach method for test files which works fine but when i use it in any class like OR_Login.js it does not work.
我已经尝试过用于测试文件的beforeEach方法,它工作正常但是当我在任何 class 中使用它时,比如OR_Login.js它不起作用。 Please suggest some way so data for fixtures can be read in POM class files.
请建议一些方法,以便可以在 POM class 文件中读取灯具数据。
The beforeEach()
way will not work in OR_Login.js
because it is not a test file, and mocha is not executing that file. beforeEach()
方法在OR_Login.js
中不起作用,因为它不是测试文件,mocha 不执行该文件。
Instead, you can simply import the JSON file as a variable to OR_Login.js
and use that variable.相反,您可以简单地将 JSON 文件作为变量导入
OR_Login.js
并使用该变量。
// OR_Login.js
const locators = require('./path/to/locators.json');
class ORLoginPage {
...
Password(){
return cy.enterDatainTextBox(locators.RxClaims_LoginPage.Password,locators.Password)
}
...
}
If you have dynamic data that will change based on the class, you could also create your class with a constructor that would point it to the correct data in the locators.json
file.如果您有将根据 class 更改的动态数据,您还可以使用构造函数创建 class,将其指向
locators.json
文件中的正确数据。
All of that being said, Cypress strongly urges you not to use POM with Cypress.综上所述, 赛普拉斯强烈建议您不要将 POM 与赛普拉斯一起使用。 If you do choose to continue using the POM with Cypress, I'd highly recommend that all of your functions you execute in a test are contained within the class that executes the code (instead of mixing
cy.
and your class in the test), as well as look into how you can better chain your command off of one another, so that they are executed in the same cypress command chain.如果您确实选择继续将 POM 与 Cypress 一起使用,我强烈建议您在测试中执行的所有函数都包含在执行代码的 class 中(而不是在测试中混合
cy.
和您的 class),以及研究如何更好地将命令彼此链接起来,以便它们在同一个 cypress 命令链中执行。
The problem with using POM with Cypress, it works against the Mocha hooks like beforeEach()
which are very useful for readable tests.将 POM 与 Cypress 一起使用的问题是,它与像
beforeEach()
这样的 Mocha 挂钩一起工作,这对于可读测试非常有用。
But classes have constructors which might be used to fill your this.testData
.但是类有构造函数可以用来填充你的
this.testData
。
class ORLoginPage{
constructor() {
cy.fixture('example').then(function (dataJson) {
this.testData = dataJson;
})
cy.fixture('locators').then(function (oRdata) {
this.objRep = oRdata;
})
}
EnterData_In_UserName() {
cy.enterDatainTextBox(this.objRep.RxClaims_LoginPage.UserName, this.testData.UserName)
return this
}
Password() {
...
}
SignInButton(){
...
}
}
export default ORLoginPage;
The cy.fixture()
is async because it reads a file, so it may be better to use an init()
method. cy.fixture()
是异步的,因为它读取文件,因此最好使用init()
方法。
This will be useful for any async commands you have in the POM.这对于 POM 中的任何异步命令都非常有用。
class ORLoginPage{
init() {
return new Promise((resolve, reject) => {
cy.fixture('example').then(function (exampleData) {
this.testData = exampleData
cy.fixture('locators').then(function (locatorData) {
this.objRep = locatorData;
resolve(true)
})
})
}
}
...
/// <reference types="Cypress" />
import ORLoginPage from '../PageObjects/OR_Login'
describe('OR_Approach',function(){
it('RxClaimsLogin', async function() { // add async to the test
const login = new ORLoginPage();
await login.init()
cy.visit('/')
cy.wait(2000)
login.EnterData_In_UserName()
login.Password()
await login.SignInButton() // may be useful to await other async methods
})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.