如何通过spyOn `useMutation`来查看传递的值是什么？
通过使用spyOn函数来监视useMutation函数的调用，并获取传递给它的值。spyOn函数是Jasmine测试框架中的一个功能，用于监视函数的调用情况。
首先，需要在测试文件中导入spyOn函数和useMutation函数。然后，可以使用spyOn函数来监视useMutation函数的调用，并指定要返回的值。
以下是一个示例代码：
import { renderHook } from '@testing-library/react-hooks';
import { useMutation } from 'your-library';
describe('YourComponent', () => {
it('should spy on useMutation and get the passed value', () => {
const mockMutationResult = { data: { id: 1 }, loading: false, error: null };
const spy = jest.spyOn(useMutation, 'useMutation').mockReturnValue(mockMutationResult);
// 在这里调用你的组件或钩子函数
// ...
// 断言是否调用了 useMutation 函数
expect(spy).toHaveBeenCalled();
// 获取传递给 useMutation 函数的值
const passedValue = spy.mock.calls[0][0];
// 断言传递的值是否符合预期
expect(passedValue).toEqual(/* 你期望的值 */);
// 恢复原始的 useMutation 函数
spy.mockRestore();
});
});在上面的示例中，我们首先创建了一个模拟的mockMutationResult对象，它代表了useMutation函数的返回结果。然后，使用jest.spyOn函数来监视useMutation函数的调用，并使用mockReturnValue方法指定返回的值为mockMutationResult。
接下来，我们可以调用我们的组件或钩子函数，并在需要的地方检查useMutation函数是否被调用。通过spy.mock.calls属性可以获取到useMutation函数的调用参数，我们可以从中获取传递给useMutation函数的值，并进行断言。
最后，记得在测试结束后恢复原始的useMutation函数，以确保不会影响其他测试用例。
请注意，上述示例中的your-library和YourComponent需要替换为你实际使用的库和组件名称。
希望这个答案能够满足你的需求，如果有任何疑问，请随时提问。
相关·内容
我正在学习笑话和需要帮助如何测试一个特定的功能在一个角服务。此函数不带参数并订阅get函数，然后将来自订阅的数据传递给其他两个函数。我有模拟数据，但在编写测试时遇到了困难。
public export(): void {
this.getDataValues().subscribe((data) => {
this.exportDelays(data.delay);
this.exportCancels(data.cancels);
});
}
如能提供任何帮助，将不胜感激。
浏览 4提问于2022-10-14得票数 0
1回答
我有一个返回对象的函数
function getSettings() {
return {
foo: 'bar'
}
}
我有一个函数在内部使用上面的函数
function myFunction() {
const { foo } = getSettings()
return foo
}
我有一个测试，我想要更改foo的值
it('', async () => {
const value = '123'
const fooObj = {value: '123'}
jest.spyOn(
浏览 7提问于2021-09-14得票数 0
回答已采纳
1回答
我正在使用Apollo GraphQL编写一个React组件(使用React Apollo Hooks，但这没有什么区别)。 下面是我的问题： const { data, error, loading } = useQuery(ListContacts, {
fetchPolicy: 'cache-and-network'
// variables: { limit: 1000 }
}); 下面是我的函数，它进行了变异： const createContact = useMutation(gql(mutations.createContact));
const del
浏览 12提问于2019-03-25得票数 0
回答已采纳
1回答
在我的角2应用程序中，如何测试我的主方法中的外部方法(依赖项)是否被相应地调用。
例如,
Class ServiceA
{
constructor(
private serviceB : ServiceB
){}
//How do I test this method to make sure it does what it should ?
mainMethod()
{
//External method
this.serviceB.otherMethod();
this.sideMethod();
}
sideMethod
浏览 3提问于2017-03-23得票数 2
回答已采纳
我尝试使用社交登录。
如果我成功登陆卡考。他们给我access_token，我用它对我的服务器进行变异。
下面是我的代码
import { useMutation } from "react-apollo-hooks";
import { KAKAO_LOGIN } from "./AuthQuery";
export default () => {
const kakaoLoginMutation = useMutation(KAKAO_LOGIN, {
variables: { provder: "kakao", acc
浏览 3提问于2021-03-14得票数 0
回答已采纳
我正在寻找一个解决方案，如何触发函数时，所有的请求都已完成。 我使用React Query来管理外部数据状态和useMutation钩子，因为我需要在select更改时重新获取数据。 const fetcher1 = async () => await axios.get('XXX');
const fetcher2 = async () => await axios.get('XXX');
const { data, isLoading, mutate: fetchData1 } = useMutation(fetcher1)
const {
浏览 38提问于2021-04-27得票数 0
我是GraphQL的新手，我有一个关于useMutation钩子的问题。我希望能够通过更新已修改的对象来更新UI，而不是刷新UI。问题是，当我将useMutation钩子的结果传递给update函数时，它将结果显示为未定义的结果，但是查询会遍历并返回响应。
我正在执行useMutation钩子点击一个按钮
<button
onClick={() => {
addTodo('Placeholder') : undefined;
浏览 3提问于2021-09-14得票数 0
1回答
我有一个这样的ts守卫： @Injectable({
providedIn: 'root'
})
export class AppEssentialsGuard implements CanActivate {
private readonly DEFAULT_APP_ID = 'def';
constructor(private appsService: AppsService) {}
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): bool
浏览 14提问于2020-09-07得票数 0
回答已采纳
这是我的密码：
describe('Factory: BaseService', function() {
var fctry, mockBackend;
beforeEach(function() {
module('BaseApp');
cb = function() {};
inject(function(_BaseService_, _$httpBackend_) {
mockBackend = _$httpBackend_;
Base
浏览 0提问于2016-02-22得票数 2
回答已采纳
我有那个脚本
groups: Group[] = []
constructor(
) {
this.groups = AuthenticationService.getUserGroups()
let menuList: any = []
this.groups.map((permission: Group) => {
menuList.push(...this.menuGenerator[permission.nomeGrupo.split('-')[1]])
})
}
当我运行npm run test时，
浏览 0提问于2018-07-12得票数 0
1回答
告诉typescript Variables是myMutation函数的参数接口的正确方法是什么？ interface Variables {
uuid: string;
value: string;
}
const { mutate: myMutation } = useMutation(myGqlMutation); 我想避免像这样使用myMutation： myMutation({
uuid: '....',
value: '....',
} as any); // get rid
浏览 22提问于2020-08-11得票数 1
我有useQuery和useMutation的反应-阿波罗-钩背靠背。我希望能够使用useQuery返回的值作为useMutation的变量。目前，useQuery的值没有及时返回给变量，导致变量未定义。
const { data, error, loading } = useQuery(GET_POSTS, {
variables: {
id: props.match.params.id
}
})
const item = props.match.params.id
const owner = data.posts[0].author.id
const va
浏览 1提问于2019-05-19得票数 3
回答已采纳
考虑以下代码：
const {
mutate: storeData,
} = useMutation(...) // useMutation from @vue/apollo-composable
const sendForm = handleSubmit(async (values) => {
try {
const result = await storeData()
console.log(result)
} catch (e) { // <---- what is the TypeScript type of e?
...
}
})
浏览 8提问于2022-02-06得票数 1
2回答
我目前正在使用阿波罗客户端的useQuery和useMutation挂钩在几个不同的组件中执行相同的功能。我不想重复逻辑，而是创建一个可以将逻辑保持在一个位置的助手函数。
问题在于，useQuery和useMutation是钩子，这意味着它们不能仅仅以函数的形式存在于单独的文件中，而是需要是有效的响应函数组件。
我开始尝试使一些功能发挥作用，但我开始认为这可能是无法做到的。
export function HandleFollow (props) {
const [useFollowUser, { followedData, followError }] = useMutati
浏览 0提问于2021-01-03得票数 2
回答已采纳
我尝试用类型记录来使用function查询useMutation，但是当我想触发我的函数时，仍然会在args上出现错误。我在我尝试谷歌搜索的类型记录中是新的，在堆栈溢出时，我还提供了如何输入useMutation的信息。但是我仍然不明白为什么我会得到错误的TS2345: Argument of type 'string' is not assignable to parameter of type 'Login'
interface Login{
username: string,
password: string
}
interface T
浏览 2提问于2022-06-25得票数 0
回答已采纳
当useMutation (insert/update查询)成功执行时，我需要能够在每个reRender之前或之上执行函数(closeModal)。 如果我从'useMutation‘函数中取消注释onClose函数中的代码，那么从父级中我就不能打开模式(打开、关闭和切换由父级处理，下面的..see ) 模式子模式： export default function DeviceModal(props) {
const device = useQuery(getDevice_query, {variables: {id: dataRowId}});
const [db
浏览 56提问于2021-10-19得票数 0
回答已采纳
我有一个带有useMutation类型的阿波罗TypeScript钩子：
const MY_MUTATION = gql`
mutation($source: String!) {
doSomething(source: $source) {
result
}
}
`
const [myMutation] = useMutation<ReturnPayloadType, MutationVariables>(MY_MUTATION);
当我使用它的时候，它给了我类型的安全性：
myMutation({
variables: {
so
浏览 19提问于2021-07-28得票数 4
回答已采纳
我试图实现登录在反应本机使用阿波罗。在react本地应用程序
const SIGN_IN = gql`
mutation($username: String!, $password: String!) {
signin(password: $password, username: $username) {
user {
username
}
token
}
}
`;
//代码缩写。
function LoginScreen() {
const [signIn, { loading, error }] = useMutation(SIGN_IN,
浏览 1提问于2020-01-08得票数 4
回答已采纳
如果在带有React钩子的函数组件中有以下代码，如果是常量，如何清除useMutation错误？
const [addItemToDB, { error }] = useMutation(addItemMutation);
if (error) {
console.log("error:", error);
return <p>Error :(</p>;
}
浏览 0提问于2020-05-11得票数 0
我正在使用一个定制的React钩子，它使用@apollo/client库来调用GraphQL API。
import {useMutation} from '@apollo/client';
export const useCreateAccount() => {
...
const {loading, error, data} = useMutation(query, options);
...
return [loading ,data, error];
}
在我的组件中，我调用我的自定义钩子：
import {useCreateAccou
浏览 4提问于2022-09-13得票数 1
我有一个组件AddEmployeeModal.vue，在这里我想测试vue/ UseMutation -composable中的UseMutation是否被调用。
// AddEmployeeModal.vue:
import { provideApolloClient, useMutation, useQuery } from '@vue/apollo-composable';
import { apolloClient } from '@/apollo/ApolloClient';
import {
CreateEmployeeDocument,
U
浏览 10提问于2022-06-22得票数 1
我需要使useMutation的useMutation中的一些查询无效。
我有这样一个queryKey模式：
.....
1-["questions", "by_vendor" , "{vendor_code}" , "by_status", "{status}"]
2-["questions", "by_status", "{status}"]
3-["questions", "by_vendor", "{vendor_co
浏览 22提问于2022-11-29得票数 0
回答已采纳
我有这个对象： import keys from './keys'
const obj = {
getData: async funcion(url) {
const key = await keys.getAccess()
return get(url, {
secret: key
}
})
}
} 我想用一个模拟值模拟key变量。我试过了： test('test', async() => {
const spyD = jest.spyOn(obj, 'getData&#
浏览 16提问于2021-10-12得票数 1
我正在为我的React组件编写一些测试：
let DebugElement = TestUtils.renderIntoDocument(<Debug />);
console.log(DebugElement)
spyOn(DebugElement, 'fetchAndSelect');
然而，它说fetchAndSelect并不存在。这是真的。
我这样包装我的组件：
import { DragDropContext } from 'react-dnd';
const Debug = React.createClass({
fetchA
浏览 3提问于2015-09-24得票数 2
因此，使用有两种可能的方法：
直接
const Signup = props => {
const [onSubmit, {data}] = useMutation (SIGNUP_GQL)
return (
...
)
}
export default Signup
临时的
const withMutation = gql => C => props => {
const [onSubmit, {data}] = useMutation (SIGNUP_GQL)
return <C onSubmit={on
浏览 1提问于2019-10-11得票数 0
1回答
我正在上传一个图像在后端使用react查询useMutation。一切都正常工作，但是onSuccess在useMutation中--当invalidateQueries被称为inValidating useQuery --在POST请求在后端成功执行之前。所以我必须刷新页面以获得新的图像。
const { data: usermedia,} = useQuery(["usermedia"],() => {
return getInfo("http://127.0.0.1:8000/usermedia/").then((t) => t.
浏览 5提问于2022-11-15得票数 0
我正在尝试为我编写的一个实用程序编写单元测试，以限制输入字段中可用的字符。该方法接受键盘事件并确定触发了哪个event.code，然后返回true或event.preventDefault()。这很有效，但我不能在jasmine / karma中测试它。
来自模板的当前输入
<input [(ngModel)]="donationValue" formControlName="donationAmount"
type="tel" class="donation-amount" (keydown)="checkCha
浏览 0提问于2017-11-04得票数 3
1回答
我有一个问题，就是如何为下面的函数编写单元测试，函数是使用一系列操作登录用户，如用户输入数据、按(假动作)按钮、向服务器发送请求和向用户发送响应数据，我是否使用Jest和酶，但我不知道如何做，还是我在reactjs中误解了单元测试？
export default function Login({ title }) {
UseStyles(s, n);
Login.propTypes = {
title: PropTypes.string.isRequired,
};
const [email, setEmail] = useState('');
浏览 8提问于2020-01-12得票数 1
回答已采纳
1回答
测试茉莉花中是否有异常
、、、
如何测试中是否捕获了异常
如果删除try...catch语句，则期望是正确的，但我对此不感兴趣。
Spec
import { foo } from './src';
describe('app', () => {
it('should match if an exception was catched', () => {
expect(() => foo()).toThrow();
});
});
源
function foo() {
try {
throw new Error();
} cat
浏览 1提问于2016-03-03得票数 3
1回答
我正在为一个函数xyz编写一个测试，它定义为：
export const socialShare = function( socialType ) {
const url = encodeURIComponent( document.URL );
const text = encodeURIComponent( document.title );
switch( socialType ) {
case 'social-mail':
return `mailto:example@email.com?subjec
浏览 0提问于2019-07-03得票数 1
回答已采纳
我有一个工厂函数，它返回一个React查询突变钩子，如下所示：
function useMutationFactory(mutationFunction: (axios: Axios) => (params: any) => any) {
const baseURL = getBaseURL(); // Retrieves the Base URL (this is dynamic)
const axios = useAxios({baseURL}); // Creates an Axios instance with the URL
...
ret
浏览 9提问于2022-07-21得票数 0
1回答
我有一个包装RESTful API的资源。我使用来自我的控制器的资源来创建新的对象并保存它们，类似于来自角度文档的这个片段：
var newCard = new CreditCard({number:'0123'});
newCard.name = "Mike Smith";
newCard.$save();
在用Jasmine编写单元测试时，执行$save调用时会出现以下错误：“无法读取未定义的属性'$promise‘”。
在包含上述代码的控制器中测试该方法的最佳方法是什么？
浏览 3提问于2014-11-20得票数 1
回答已采纳
我已经创建了一个完整的简化示例，它复制了我遇到的问题。
function TestObj() {
var self = this;
self.getStuff = function(aString, callback) {
// TODO
}
}
describe("server communications", function() {
it("it calls the server", function() {
var obj = new TestObj();
obj.getS
浏览 39提问于2012-05-16得票数 22
回答已采纳
编辑
目前的例子，
it('CALLED THE canOpenURL FUNCTION', () => {
const wrapper = mount(<ResourceCardComponent {...mockProps} />);
const canOpenURLSpy = jest.spyOn(Linking, 'canOpenURL');
wrapper.find('TouchableOpacity').simulate('click');
expect(canOp
浏览 4提问于2017-12-13得票数 2
回答已采纳
1回答
node.js单元测试模拟依赖项
、、、、
我有一个关于使用proxyquire的问题(或者关于如何测试以下代码的任何其他建议)
如果我有以下要测试的文件：
var path = require('path');
module.exports = function (conf) {
var exported = {};
exported.getIssue = function (issueId, done) {
...
...
};
return exported;
};
如何在使用proxyquire模拟'path；var时传入'c
浏览 1提问于2015-11-18得票数 2
我有一个reactjs组件，它有一个doSomething方法：
doSomething()
{
this.setState({
checked: !this.state.checked
}, function () {
if (this.state.checked) {
store.dispatch({type: 'SOMEACTION', data: true});
}
});
}
这个方法/组件的chai/mocha单元测试是什么样子的？如何测试已调用的调度？
浏览 0提问于2017-03-13得票数 3
1回答
尊贵的社区..。
我面临以下问题，感觉很简单，但我找不到解决办法.
我正在测试一个控制器级的角度。它是具有大量依赖项和的遗留代码，我只想编写一个单元测试，而不需要来模拟所有的依赖项。
我正在寻找模拟嵌套函数的解决方案，即我调用一个方法，并期望嵌套方法被成功调用，实际上没有调用。
一个样本..。
my-controller.ts
export class MyController {
constructor () {}
public init() {
/* doStuff */
this.initializeMyObject();
}
priv
浏览 1提问于2019-11-26得票数 1
我正在尝试使用React和Graphql创建一个简单的演示CRUD应用程序
我有后端所有设置和工作。
在前端，我将React与useQuery和useMutation一起使用。
我让create使用useMutation创建数据，使用useQuery使用read显示数据。
我现在坚持删除。我有一个帖子按钮，我可以获取帖子的id，将其传递给useMutation函数来删除帖子。
如果anyon能帮上忙，我只能让它正常工作。
App.tsx
import React, { useState } from 'react';
import './App.css';
i
浏览 1提问于2020-01-13得票数 0
2回答
我最近开始学习如何与业力/茉莉花进行角度测试。
下面是场景:我有一个侦听事件的指令，当被调用时，它在指令作用域上调用一个函数。
这是我的测试。问题是这个函数从未被调用过。下面的代码无法工作，因为间谍找不到侦听器调用的函数。指令函数更新listItems值。不是很好的TDD，但目前它只在实际中起作用，在测试中不起作用:/
指令
(function() {
angular.module('app').directive('listComponent', function(utilities) {
return {
re
浏览 4提问于2014-10-07得票数 0
我尝试在一个订单创建中创建多个产品。
实际上，它在这里通过GraphQL工具手动工作：
mutation {
createOrder(
data: {
orderName: "Order 1"
products: { create: [{ name: "Product 1" }, { name: "Product 2" }]}
}) {
id
name
products {
name
}
}
}
浏览 3提问于2021-03-11得票数 1
考虑到以下代码：
const setFriendCode = (data: Params) => api({ data })
const [mutateSetFriendCode, state] = useMutation<Response, Params>(
setFriendCode
)
类型'(data: Params) =>允诺‘的参数不能分配给'MutationFunction<Response，未定义>’的参数。参数“数据”和“变量”的类型是不兼容的。类型'undefined‘不能指定为’Params‘. to (2
浏览 5提问于2020-11-27得票数 5
10回答
可以在类的私有方法上使用Jasmine单元测试框架的spyon方法吗？
文档中给出了这个例子，但是这对于私有函数来说是灵活的吗？
describe("Person", function() {
it("calls the sayHello() function", function() {
var fakePerson = new Person();
spyOn(fakePerson, "sayHello");
fakePerson.helloSomeone("world")
浏览 1提问于2011-12-12得票数 94
我正在编写一个angularjs应用程序，在其中一个控制器中，我有一个关于服务方法的监视表达式：
$scope.$watch(CodeService.getCode, function(code){
//Some code
});
在我的单元测试中，我模拟了CodeService。在测试控制器的其他部分时，如何防止手表被触发？
浏览 0提问于2015-08-05得票数 1
我在我的React应用程序上运行了Apollo客户端，并试图使用useReactiveVar将身份验证信息保存在中。当我第一次设置变量时，所有东西都在伪函数中工作，但是在刷新应用程序后，它会重新设置状态。
这是我的cache.js
import { InMemoryCache, makeVar } from "@apollo/client";
export const cache = new InMemoryCache({
typePolicies: {
Query: {
fields: {
isLoggedIn: {
浏览 6提问于2021-06-06得票数 0
因此，我目前做了一些单元测试的角度应用程序使用茉莉花和卡玛。我遇到了一个单元测试的问题，它必须打开一个模型，更改表单的一些值并保存它。所有事情都做得很好，直到它达到了对我的模态服务的open()的承诺，并调用了saveAttribute()函数。
期望值似乎已经成功地调用了saveAttribute()，但是其中的任何一个函数都没有被调用，甚至是hasValidRegex()函数，尽管它是saveAttribute()函数中调用的第一个函数。我还尝试在saveAttribute()函数的开头使用控制台日志，但是它从未到达它，并且没有打印除函数开始成功调用的任何内容。我是不是遗漏了什么？
.sp
浏览 4提问于2021-06-14得票数 0
回答已采纳
我正在模拟Date.now()实现返回特定日期，但是，在测试完成后，afterAll + mockRestore()并没有完全消除模拟。
当我运行另一个测试时，现在的日期仍然被嘲笑为1626764400000。是否有一个不同的功能，我必须使用重置模拟？我已经用过了：mockReset，mockClear，jest.clearAllMocks。
beforeAll((): void => {
jest.spyOn(Date, 'now').mockImplementation(() => 1626764400000);
});
afterAll((): void
浏览 3提问于2021-11-30得票数 2
在使用时，我会得到以下类型的错误：
键入'SpyInstance<{}>‘不能指定’间谍‘。属性“mockRestore”在“Spy”类型中缺失。
下面是一个导致这种情况的代码示例：
class A {
foo = () => this.bar() + 1;
bar = () => 1;
}
test('should pass', () => {
const a = new A();
let barSpy: jest.SpyInstance;
barSpy = spyOn(a, 'bar');
浏览 2提问于2018-12-31得票数 13
回答已采纳
17回答
当前在我的客户端启动服务器，上面的错误就是我所得到的。我用的是TypeScript，ReactJS，ESLint。我似乎无法前进，因为这个错误一直困扰着我。也没有多大帮助。
在我创建了useMutation组件并在index.ts中导出它之后，这个错误就上升了。不知道如何消除这个错误。
Below is my package.json
{
"name": "tinyhouse_client",
"version": "0.1.0",
"private": true,
&#
浏览 11提问于2020-05-29得票数 151
回答已采纳
如果查看指南，useMutation Hook参数的结构如下所示。
const {
data,
error,
isError,
isIdle,
isLoading,
isPaused,
isSuccess,
mutate,
mutateAsync,
reset,
status,
} = useMutation(mutationFn, {
cacheTime,
mutationKey,
networkMode,
onError,
onMutate,
onSettled,
onSuccess,
retry,
retry
浏览 13提问于2022-07-26得票数 2
回答已采纳
我看到了该方法作为事件处理程序所做的更改，但在大多数情况下，jest.spyOn(wrapper.vm, 'methodName')并不能捕捉到调用，但在某些测试中，它还是起作用的。我怀疑有一种可能的重呈现(可能是由于mount()调用中的mount()参数)，它用jest.spyOn()替换了原来的方法，因为如果我连续两次触发事件，toHaveBeenCalled()就会完成并跟踪调用。
组件：
<template>
<v-app-bar
app
color="primary"
dark
class=
浏览 2提问于2020-05-17得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
