redux-toolkit icon indicating copy to clipboard operation
redux-toolkit copied to clipboard

Unexpected behaviour of isSuccess on second refetch

Open rusnick31 opened this issue 1 year ago • 9 comments

I have a simple endpoint getData https://stackblitz.com/edit/react-ts-7vwdac?file=App.tsx

const delay = () => {
  return new Promise((resolve) => {
    setTimeout(resolve, 500);
  });
};

let count = 0;

const api = createApi({
  reducerPath: 'api',
  endpoints: (builder) => ({
    getData: builder.query<number, void>({
      queryFn: async () => {
        count += 1;

        await delay();

        if (count > 1) {
          return { error: true };
        }

        return { data: 123 };
      },
    }),
  }),
  baseQuery: fakeBaseQuery(),
});

const { useGetDataQuery } = api;

which is used like that

function Component() {
  const { refetch, data, isError, isSuccess } = useGetDataQuery();

  console.log({ isError, isSuccess });

  return (
    <div>
      <button onClick={refetch}>refetch</button>
      <span>{data}</span>
    </div>
  );
}

export default function App() {
  return (
    <Provider store={store}>
      <Component />
    </Provider>
  );
}

output on mount is:

{ isError: false, isSuccess: false }
{ isError: false, isSuccess: false }
{ isError: false, isSuccess: true }

after calling refetch for the first time:

{ isError: false, isSuccess: true }
{ isError: true, isSuccess: false }

but if I call refetch one more time, I'll get

{ isError: false, isSuccess: true }
{ isError: true, isSuccess: false }

RTK switches isSuccess back to true for some reason while the request is loading

Is it the correct behaviour? Shouldn't isSuccess stay false?

rusnick31 avatar Feb 26 '24 08:02 rusnick31