web-dev-qa-db-ja.com

サイプレスでは、名前に基づいて入力要素を選択する方法は？

私はサイプレスを学び始めています。入力フィールドを選択し、cypress.ioを使用して電話番号を入力します。コードは以下の通りですが、機能しません。ただし、Findを使用することも、入力要素が電話番号を入力するようになるもう1つの方法がありますか？

cy.get('div').contains('Phone Number').find('input[name=teacher[0].number]').type('8000-1612023')
 _
<div class="required field">
  <label>Phone Number</label>
  <div title="Teacher number" class="ui fluid right labeled input no-spinners">
      <input required="" type="number" name="teacher[0].number" value="">
      <div class="ui label label">US</div>
  </div>
</div>

 _
javascriptcypress
6
jacobcan118

次のコードを使用して入力フィールドを直接ターゲットにしてください。

cy.get('input[name="teacher[0].number"]').type('8000-1612023')
 _

テストが成功した場合は、以下のスクリーンショットを見つけてください。 HTMLの入力の種類をTELに変更することもお勧めします。

HTML：

<input required="" type="tel" name="teacher[0].number" value="">
 _

サイプレス：

describe('Trial', function() {
it('Test', function() {
    cy.visit('http://localhost:8080/trials/')
    cy.get('input[name="teacher[0].number"]').type('8000-1612023')
})
});
 _

テスト結果：

enter image description here

1
Sam

代わりにこれを試してください：

cy.contains('div', 'Phone Number').find('input').first().type('8000-1612023')
 _

containsの最初の引数は、そのテキストを含むそのセレクタを持つ要素を見つけるためにサイプレスに指示します。

1
bkucera