Jestjs 在Vue3中使用Jest测试客户端API（组合API）

我正在为我的应用程序使用

Vue3（typescript）

和

compositionapi

。我正在使用

ApolloClient

grapghql

进行API调用。我已经为API调用创建了一个单独的服务文件。（PFB文件）

服务文件

从“@apollo/client/core”导入{apollo客户端，InMemoryCache，HttpLink}
从“@apollo/client/core”导入{gql}
从“交叉提取”导入提取；
const httpLink=新的httpLink({
uri:process.env.VUE_APP_BACKEND_GRAPHQL_uri，
取来
})
const Apollo客户端=新Apollo客户端({
链接：httpLink，
缓存：新的InMemoryCache（），
})
export const getaploapidata=async（reququery:any）=>{
const query=gql`${reqQuery}`
试一试{
返回等待客户端.query（{query}）
}抓住{
console.log（'API错误'）
}
}

Home.vue

setup（）{
const threatList=ref（[]）
常数威胁=ref（空）
//受到所有威胁
const getThreats=async（）=>{
常量getThreatsQuery=`
质疑{
威胁{
简短描述
威胁等级
}
}
`
试一试{
const result=await getaploapidata（getThreatsQuery）
如果（结果）{
threatList.value=result.data.threats
}
}抓住{
console.log（'接收威胁数据时出错'）
}
}

您能告诉我如何编写测试用例来模拟此API吗？谢谢！

我将

getaploapidata

返回模拟数据，并验证测试中的数据。关键是确保模拟路径与在组件中导入的路径相同：

//Home.vue
从“@/service”导入{getaploapidata}
/*...*/
//Home.spec.js
jest.mock（'@/service'，（）=>{
返回{
Getaploapidata:（）=>({
数据：{
威胁：[{id:123456}]
}
})
}
})
描述（'Home.vue'，（）=>{
它（'获取威胁'，异步（）=>{
常量包装器=浅装（主）
wait wrapper.vm.getThreats（）
expect（wrapper.vm.threatList）.toContaineEqual（{id:123456}）
})
})

---

您好，tony19。谢谢您的回答。但是getThreats无法通过composition API访问。不是吗？我收到了这个错误–TypeError:wrapper.vm.getThreats不是一个函数，即使使用composition API，我也可以访问它。您可以链接到复制吗？当我访问您的git hub演示时，我没有找到404页面。当然可以添加到GIT并将与您共享链接抱歉，已将其公开now@PurniGitHub链接对您有帮助吗？