假設我div在 DOM 中有'200px'一個寬度為的和class一個'target'。
為了用柏樹測驗它的寬度，我應該寫下面的代碼：
cy.get('.target').should('have.css', 'width', '200px');
還有一堆測驗，測驗元素的寬度和高度......
...
今天發生了一件奇怪的事情！
所有這些測驗都失敗了，因為width找到的 cypress的值200.0000000000032038879956012px不是200px!!!
我想到的第一個解決方案是在實際數字（例如，）上測驗它們，而不是柏樹發現200的字串（例如， ）；'200px'我認為這是一個昂貴的想法！
你覺得我怎么能克服這個問題！？
uj5u.com熱心網友回復：
無需任何轉換即可匹配，
cy.get('div')
.invoke('css', 'width')
.should('match', /200.*px/) // matches 200.0000000000032038879956012px or 200px
uj5u.com熱心網友回復：
測驗斷言.should('have.css', ...)是Window.getComputedStyle()的包裝器，它在應用所有 CSS 后讀取實際呈現的值。
它并不總是對應于行內樣式或通過樣式表應用的“輸入”設定，具體取決于其他設定，如對齊、彈性設定、媒體查詢。
從測驗的角度來看，你可以切換到測驗“輸入”引數，
- 對于行內樣式
.should('have.attr', 'style', 'width: 200px') - 用于樣式表
.should('have.class', 'target')
或者使用chai-almost插件來檢查關閉的數值。
const chaiAlmost = require('chai-almost');
chai.use(chaiAlmost(1)) // 1 pixel variance
cy.get('.target')
.invoke('css', 'width') // extract computed width
.then(widthStr => widthStr.replace('px', '')) // convert to number
.should('almost.equal', 200); // approximate 200 /- 1 px
uj5u.com熱心網友回復：
您可以先將 200px 轉換為數字，然后檢查該數字是否在范圍內。就像是：
cy.get('.target')
.invoke('css', 'width')
.then((width) => {
expect( width.replace('px', '')).to.be.within(200, 201)
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/482686.html