Reactjs 如何在msw和react测试库中使用react查询测试组件？

我有一个加载了下拉组件的页面。该组件调用一个customhook，它使用react查询获取要在下拉列表中显示的数据。 初始加载时，此组件处于加载状态，并呈现加载图标。 当react query成功完成调用时，组件将数据列表呈现到下拉列表中

const SelectItem = ({ handleSelectChange, selectedItem }) => {
  
  const { data, status } = useGetData(url, 'myQueryKey');

  if (status === 'loading') {
    return <RenderSkeleton />;
  }

  if (status === 'error') {
    return 'An Error has occured';
  }

  return (
    <>
      <Autocomplete
        options={data}
        getOptionLabel={(option) => `${option.name}`}
        value={selectedItem}
        onChange={(event, newValue) => {
          handleSelectChange(newValue);
        }}
        data-testid="select-data"
        renderInput={(params) => <TextField {...params}" />}
      />
    </>
  );
};

const SelectItem=（{handleSelectChange，selectedItem}）=>{
const{data，status}=useGetData（url，'myQueryKey'）；
如果（状态==‘正在加载’）{
返回；
}
如果（状态=='错误'）{
返回“发生错误”；
}
返回(
`${option.name}`}
值={selectedItem}
onChange={（事件，newValue）=>{
handleSelectChange（新值）；
}}
data testid=“选择数据”
renderInput={（params）=>尝试使用
findByText
（将等待DOM元素，返回
承诺
）

尝试使用
findByText
（将等待DOM元素，返回一个
Promise
）

您的模拟数据正在返回一个带有超时的承诺？您是否尝试使用react测试库中的
findByText
（将等待DOM元素），如；
expect（wait screen.findByText（'select-data'））。toBeInTheDocument（）
谢谢，这实际上解决了它！认为这是一个愚蠢的错误！！很好！刚刚发布了答案！你的模拟数据返回了一个承诺，有超时吗？你是否尝试过使用react测试库中的
findByText
（将等待DOM元素），比如；
expect（wait screen.findByText（'select-data'）。toBeInTheDocument（）
谢谢，这实际上解决了它！我认为这是个愚蠢的错误！！很好！刚刚发布了答案！
it('should load A Selectbox data', async () => {
  render(
    <QueryClientProvider client={queryClient}>
      <SelectItem />
    </QueryClientProvider>
  );
  expect(await screen.getByTestId('select-data')).toBeInTheDocument()
});


expect(await screen.findByText('select-data')).toBeInTheDocument();