这就是我的组件的样子。在组件内部,我正在进行突变,一旦突变查询完成,就会调用 handleOnComplete 函数。这段代码工作正常。
function BrandingSearch() {
const [searchList, setSearchList] = useState([]);
const [searchQuery, { loading, error }] = useMutation(SEARCH_NO_INDEX, {
onCompleted: handleOnComplete,
variables: {
rootType: 'branding',
input: {}
}
});
useEffect(() => {
searchQuery();
}, [])
function handleOnComplete(res) {
if (res && res.searchNoIndex && res.searchNoIndex.payload) {
const payload = res.searchNoIndex.payload;
const dataList = payload.map((item) => ({ ...item, id: item.name })); //Get requests require name instead of id
setSearchList(dataList)
}
}
const component = (
<CardSearch
searchList={searchList}
/>
)
return component;
}
export default BrandingSearch;
下面是我的测试用例,在测试用例中调用了useEffect,但没有调用handleOnComplete。我怎样才能解决这个问题。
测试用例:
describe('Test BrandingSearch', () => {
it('', async () => {
let deleteMutationCalled = false;
const mocks = [
{
request: {
query: SEARCH_NO_INDEX,
variables: {
rootType: 'branding',
input: {}
}
},
result: () => {
deleteMutationCalled = true;
return { data:{} };
}
}
];
let wrapper;
act(() => {
wrapper = create(
<MockedProvider mocks={mocks} addTypename={false}>
<BrandingSearch />
</MockedProvider>
)
})
let component = wrapper.root;
expect(deleteMutationCalled).toBe(true);
//Expecting this to be set true, once the mutation is fired.
})
});
任何帮助表示赞赏。