Cypress系列(53)- as() 命令詳解

如果想從頭學起Cypress,可以看下面的系列文章哦

//www.cnblogs.com/poloyy/category/1768839.html

 

作用

  • 起別名以供以後使用
  • 可在 cy.get() 或 cy.wait() 命令中引用別名

 

語法格式

.as(aliasName)

 

正確格式

// 給第一個 li 元素起別名
cy.get('.main-nav').find('li').first().as('firstNav')

// 給網路請求的響應起別名
cy.route('PUT', 'users', 'fx:user').as('putUser')    

 

引用別名的方式

 cy.get() 或 cy.wait() 命令中使用@前綴引用的別名的名稱,如 @firstNav 、 @putUser 

 

簡單的栗子

一般 .wrap()  和 as() 配對使用

 

cypress 程式碼

兩個測試用例

  1. 獲取元素,再進行判斷
  2. 獲取 wrap() 生成的對象,然後再對它進行操作

 

測試結果

 

結合 fixture() 的栗子

程式碼一

cy.fixture('users').as('users')
cy.log(`變數name${this.users.length}`

 

測試結果

 為什麼報錯呢

  • 是因為 Cypress 的命令是非同步的
  • 因此,無法同步訪問別名的任何內容(第二行)
  • 必須使用其他非同步命令( 例如.then() )來訪問已別名的內容

 

程式碼二

cy.fixture('users').as('users').then(function () {
     cy.log(`變數name${this.users.length}`)
})

用 this. 調用別名

 

測試結果

 

結合 get() 的栗子

cypress 程式碼

it('via get().', () => {
    cy.fixture('users.json').as('admins')
    cy.get('@admins')
    .then((users) => {
        cy.log(`There are ${users.length} admins.`)
    })
})

 

測試結果