Fix stories (#11585)
<img width="1512" alt="image" src="https://github.com/user-attachments/assets/f77a006c-9538-4734-b80e-b58b9f5e7835" />
This commit is contained in:
@ -6,6 +6,7 @@ import {
|
||||
PageDecorator,
|
||||
PageDecoratorArgs,
|
||||
} from '~/testing/decorators/PageDecorator';
|
||||
import { PrefetchLoadingDecorator } from '~/testing/decorators/PrefetchLoadingDecorator';
|
||||
import { graphqlMocks } from '~/testing/graphqlMocks';
|
||||
|
||||
const meta: Meta<PageDecoratorArgs> = {
|
||||
@ -19,6 +20,7 @@ const meta: Meta<PageDecoratorArgs> = {
|
||||
},
|
||||
parameters: {
|
||||
msw: graphqlMocks,
|
||||
prefetchLoadingSetDelay: 1000,
|
||||
},
|
||||
};
|
||||
|
||||
@ -29,7 +31,7 @@ export type Story = StoryObj<typeof RecordIndexPage>;
|
||||
export const Default: Story = {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
decorators: [PageDecorator],
|
||||
decorators: [PrefetchLoadingDecorator, PageDecorator],
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
|
||||
|
||||
@ -123,8 +123,8 @@ export const ClickOutside: Story = {
|
||||
const canvas = within(canvasElement);
|
||||
expect(clickOutsideJestFn).toHaveBeenCalledTimes(0);
|
||||
|
||||
await waitFor(() => {
|
||||
const outsideElement = canvas.getByTestId('click-outside-element');
|
||||
await waitFor(async () => {
|
||||
const outsideElement = await canvas.findByTestId('click-outside-element');
|
||||
userEvent.click(outsideElement);
|
||||
expect(clickOutsideJestFn).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
@ -3,13 +3,40 @@ import { useSetRecoilState } from 'recoil';
|
||||
|
||||
import { prefetchIsLoadedFamilyState } from '@/prefetch/states/prefetchIsLoadedFamilyState';
|
||||
import { PrefetchKey } from '@/prefetch/types/PrefetchKey';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
export const PrefetchLoadingDecorator: Decorator = (Story) => {
|
||||
const setAreFavoritesPrefetched = useSetRecoilState(
|
||||
export const PrefetchLoadingDecorator: Decorator = (Story, context) => {
|
||||
const { parameters } = context;
|
||||
|
||||
const prefetchLoadingSetDelay = parameters.prefetchLoadingSetDelay ?? 0;
|
||||
|
||||
const setAreFavoritesFoldersPrefetched = useSetRecoilState(
|
||||
prefetchIsLoadedFamilyState(PrefetchKey.AllFavoritesFolders),
|
||||
);
|
||||
|
||||
setAreFavoritesPrefetched(false);
|
||||
const setAreFavoritesPrefetched = useSetRecoilState(
|
||||
prefetchIsLoadedFamilyState(PrefetchKey.AllFavorites),
|
||||
);
|
||||
|
||||
const [isInitialized, setIsInitialized] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (isInitialized) {
|
||||
return;
|
||||
}
|
||||
|
||||
setIsInitialized(true);
|
||||
|
||||
setTimeout(() => {
|
||||
setAreFavoritesPrefetched(false);
|
||||
setAreFavoritesFoldersPrefetched(false);
|
||||
}, prefetchLoadingSetDelay);
|
||||
}, [
|
||||
isInitialized,
|
||||
prefetchLoadingSetDelay,
|
||||
setAreFavoritesFoldersPrefetched,
|
||||
setAreFavoritesPrefetched,
|
||||
]);
|
||||
|
||||
return <Story />;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user