小编Moc*_*ha_的帖子

使用 Vue-Test-Utils 和 Vitest 进行 Vue-Router 模拟

我试图理解用 Vitest 模拟 Vue-Router 的逻辑。

为此,我尝试在一个非常简单的项目上设置和模拟我的测试环境。当我尝试按照Vue-Test-Utils 的官方文档进行操作时,总是出现错误。我不知道是不是因为他们用Jest。

使用真正的 vue-router解决了我的问题,但我认为模拟 vue-router 更好。

下面我先传达一下项目的源码,然后是我收到的错误。

首页.vue

<script setup lang="ts">
import {onMounted} from "vue";
import {useRoute} from "vue-router";

const route = useRoute()

onMounted(() => {
  console.log(route.query)
})
</script>

<template>
  <div>Home</div>
</template>
Run Code Online (Sandbox Code Playgroud)

主页.规格.ts

import {expect, it, vi} from "vitest";
import {mount} from "@vue/test-utils";

import Home from "../src/components/Home.vue"

it('Home Test', async () => {
    const wrapper = mount(Home)

    expect(wrapper.exists()).toBeTruthy()
})
Run Code Online (Sandbox Code Playgroud)

vite.config.ts

/// <reference types="vitest" />
import { defineConfig } from 'vite'
import …
Run Code Online (Sandbox Code Playgroud)

unit-testing mocking vue.js vue-router vitest

8
推荐指数
1
解决办法
7749
查看次数

标签 统计

mocking ×1

unit-testing ×1

vitest ×1

vue-router ×1

vue.js ×1