如何繼續填寫具有Vue日期選擇器Cypress的表單
P粉141911244
2023-08-29 18:47:55
<p>我嘗試使用 cypress 填寫表格。該表單是用 Vue 建構的，看起來像這樣</p>
<p>問題是，調度日期是我使用 cypress type() 指令填入的日期選擇器。例如</p>
<pre class="brush:js;toolbar:false;">cy.get('#dispatch-date').type('22-10-2022');
</pre>
<p>但是，這就是輸入指令後表單的樣子</p>
<p>日期選擇器的下拉式選單覆蓋了表單的其餘部分，不允許 cypress 繼續填寫表單。我嘗試在輸入日期後單擊 {enter}，但它提交了表單。我還嘗試了 {force:true} 選項，但它使測試失敗，因為日期選擇器實際上是 <div> 而不是 <input> 標記。有什麼想法可以解決這個問題嗎？ </p>
這將取決於您在應用程式中使用的確切日期選擇器，或更準確地說，取決於使用者與其互動的方式。
例如，如果它是 vue2-datepicker，您可能只需關閉該控制項即可觸發其更新。
cy.get('#dispatch-date') .type('{selectAll}22-10-2022') // {selectAll} if not empty .trigger('keydown', {keyCode: 9, which: 9}) cy.get('#dispatch-date') .should('have.value', '22-10-2022')請注意，按一下
元素將關閉選擇器，但該值不會更新為 v-model。