So füllen Sie ein Formular mit dem Vue-Datumswähler Cypress weiter aus
P粉141911244
2023-08-29 18:47:55
<p>Ich habe versucht, das Formular mit Cypress auszufüllen. Das Formular wurde mit Vue erstellt und sieht so aus</p>
<p>Das Problem ist, dass das geplante Datum eine Datumsauswahl ist, die ich mit dem Befehl cypress type() fülle. Zum Beispiel</p>
<pre class="brush:js;toolbar:false;">cy.get('#dispatch-date').type('22-10-2022');
</pre>
<p>So sieht das Formular jedoch nach Eingabe des Befehls aus</p>
<p>Das Dropdown-Menü zur Datumsauswahl deckt den Rest des Formulars ab, sodass Cypress das Formular nicht weiter ausfüllen kann. Ich habe nach der Eingabe des Datums versucht, auf {Enter} zu klicken, aber das Formular wurde abgeschickt. Ich habe auch die Option {force:true} ausprobiert, aber sie hat den Test nicht bestanden, da die Datumsauswahl tatsächlich ein <div>-Tag ist. Irgendwelche Ideen, wie man dieses Problem lösen kann? </p>
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
这将取决于您在应用程序中使用的确切日期选择器，或更准确地说，取决于用户与其交互的方式。
例如，如果它是 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。