Instead of mocking useDeleteTokensMutation it would be better to return an
error from mock service worker handler for that particular endpoint.
Diff comments:
> diff --git a/frontend/src/components/TokensList/TokensListDelete.test.tsx
> b/frontend/src/components/TokensList/TokensListDelete.test.tsx
> new file mode 100644
> index 0000000..44e5116
> --- /dev/null
> +++ b/frontend/src/components/TokensList/TokensListDelete.test.tsx
> @@ -0,0 +1,53 @@
> +import { rest } from "msw";
> +import { setupServer } from "msw/node";
> +
> +import TokensList from "./TokensList";
> +
> +import urls from "@/api/urls";
> +import type * as apiHooks from "@/hooks/react-query";
> +import { tokenFactory } from "@/mocks/factories";
> +import { createMockGetTokensResolver } from "@/mocks/resolvers";
> +import { screen, renderWithMemoryRouter, userEvent } from "@/test-utils";
> +
> +const tokens = tokenFactory.buildList(2);
> +const tokensDeleteMock = vi.fn();
> +const errorMsg = "Unable to delete tokens";
> +
> +const mockServer = setupServer(rest.get(urls.tokens,
> createMockGetTokensResolver(tokens)));
> +
> +beforeAll(() => {
> + mockServer.listen();
> +});
> +
> +afterEach(() => {
> + mockServer.resetHandlers();
> +});
> +
> +afterAll(() => {
> + mockServer.close();
> +});
> +
> +describe("delete errors", () => {
> + it("displays an error notification when delete fails", async () => {
> + vi.mock("@/hooks/react-query", async (importOriginal) => {
Instead of mocking useDeleteTokensMutation it would be better to return an
error from mock service worker handler for that particular endpoint.
> + const original: typeof apiHooks = await importOriginal();
> + return {
> + ...original,
> + useDeleteTokensMutation: () => ({ mutate: tokensDeleteMock, isError:
> true, error: new Error(errorMsg) }),
> + };
> + });
> +
> + renderWithMemoryRouter(<TokensList />);
> + const checkboxes = screen.getAllByRole("checkbox");
> + await userEvent.click(checkboxes[1]);
> + await userEvent.click(checkboxes[2]);
> + await userEvent.click(screen.getByRole("button", { name: /delete/i }));
> +
> + expect(
> + screen.getByRole("heading", {
> + name: /error/i,
> + }),
> + ).toBeInTheDocument();
> + expect(screen.getByText(new RegExp(errorMsg, "i"))).toBeInTheDocument();
> + });
> +});
--
https://code.launchpad.net/~jonesogolo/maas-site-manager/+git/maas-site-manager/+merge/442449
Your team MAAS Committers is requested to review the proposed merge of
~jonesogolo/maas-site-manager:1602-display-token-delete-failure-msg into
maas-site-manager:main.
--
Mailing list: https://launchpad.net/~sts-sponsors
Post to : sts-sponsors@lists.launchpad.net
Unsubscribe : https://launchpad.net/~sts-sponsors
More help : https://help.launchpad.net/ListHelp
