[英]How to extract text from an element in Cypress ,store it into variable and manipulate it
I am getting to a point that i can cy.log() the text that is inside that element but i can't find a simple solution where i can get that text, store it and manipulate it for later tests.我已经到了可以 cy.log() 该元素内的文本的地步,但是我找不到一个简单的解决方案来获取该文本,存储它并对其进行操作以供以后测试。
it('login to my eshop that uses virtual currency' , function() {
cy.visit('my favorite shopping site')
cy.get('#username').type('user')
cy.get('#password').type('pass')
cy.get('balance element').then(function(text1){
cy.log(text1.text())
///I see the text but that's pretty much it.
})
})
I do not need an assertion for this particular case.对于这种特殊情况,我不需要断言。 I am trying to get a current balance, do some purchase testing and compare initial balance with remaining balance.
我正在尝试获取当前余额,进行一些购买测试并将初始余额与剩余余额进行比较。
Any suggestions would be greatly appreciated, spent couple of days searching, trying and editing but i am stuck do the async nature of cypress.任何建议将不胜感激,花了几天时间搜索、尝试和编辑,但我坚持使用 cypress 的异步特性。
Try:尝试:
cy.get('balance element').invoke('text').then((text) => {
cy.wrap(text).as('balanceText');
});
Do this in beforeEach
then you can use it in further it
-functions like this:在
beforeEach
中执行此操作,然后您可以进一步使用it
- 功能如下:
it('my test', function () {
console.log(this.balanceText);
})
In your case, you can return the value from your then()
command and have the value available in a subsequent command.在您的情况下,您可以从
then()
命令返回值,并在后续命令中使用该值。
it('login to my eshop that uses virtual currency' , function() {
cy.visit('my favorite shopping site')
cy.get('#username').type('user')
cy.get('#password').type('pass')
cy.get('balance element')
.then(function(text1){
return text1.text()
}).then(function(text) {
// code that uses the `text` variable
});
})
Option 1:选项1:
let balance;
it('Test case 1 Return variable', () => {
cy.get("balance element").invoke("text").then(cy.log).then((text) => {
balance = text;
return text;
})
});
it('Test case 2 Use variable', () => {
cy.log(balance)
});
Option 2选项 2
let balance;
it('Test case 1 Return variable', () => {
cy.get('balance element').invoke("text").then((text) => {
cy.log("Text", text).then(() => {
balance = text;
return balance;
})
});
});
it('Test case 2 Use variable', () => {
cy.log(balance)
});
Option 3 You can use the approach which the log:added event选项 3 您可以使用 log:added 事件的方法
// top of spec // 规格顶部
const logs = []
Cypress.on('log:added', (log) => {
const message = `${log.consoleProps.Command}: ${log.message}`
logs.push(message)
})
Then in your it block然后在你的 it 块
it('writes to logs', () => {
cy.get('balance element').invoke('text').then((text) => {
const balance = text
cy.log('balance', balance)
cy.writeFile('cypress/fixtures/logs.txt', balance)
})
});
Ok with the help of all your answers and about 1 day of trying this flow worked for me.好的,在您所有答案的帮助下,大约 1 天的尝试此流程对我有用。 I am leaving this edited snippet in case someone else finds it helpful.
我将留下这个编辑过的片段,以防其他人发现它有帮助。 I am sure more experienced developers or testers can do that with a lot less lines.
我相信更有经验的开发人员或测试人员可以用更少的代码来做到这一点。
/// <reference types="cypress" />
let balance;
let productPrice;
let productPricenum;
let balanceAfter;
let finalCalculation = balance - productPricenum;
it('Buy a product and assign balance and cost variables', () => {
///Login proccess - custom commands
cy.home()
cy.login()
///Get your initial balance
cy.get('balance element here').invoke("text").then(cy.log).then((text) => {
balance = parseInt(text);
return text;
})
/// Get the products price from the product page, extract the price from the string and convert price string to int. Assign final calculation to variable
/// Since i get the numbers from dynamic elements i had to parseInt one and split and parseInt the other to make numerical calcs
cy.visit('product page')
cy.get('product price element here').invoke('text').then(cy.log).then((text) => {
productPrice = text.split(' ')[1];
productPricenum = parseInt(productPrice);
finalCalculation = balance - productPricenum;
})
///Buy the product - this will differ from case to case and perhaps needs more steps to the final purchase
cy.get('element to click to purchase the product eg. buy now button').click()
///return to homepage after purchase in case the balance isn't auto-refreshed
cy.home()
///Get your new balance again after the purhcase
cy.get('balance element here').invoke("text").then(cy.log).then((text) => {
balanceAfter = parseInt(text)
return text;
})
});
it('print out the variables just because you like to see what you got', () => {
cy.log('My current balance is :' + balance)
cy.log('Product costs: ' + productPrice)
cy.log('After buying it i have:' + finalCalculation)
cy.log('My new balance is now: ' + balanceAfter)
console.log('Balance is a ', typeof balance + ' and it is ->' + balance)
console.log('Product price is a ', typeof productPrice + ' and it is ->' + productPrice)
console.log('Converted Product price is a ', typeof productPricenum + ' and it is ->' + productPricenum)
console.log(`I must be left with : ${balance - productPricenum}`)
console.log('My new balance is: ' + balanceAfter)
})
it('Assert that the deduction of the cost was proper by comparing the numbers', () => {expect(finalCalculation).to.equal(balanceAfter)})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.