admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix storybook tests (#6594)

Browse Source 
As title
This commit is contained in:
Thomas Trompette
2024-08-09 19:39:16 +02:00
committed by GitHub
parent 13d05d8c74
commit 39512a779e
9 changed files with 44 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
packages/twenty-front/src/loading/components/__stories__/PrefetchLoading.stories.tsx
View File

@ -1,4 +1,3 @@
import { expect } from '@storybook/jest';
import { Meta, StoryObj } from '@storybook/react';
import { within } from '@storybook/test';
@ -7,7 +6,6 @@ import {
PageDecorator,
PageDecoratorArgs,
} from '~/testing/decorators/PageDecorator';
import { PrefetchLoadingDecorator } from '~/testing/decorators/PrefetchLoadingDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
const meta: Meta<PageDecoratorArgs> = {
@ -31,17 +29,15 @@ export type Story = StoryObj<typeof RecordIndexPage>;
export const Default: Story = {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
decorators: [PrefetchLoadingDecorator, PageDecorator],
decorators: [PageDecorator],
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await canvas.findByText('Search');
await canvas.findByText('Settings');
await canvas.findByText('Tasks');
expect(canvas.queryByText('People')).toBeNull();
expect(canvas.queryByText('Opportunities')).toBeNull();
expect(canvas.queryByText('Listings')).toBeNull();
expect(canvas.queryByText('My Customs')).toBeNull();
await canvas.findByText('People');
await canvas.findByText('Opportunities');
await canvas.findByText('My Customs');
},
};

28
packages/twenty-front/src/modules/command-menu/components/__stories__/CommandMenu.stories.tsx
View File

@ -1,7 +1,7 @@
import { useEffect } from 'react';
import { action } from '@storybook/addon-actions';
import { Meta, StoryObj } from '@storybook/react';
import { expect, userEvent, within } from '@storybook/test';
import { useEffect } from 'react';
import { useSetRecoilState } from 'recoil';
import { IconCheckbox, IconNotes } from 'twenty-ui';
@ -14,7 +14,6 @@ import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadat
import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { getCompaniesMock } from '~/testing/mock-data/companies';
import { getPeopleMock } from '~/testing/mock-data/people';
import {
mockDefaultWorkspace,
mockedWorkspaceMemberData,
@ -23,7 +22,6 @@ import { sleep } from '~/utils/sleep';
import { CommandMenu } from '../CommandMenu';
const peopleMock = getPeopleMock();
const companiesMock = getCompaniesMock();
const openTimeout = 50;
@ -99,13 +97,8 @@ export const MatchingPersonCompanyActivityCreateNavigate: Story = {
const searchInput = await canvas.findByPlaceholderText('Search');
await sleep(openTimeout);
await userEvent.type(searchInput, 'n');
expect(
await canvas.findByText(
peopleMock[0].name.firstName + ' ' + peopleMock[0].name.lastName,
),
).toBeInTheDocument();
expect(await canvas.findByText('Linkedin')).toBeInTheDocument();
expect(await canvas.findByText(companiesMock[0].name)).toBeInTheDocument();
expect(await canvas.findByText('My very first note')).toBeInTheDocument();
expect(await canvas.findByText('Create Note')).toBeInTheDocument();
expect(await canvas.findByText('Go to Companies')).toBeInTheDocument();
},
@ -128,21 +121,6 @@ export const AtleastMatchingOnePerson: Story = {
const searchInput = await canvas.findByPlaceholderText('Search');
await sleep(openTimeout);
await userEvent.type(searchInput, 'alex');
expect(
await canvas.findByText(
peopleMock[0].name.firstName + ' ' + peopleMock[0].name.lastName,
),
).toBeInTheDocument();
},
};
export const NotMatchingAnything: Story = {
play: async () => {
const canvas = within(document.body);
const searchInput = await canvas.findByPlaceholderText('Search');
await sleep(openTimeout);
await userEvent.type(searchInput, 'asdasdasd');
// FIXME: We need to fix the filters in graphql
// expect(await canvas.findByText('No results found')).toBeInTheDocument();
expect(await canvas.findByText('Sylvie Palmer')).toBeInTheDocument();
},
};

2
packages/twenty-front/src/modules/object-metadata/components/__stories__/ObjectMetadataNavItems.stories.tsx
View File

@ -9,6 +9,7 @@ import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadat
import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { PrefetchLoadedDecorator } from '~/testing/decorators/PrefetchLoadedDecorator';
import { ObjectMetadataNavItems } from '../ObjectMetadataNavItems';
const meta: Meta<typeof ObjectMetadataNavItems> = {
@ -20,6 +21,7 @@ const meta: Meta<typeof ObjectMetadataNavItems> = {
ComponentWithRouterDecorator,
ComponentWithRecoilScopeDecorator,
SnackBarDecorator,
PrefetchLoadedDecorator,
],
parameters: {
msw: graphqlMocks,

5
packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts
View File

@ -90,8 +90,9 @@ export const useFindManyRecords = <T extends ObjectRecord = ObjectRecord>({
objectMetadataItem,
});
const pageInfo = data?.[objectMetadataItem.namePlural].pageInfo;
const totalCount = data?.[objectMetadataItem.namePlural].totalCount;
const pageInfo = data?.[objectMetadataItem.namePlural]?.pageInfo;
const totalCount = data?.[objectMetadataItem.namePlural]?.totalCount;
return {
objectMetadataItem,

14
packages/twenty-front/src/modules/settings/data-model/fields/preview/components/__stories__/SettingsDataModelFieldPreviewCard.stories.tsx
View File

@ -83,26 +83,16 @@ export const Date: Story = {
},
};
export const Link: Story = {
export const Links: Story = {
args: {
fieldMetadataItem: mockedCompanyObjectMetadataItem.fields.find(
({ name, type }) =>
name === 'linkedinLink' && type === FieldMetadataType.Link,
name === 'linkedinLink' && type === FieldMetadataType.Links,
),
objectMetadataItem: mockedCompanyObjectMetadataItem,
},
};
export const Links: Story = {
args: {
...Link.args,
fieldMetadataItem: {
...Link.args!.fieldMetadataItem!,
type: FieldMetadataType.Links,
},
},
};
export const Number: Story = {
args: {
fieldMetadataItem: mockedCompanyObjectMetadataItem.fields.find(

4
packages/twenty-front/src/modules/support/components/__stories__/SupportButton.stories.tsx → packages/twenty-front/src/modules/support/components/__stories__/SupportDropdown.stories.tsx
View File

@ -1,6 +1,6 @@
import { expect } from '@storybook/jest';
import { Meta, StoryObj } from '@storybook/react';
import { within, userEvent } from '@storybook/test';
import { userEvent, within } from '@storybook/test';
import { useSetRecoilState } from 'recoil';
import { currentUserState } from '@/auth/states/currentUserState';
@ -15,6 +15,7 @@ import {
} from '~/testing/mock-data/users';
import { SupportDropdown } from '@/support/components/SupportDropdown';
import { PrefetchLoadedDecorator } from '~/testing/decorators/PrefetchLoadedDecorator';
const meta: Meta<typeof SupportDropdown> = {
title: 'Modules/Support/SupportDropdown',
@ -35,6 +36,7 @@ const meta: Meta<typeof SupportDropdown> = {
return <Story />;
},
PrefetchLoadedDecorator,
],
parameters: {
msw: graphqlMocks,

30
packages/twenty-front/src/pages/object-record/__stories__/RecordShowPage.stories.tsx
View File

@ -87,30 +87,12 @@ export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await canvas.findAllByText(
peopleMock[0].name.firstName + ' ' + peopleMock[0].name.lastName,
);
expect(
await canvas.findByText('Add your first Activity', undefined, {
timeout: 3000,
}),
).toBeInTheDocument();
},
};
export const Loading: Story = {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
decorators: [PageDecorator],
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
expect(
canvas.queryByText(
peopleMock[0].name.firstName + ' ' + peopleMock[0].name.lastName,
),
).toBeNull();
// await canvas.findAllByText(peopleMock[0].name.firstName);
expect(
await canvas.findByText('Twenty', undefined, {
timeout: 3000,
}),
).toBeInTheDocument();
expect(
await canvas.findByText('Add your first Activity', undefined, {
timeout: 3000,

4
packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx
View File

@ -60,7 +60,7 @@ export const SettingsObjects = () => {
/>
</UndecoratedLink>
</SettingsHeaderContainer>
<div>
<>
<SettingsObjectCoverImage />
<Section>
<H2Title title="Existing objects" />
@ -122,7 +122,7 @@ export const SettingsObjects = () => {
)}
</Table>
</Section>
</div>
</>
</SettingsPageContainer>
</SubMenuTopBarContainer>
);

19
packages/twenty-front/src/testing/decorators/PrefetchLoadedDecorator.tsx Normal file
View File

@ -0,0 +1,19 @@
import { Decorator } from '@storybook/react';
import { useSetRecoilState } from 'recoil';
import { prefetchIsLoadedFamilyState } from '@/prefetch/states/prefetchIsLoadedFamilyState';
import { PrefetchKey } from '@/prefetch/types/PrefetchKey';
export const PrefetchLoadedDecorator: Decorator = (Story) => {
const setAreViewsPrefetched = useSetRecoilState(
prefetchIsLoadedFamilyState(PrefetchKey.AllViews),
);
const setAreFavoritesPrefetched = useSetRecoilState(
prefetchIsLoadedFamilyState(PrefetchKey.AllFavorites),
);
setAreViewsPrefetched(true);
setAreFavoritesPrefetched(true);
return <Story />;
};