javascript - 如何使用 codeceptjs 访问 vuetify-component

Question

我想用 codecept.js 编写一些测试，但我无法访问 vuetify 组件。

    <v-layout>
      <v-flex xs7>
        <v-text-field
          ref="video1min"
          v-model="video1min"
          :rules="[rules.required, rules.youtubeVideo]"
          clearable
          class="pt-0"
          placeholder="Youtube Link"
        />
      </v-flex>
      <v-flex xs5>
        <v-checkbox
          v-model="defaultVideo"
          v-ruid="'defaultVideo'"
          label="Default Video"
          color="primary"
          class="default-video"
          @change="setDefaultVideo"
        />
      </v-flex>
    </v-layout>

我添加了一个v-ruid通常可以像这样单击的：

I.click('[data-ruid=defaultVideo]');

但是使用 vuetify 组件，我总是收到该错误消息：element not interactable

这是因为data-ruid被添加到复选框周围的 div 中。如何直接访问复选框？

Answer 1

您可以使用 CSS 选择器来获取input内部的 dom 元素。

这个选择器应该可以工作：

'[data-ruid=defaultVideo] input'

编辑：

如果v-checkbox你也可以点击标签。

选择器是：

'[data-ruid=defaultVideo] label'