fix(frontend): workaround storybook issue (#11334)
This commit is contained in:
parent
509e3f979e
commit
df2b61fcc6
1 changed files with 48 additions and 31 deletions
|
@ -4,6 +4,9 @@ import { userEvent, waitFor, within } from '@storybook/testing-library';
|
|||
import { StoryObj } from '@storybook/vue3';
|
||||
import MkAd from './MkAd.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
let lock: Promise<undefined> | undefined;
|
||||
|
||||
const common = {
|
||||
render(args) {
|
||||
return {
|
||||
|
@ -26,39 +29,53 @@ const common = {
|
|||
};
|
||||
},
|
||||
async play({ canvasElement, args }) {
|
||||
const canvas = within(canvasElement);
|
||||
const a = canvas.getByRole<HTMLAnchorElement>('link');
|
||||
await expect(a.href).toMatch(/^https?:\/\/.*#test$/);
|
||||
const img = within(a).getByRole('img');
|
||||
await expect(img).toBeInTheDocument();
|
||||
let buttons = canvas.getAllByRole<HTMLButtonElement>('button');
|
||||
await expect(buttons).toHaveLength(1);
|
||||
const i = buttons[0];
|
||||
await expect(i).toBeInTheDocument();
|
||||
await userEvent.click(i);
|
||||
await waitFor(() => expect(canvasElement).toHaveTextContent(i18n.ts._ad.back));
|
||||
await expect(a).not.toBeInTheDocument();
|
||||
await expect(i).not.toBeInTheDocument();
|
||||
buttons = canvas.getAllByRole<HTMLButtonElement>('button');
|
||||
await expect(buttons).toHaveLength(args.__hasReduce ? 2 : 1);
|
||||
const reduce = args.__hasReduce ? buttons[0] : null;
|
||||
const back = buttons[args.__hasReduce ? 1 : 0];
|
||||
if (reduce) {
|
||||
await expect(reduce).toBeInTheDocument();
|
||||
await expect(reduce).toHaveTextContent(i18n.ts._ad.reduceFrequencyOfThisAd);
|
||||
if (lock) {
|
||||
console.warn('This test is unexpectedly running twice in parallel, fix it!');
|
||||
console.warn('See also: https://github.com/misskey-dev/misskey/issues/11267');
|
||||
await lock;
|
||||
}
|
||||
await expect(back).toBeInTheDocument();
|
||||
await expect(back).toHaveTextContent(i18n.ts._ad.back);
|
||||
await userEvent.click(back);
|
||||
await waitFor(() => expect(canvas.queryByRole('img')).toBeTruthy());
|
||||
if (reduce) {
|
||||
await expect(reduce).not.toBeInTheDocument();
|
||||
|
||||
let resolve: (value?: any) => void;
|
||||
lock = new Promise(r => resolve = r);
|
||||
|
||||
try {
|
||||
const canvas = within(canvasElement);
|
||||
const a = canvas.getByRole<HTMLAnchorElement>('link');
|
||||
await expect(a.href).toMatch(/^https?:\/\/.*#test$/);
|
||||
const img = within(a).getByRole('img');
|
||||
await expect(img).toBeInTheDocument();
|
||||
let buttons = canvas.getAllByRole<HTMLButtonElement>('button');
|
||||
await expect(buttons).toHaveLength(1);
|
||||
const i = buttons[0];
|
||||
await expect(i).toBeInTheDocument();
|
||||
await userEvent.click(i);
|
||||
await waitFor(() => expect(canvasElement).toHaveTextContent(i18n.ts._ad.back));
|
||||
await expect(a).not.toBeInTheDocument();
|
||||
await expect(i).not.toBeInTheDocument();
|
||||
buttons = canvas.getAllByRole<HTMLButtonElement>('button');
|
||||
await expect(buttons).toHaveLength(args.__hasReduce ? 2 : 1);
|
||||
const reduce = args.__hasReduce ? buttons[0] : null;
|
||||
const back = buttons[args.__hasReduce ? 1 : 0];
|
||||
if (reduce) {
|
||||
await expect(reduce).toBeInTheDocument();
|
||||
await expect(reduce).toHaveTextContent(i18n.ts._ad.reduceFrequencyOfThisAd);
|
||||
}
|
||||
await expect(back).toBeInTheDocument();
|
||||
await expect(back).toHaveTextContent(i18n.ts._ad.back);
|
||||
await userEvent.click(back);
|
||||
await waitFor(() => expect(canvas.queryByRole('img')).toBeTruthy());
|
||||
if (reduce) {
|
||||
await expect(reduce).not.toBeInTheDocument();
|
||||
}
|
||||
await expect(back).not.toBeInTheDocument();
|
||||
const aAgain = canvas.getByRole<HTMLAnchorElement>('link');
|
||||
await expect(aAgain).toBeInTheDocument();
|
||||
const imgAgain = within(aAgain).getByRole('img');
|
||||
await expect(imgAgain).toBeInTheDocument();
|
||||
} finally {
|
||||
resolve!();
|
||||
lock = undefined;
|
||||
}
|
||||
await expect(back).not.toBeInTheDocument();
|
||||
const aAgain = canvas.getByRole<HTMLAnchorElement>('link');
|
||||
await expect(aAgain).toBeInTheDocument();
|
||||
const imgAgain = within(aAgain).getByRole('img');
|
||||
await expect(imgAgain).toBeInTheDocument();
|
||||
},
|
||||
args: {
|
||||
prefer: [],
|
||||
|
|
Loading…
Reference in a new issue