unit-testing 相关问题

我有一个这样的组件：我有这样一个组件： <template> <q-select clearable :disable='disable' emit-value :error='error' error-message='Invalid Equipment Number' fill-input hide-dropdown-icon hide-selected hint='Minimum 4 characters to trigger autocompletion' input-debounce='100' :label='label' :loading='loading' map-options :model-value='mValue' :options='options' outlined :readonly='readonly' use-input @clear='onClear' @filter='filterFn' @input-value='setValue' > <template v-slot:no-option> <q-item> <q-item-section class='text-grey'>No results</q-item-section> </q-item> </template> </q-select> </template> <script lang="ts"> import EquipmentApi from 'modules/Config/models/Equipment/EquipmentApi' import { IEquipment } from 'modules/Config/models/Equipment/EquipmentInterface' import { defineComponent } from 'vue' export default defineComponent({ name: 'MyEquipment', props: { value: { required: false, type: Number }, label: { required: false, default: 'Equipment', type: String }, readonly: { type: Boolean, required: false }, disable: { type: Boolean, required: false }, error: { type: Boolean, default: false, required: false }, }, emits: { fill(equipment: IEquipment) { return equipment }, 'update:value'(val: number) { return val } }, data() { return { mValue: null as number|null, options: [] as number[], loading: false } }, computed: { isEquipment() { return (this.mValue)?.toString().length === 8 } }, watch: { value(val) { this.mValue = parseInt(val) } }, methods: { filterFn(val: any, update: any, abort:any) { if (val.length < 4) { abort() return } update(() => { this.loading = true EquipmentApi.filter(val).then((response: { data: number[] }) => { this.options = response.data this.loading = false }) }) }, setValue(val: string|number) { this.mValue = parseInt(val) this.$emit('update:value', this.mValue) }, onClear() { this.mValue = null }, }, }) </script> 我在使用该组件时，需要在输入文本中输入至少4个字符，该组件会根据这4个字符显示下拉选项，如下所示：但是我无法使用 vitest 单元测试来复制行为。这是我写的单元测试： import { installQuasarPlugin } from '@quasar/quasar-app-extension-testing-unit-vitest' import { mount } from '@vue/test-utils' import EquipmentField from 'src/modules/Application/components/Form/EquipmentField.vue' import { describe, expect, it } from 'vitest' function sleep(milliseconds) { return new Promise((resolve) => { setTimeout(resolve, milliseconds) }) } installQuasarPlugin() let wrapper = null describe('Equipment field unit test', async () => { beforeEach(() => { wrapper = mount(EquipmentField) }) it('should have a list of equipment code after we fill the input, and the list\'s first row has text in it', async () => { wrapper.find('input').setValue('1234') sleep(2000) console.log(document.querySelectorAll('[role=option]').length) // length = 0. It means the dropdown is not created }) }) 我发现在实际使用中，会调用 filterFn 函数并填充选项。但不是在单元测试中。那么如何在vitest单元测试中触发filterFn函数呢？目标是使下拉菜单出现。因为我确定下拉菜单没有出现在我的单元测试中。

vue.js unit-testing vuejs3 quasar vitest

回答 0 投票 0

React 测试库包装组件

我似乎遇到了一个问题，我有一个组件，里面有一个围绕 jsx 的模板包装器，这个模板包装器是带有选项卡等的标题，它看起来像这样： const 组件 =() =...

reactjs unit-testing react-testing-library

回答 0 投票 0

为什么剧作家认为使用 xpath 不好？

上下文：我想和 playwright 一起测试我的 React 应用程序。我有两个几乎相同的按钮（两个按钮的名称绑定到相同的状态，它们总是具有相同的名称）。因此...

java reactjs unit-testing testing playwright

回答 0 投票 0

afterviewInit angular怎么写测试用例？

ngAfterViewInit() { var link = document.getElementById("mat-chip-list-0"); link.removeAttribute("aria-multiselectable"); link.removeAttribute("aria-orientation&...

unit-testing ts-jest angular-test

回答 0 投票 0

什么是 Java 中的模拟对象？

我想知道 Java 中的模拟对象是什么。我们为什么要创建它们以及它们的用途是什么？

java unit-testing mocking

回答 6 投票 0

是否需要爬虫测试？

爬虫工具有必要测试吗？以何种方式？我的公司正在使用爬虫工具（通过 API 和 GUI）为客户收集数据。问题有时是目标网站的 GUI ...

unit-testing testing automation web-crawler cicd

回答 0 投票 0

如何使用 Jest、React-Native 酶模拟单元测试中的事件

我正在尝试弄清楚如何在 React-Native 应用程序中使用 Jest 测试“onPress”事件，以便我可以确保调用正确的函数。我浏览了文档和谷歌，但无法找到...