Cypress - 下拉選單

select 命令用於處理靜態下拉選單。在 HTML 程式碼中，下拉選單使用 `select` 標籤，下拉選單項由 `option` 標籤表示。

下拉選單 Cypress 命令

下拉選單相關的 Cypress 命令如下：

• 選擇**Cypress**選項的命令如下：

cy.get('select').select('Cypress')

• 選擇 Tutorialspoint 和 JavaScript 選項的命令如下：

cy.get('select').select(['Tutorialspoint', 'JavaScript'])

• 可以選擇下拉選單選項的值以及選項**(修改預設特性)**的命令如下：

cy.get('select').select('option1', options )

• 選擇**多個值並帶有選項**的命令如下：

cy.get('select').select(['option1', 'option2'], options)

Cypress 中下拉選單的選項

Cypress 中下拉選單可用的選項如下：

• **log – 預設值 – true** – 用於啟用/停用控制檯日誌。

• **timeout – 預設值 – defaultCommandTimeout(4000)** – 用於設定在丟擲錯誤之前選擇的最大等待時間。

• **force – 預設值 – false** – 用於強制執行操作。

可以在 Cypress 中的 `select` 命令上應用斷言。

讓我們嘗試從 HTML 程式碼中值為 99 的下拉選單中選擇**印度**選項。

實現

下面解釋了在 Cypress 中使用下拉選單命令選擇印度選項的實現：

// test suite
describe('Tutorialspoint', function () {
   // it function to identify test
   it('Scenario 1', function (){
      // test step to launch a URL
      cy.visit("https://register.rediff.com/register/register.php")
      //select option India with value then verify with assertion
      cy.get('select[id="country"]').select('99').should('have.value', '99')
   })
})

執行結果

輸出如下：

輸出顯示“國家”下拉選單選擇了印度選項（在 HTML 程式碼中，此選項的值為 99）。