Testcafe - 根據下拉選擇填充輸入字段

Question

無論如何，我都不是 Javascript 方面的專家，只是在我非常喜歡的 testcafe 中轉了一圈。

然而，作為一個簡單的測試，我試圖根據從下拉列表中選擇的內容填充輸入字段。 真的很簡單，它是一個 Title 字段，所以是 Mr、Mrs 等。根據是否選擇了“Mr”，然后用男性姓名填充。 如果'夫人'然后填充將女性名字。

但是，一旦選擇將其傳遞到我的 If...else 語句中，我將無法讀取選擇的值，並且它總是轉到默認的最后一個選項。 有人可以幫助我嗎？

我的代碼：

import { Selector } from 'testcafe';

const TitleSelect = Selector('#title');
const TitleOption = TitleSelect.find('option');
const FirstName = Selector('#firstname');

fixture `Getting Started`
.page //any page with a Title dropdown and Firstname input field;

test('My first test', async t => {
await t
    .click(TitleSelect)
    .click(TitleOption.withText('Mrs'))

    if (TitleOption === 'Mr') {
        await t
        .wait(1000)
        .typeText(FirstName, "Wayne")

    } else if (TitleOption === 'Mrs') {
        await t
        .wait(1000)
        .typeText(FirstName, "Waynetta")

    } else {
        await t
        .typeText(FirstName, "something else");
    } 

    await t
    .takeScreenshot({
        path: 'If_else_statment.jpg',
        fullPage: true
      })
    .wait(2000)   
    ;        
  });

Answer 1

您可以使用以下代碼獲取輸入的 state：

const value = await TitleSelect.value;

更多信息請參考https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors/using-selectors.html#obtain-element-state