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

Fix CI errored tasks for front (#6806)

Browse Source 
In this PR:
- revert de-optimization of icons bundle for storybook. This was forcing
the browser to load ~3k files while running stories
- adding lazy loading on Settings route to improve developer experience
(some files will be loaded later)
- fix FE tests: unit, modules stories, pages stories

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Lucas Bordeau
2024-08-31 01:19:24 +02:00
committed by Charles Bochet
parent a3ea0acd1a
commit 56f8091a42
28 changed files with 599 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/pages/auth/__stories__/Invite.stories.tsx
View File

@ -73,7 +73,9 @@ export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await canvas.findByText('Join Twenty dev team');
await canvas.findByText('Join Twenty dev team', undefined, {
timeout: 5000,
});
const continueWithEmailButton = await canvas.findByText(
'Continue With Email',

16
packages/twenty-front/src/pages/not-found/__stories__/NotFound.stories.tsx
View File

@ -1,23 +1,17 @@
import { Meta, StoryObj } from '@storybook/react';
import { within } from '@storybook/test';
import { ComponentWithRouterDecorator } from '~/testing/decorators/ComponentWithRouterDecorator';
import { HelmetProviderDecorator } from '~/testing/decorators/HelmetProviderDecorator';
import { PageDecoratorArgs } from '~/testing/decorators/PageDecorator';
import { RelationPickerDecorator } from '~/testing/decorators/RelationPickerDecorator';
import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
import {
PageDecorator,
PageDecoratorArgs,
} from '~/testing/decorators/PageDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { NotFound } from '../NotFound';
const meta: Meta<PageDecoratorArgs> = {
title: 'Pages/NotFound/Default',
component: NotFound,
decorators: [
HelmetProviderDecorator,
ComponentWithRouterDecorator,
SnackBarDecorator,
RelationPickerDecorator,
],
decorators: [PageDecorator],
args: {
routePath: '/toto-not-found',
},

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

@ -90,7 +90,7 @@ export const Default: Story = {
// await canvas.findAllByText(peopleMock[0].name.firstName);
expect(
await canvas.findByText('Twenty', undefined, {
timeout: 3000,
timeout: 5000,
}),
).toBeInTheDocument();
expect(

8
packages/twenty-front/src/pages/onboarding/__stories__/ChooseYourPlan.stories.tsx
View File

@ -1,7 +1,7 @@
import { getOperationName } from '@apollo/client/utilities';
import { Meta, StoryObj } from '@storybook/react';
import { within } from '@storybook/testing-library';
import { graphql, HttpResponse } from 'msw';
import { HttpResponse, graphql } from 'msw';
import { AppPath } from '@/types/AppPath';
import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser';
@ -13,7 +13,6 @@ import {
} from '~/testing/decorators/PageDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { mockedOnboardingUserData } from '~/testing/mock-data/users';
import { sleep } from '~/utils/sleep';
const meta: Meta<PageDecoratorArgs> = {
title: 'Pages/Onboarding/ChooseYourPlan',
@ -70,8 +69,9 @@ export type Story = StoryObj<typeof ChooseYourPlan>;
export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
sleep(100);
await canvas.findByText('Choose your Plan');
await canvas.findByText('Choose your Plan', undefined, {
timeout: 3000,
});
},
};

2
packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectEdit.stories.tsx
View File

@ -34,6 +34,6 @@ export const StandardObject: Story = {
export const CustomObject: Story = {
args: {
routeParams: { ':objectSlug': 'listings' },
routeParams: { ':objectSlug': 'my-custom-objects' },
},
};

1
packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectNewField/SettingsObjectNewFieldStep2.stories.tsx
View File

@ -30,7 +30,6 @@ export type Story = StoryObj<typeof SettingsObjectNewFieldStep2>;
export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await canvas.findByText('Settings');
await canvas.findByText('Objects');
await canvas.findByText('Name and description');

8
packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjects.stories.tsx
View File

@ -6,7 +6,6 @@ import {
PageDecoratorArgs,
} from '~/testing/decorators/PageDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { sleep } from '~/utils/sleep';
import { SettingsObjects } from '../SettingsObjects';
@ -28,11 +27,6 @@ export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await sleep(1000);
await canvas.getByRole('heading', {
level: 2,
name: 'Objects',
});
await canvas.findByText('Existing objects', undefined, { timeout: 5000 });
},
};

39
packages/twenty-front/src/pages/settings/developers/__stories__/api-keys/SettingsDevelopersApiKeysDetail.stories.tsx
View File

@ -1,5 +1,5 @@
import { Meta, StoryObj } from '@storybook/react';
import { userEvent, within } from '@storybook/test';
import { fireEvent, userEvent, within } from '@storybook/test';
import { HttpResponse, graphql } from 'msw';
import { SettingsDevelopersApiKeyDetail } from '~/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail';
@ -50,24 +50,29 @@ export type Story = StoryObj<typeof SettingsDevelopersApiKeyDetail>;
export const Default: Story = {
play: async ({ canvasElement }) => {
const canvas = within(canvasElement);
await canvas.findByText('Settings');
await canvas.findByText('Developers');
await canvas.findByText('sfsfdsf API Key');
},
};
export const RegenerateApiKey: Story = {
play: async ({ canvasElement, step }) => {
const canvas = within(canvasElement);
await canvas.findByText('Settings');
play: async ({ step }) => {
const canvas = within(document.body);
await canvas.findByText('sfsfdsf API Key', undefined, { timeout: 10000 });
// userEvent.dblClick(await canvas.findByDisplayValue('sfsfdsf'));
await userEvent.click(await canvas.findByText('Regenerate Key'));
await canvas.findByText('Cancel');
const confirmationInput = await canvas.findByPlaceholderText('yes');
await userEvent.click(confirmationInput);
await userEvent.keyboard('y');
await userEvent.keyboard('e');
await userEvent.keyboard('s');
const confirmationInput = await canvas.findByTestId(
'confirmation-modal-input',
);
fireEvent.change(confirmationInput, {
target: { value: 'yes' },
});
const confirmButton = await canvas.findByTestId(
'confirmation-modal-confirm-button',
@ -83,16 +88,18 @@ export const RegenerateApiKey: Story = {
export const DeleteApiKey: Story = {
play: async ({ canvasElement, step }) => {
const canvas = within(canvasElement);
await canvas.findByText('Settings');
await canvas.findByText('sfsfdsf API Key');
await userEvent.click(await canvas.findByText('Delete'));
await canvas.findByText('Cancel');
const confirmationInput = await canvas.findByPlaceholderText('yes');
await userEvent.click(confirmationInput);
await userEvent.keyboard('y');
await userEvent.keyboard('e');
await userEvent.keyboard('s');
const confirmationInput = await canvas.findByTestId(
'confirmation-modal-input',
);
fireEvent.change(confirmationInput, {
target: { value: 'yes' },
});
const confirmButton = await canvas.findByTestId(
'confirmation-modal-confirm-button',

2
packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx
View File

@ -108,3 +108,5 @@ export const SettingsServerlessFunctionsNew = () => {
</SubMenuTopBarContainer>
);
};
export default SettingsServerlessFunctionsNew;

7
packages/twenty-front/src/pages/settings/serverless-functions/__stories__/SettingsServerlessFunctions.stories.tsx
View File

@ -1,12 +1,12 @@
import { SettingsServerlessFunctions } from '~/pages/settings/serverless-functions/SettingsServerlessFunctions';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { Meta, StoryObj } from '@storybook/react';
import { within } from '@storybook/test';
import { SettingsServerlessFunctions } from '~/pages/settings/serverless-functions/SettingsServerlessFunctions';
import {
PageDecorator,
PageDecoratorArgs,
} from '~/testing/decorators/PageDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { sleep } from '~/utils/sleep';
import { within } from '@storybook/test';
const meta: Meta<PageDecoratorArgs> = {
title: 'Pages/Settings/ServerlessFunctions/SettingsServerlessFunctions',
@ -26,7 +26,6 @@ export const Default: Story = {
const canvas = within(canvasElement);
await sleep(100);
await canvas.findByText('Functions');
await canvas.findByText('Add your first Function');
},
};