95 lines
2.7 KiB
TypeScript
95 lines
2.7 KiB
TypeScript
import React from "react";
|
|
import {
|
|
fireEvent,
|
|
queryAllByRole,
|
|
render,
|
|
screen,
|
|
waitFor,
|
|
} from "@testing-library/react";
|
|
import EditIcon from "@material-ui/icons/Edit";
|
|
import DeleteIcon from "@material-ui/icons/Delete";
|
|
import AddIcon from "@material-ui/icons/Add";
|
|
|
|
const memoizedGetIconPath = (icon: JSX.Element) => {
|
|
let cache: { path?: string } = {};
|
|
return (): string => {
|
|
if (cache?.path) {
|
|
return cache.path;
|
|
} else {
|
|
const { container } = render(icon);
|
|
const path = container.innerHTML.match(/<path d="(.*)">/)?.[1];
|
|
if (!path) {
|
|
throw `Could not get path of MUI ${icon.type.displayName}`;
|
|
}
|
|
cache.path = path;
|
|
return path;
|
|
}
|
|
};
|
|
};
|
|
|
|
const getEditIconPath = memoizedGetIconPath(<EditIcon />);
|
|
const getDeleteIconPath = memoizedGetIconPath(<DeleteIcon />);
|
|
const getAddIconPath = memoizedGetIconPath(<AddIcon />);
|
|
|
|
// sorry, I found no better way to find a specific icon button...
|
|
export const queryAllEditIconButtons = (
|
|
container?: HTMLElement
|
|
): Array<HTMLElement> => {
|
|
return (container
|
|
? queryAllByRole(container, "button")
|
|
: screen.queryAllByRole("button")
|
|
).filter(
|
|
(button) =>
|
|
button.innerHTML.includes("svg") &&
|
|
button.innerHTML.includes(getEditIconPath())
|
|
);
|
|
};
|
|
|
|
// sorry, I found no better way to find a specific icon button...
|
|
const queryAllDeleteIconButtons = (
|
|
container?: HTMLElement
|
|
): Array<HTMLElement> => {
|
|
return (container
|
|
? queryAllByRole(container, "button")
|
|
: screen.queryAllByRole("button")
|
|
).filter(
|
|
(button) =>
|
|
button.innerHTML.includes("svg") &&
|
|
button.innerHTML.includes(getDeleteIconPath())
|
|
);
|
|
};
|
|
|
|
// sorry, I found no better way to find a specific icon button...
|
|
export const queryAllAddIconButtons = (
|
|
container?: HTMLElement
|
|
): Array<HTMLElement> => {
|
|
return (container
|
|
? queryAllByRole(container, "button")
|
|
: screen.queryAllByRole("button")
|
|
).filter(
|
|
(button) =>
|
|
button.innerHTML.includes("svg") &&
|
|
button.innerHTML.includes(getAddIconPath())
|
|
);
|
|
};
|
|
|
|
export const expandAccordionAndGetIconButtons = async (
|
|
accordion: HTMLElement
|
|
): Promise<{ editIconButton: HTMLElement; deleteIconButton: HTMLElement }> => {
|
|
let editIconsButtons = queryAllDeleteIconButtons();
|
|
let deleteIconsButtons = queryAllEditIconButtons();
|
|
expect(editIconsButtons).toHaveLength(0);
|
|
expect(deleteIconsButtons).toHaveLength(0);
|
|
fireEvent.click(accordion);
|
|
await waitFor(() => {
|
|
editIconsButtons = queryAllEditIconButtons();
|
|
deleteIconsButtons = queryAllDeleteIconButtons();
|
|
expect(editIconsButtons).toHaveLength(1);
|
|
expect(deleteIconsButtons).toHaveLength(1);
|
|
});
|
|
return {
|
|
editIconButton: editIconsButtons[0],
|
|
deleteIconButton: deleteIconsButtons[0],
|
|
};
|
|
};
|