From 742791bd9291d23db3dab70d6217eb7f6b9eb2e9 Mon Sep 17 00:00:00 2001 From: Charles Bochet Date: Sat, 22 Jul 2023 23:29:58 -0700 Subject: [PATCH] Fix tests (#848) * Fix tests * Fix tests * Fix tests --- front/package.json | 6 +- .../ui/layout/components/AuthLayout.tsx | 10 ---- .../__stories__/CreateProfile.stories.tsx | 34 +++++++---- .../__stories__/CreateWorkspace.stories.tsx | 34 +++++++---- .../auth/__stories__/SignInUp.stories.tsx | 23 ++++---- .../__stories__/Opportunities.stories.tsx | 5 ++ .../SettingsWorkspaceMembers.stories.tsx | 5 ++ front/src/testing/mock-data/users.ts | 57 +++++++++++++++++++ 8 files changed, 127 insertions(+), 47 deletions(-) delete mode 100644 front/src/modules/ui/layout/components/AuthLayout.tsx diff --git a/front/package.json b/front/package.json index 8d831140e..22f1f020c 100644 --- a/front/package.json +++ b/front/package.json @@ -164,9 +164,9 @@ "workerDirectory": "public" }, "nyc": { - "lines": 65, - "statements": 65, - "functions": 55, + "statements": 70, + "lines": 70, + "functions": 60, "exclude": [ "src/generated/**/*" ] diff --git a/front/src/modules/ui/layout/components/AuthLayout.tsx b/front/src/modules/ui/layout/components/AuthLayout.tsx deleted file mode 100644 index bd7d2661c..000000000 --- a/front/src/modules/ui/layout/components/AuthLayout.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { CompaniesMockMode } from '~/pages/companies/CompaniesMockMode'; - -export function AuthLayout({ children }: React.PropsWithChildren) { - return ( - <> - - {children} - - ); -} diff --git a/front/src/pages/auth/__stories__/CreateProfile.stories.tsx b/front/src/pages/auth/__stories__/CreateProfile.stories.tsx index 1ee175063..7ec507db4 100644 --- a/front/src/pages/auth/__stories__/CreateProfile.stories.tsx +++ b/front/src/pages/auth/__stories__/CreateProfile.stories.tsx @@ -1,10 +1,12 @@ +import { getOperationName } from '@apollo/client/utilities'; import type { Meta, StoryObj } from '@storybook/react'; +import { within } from '@storybook/testing-library'; +import { graphql } from 'msw'; -import { AuthModal } from '@/auth/components/Modal'; -import { AuthLayout } from '@/ui/layout/components/AuthLayout'; -import { graphqlMocks } from '~/testing/graphqlMocks'; import { getRenderWrapperForPage } from '~/testing/renderWrappers'; +import { GET_CURRENT_USER } from '../../../modules/users/queries'; +import { mockedOnboardingUsersData } from '../../../testing/mock-data/users'; import { CreateProfile } from '../CreateProfile'; const meta: Meta = { @@ -17,15 +19,23 @@ export default meta; export type Story = StoryObj; export const Default: Story = { - render: getRenderWrapperForPage( - - - - - , - '/auth/create-profile', - ), + render: getRenderWrapperForPage(, '/create/profile'), parameters: { - msw: graphqlMocks, + msw: [ + graphql.query( + getOperationName(GET_CURRENT_USER) ?? '', + (req, res, ctx) => { + return res( + ctx.data({ + currentUser: mockedOnboardingUsersData[1], + }), + ); + }, + ), + ], + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await canvas.findByText('Create profile'); }, }; diff --git a/front/src/pages/auth/__stories__/CreateWorkspace.stories.tsx b/front/src/pages/auth/__stories__/CreateWorkspace.stories.tsx index 1a8959bb5..616323593 100644 --- a/front/src/pages/auth/__stories__/CreateWorkspace.stories.tsx +++ b/front/src/pages/auth/__stories__/CreateWorkspace.stories.tsx @@ -1,10 +1,12 @@ +import { getOperationName } from '@apollo/client/utilities'; import type { Meta, StoryObj } from '@storybook/react'; +import { within } from '@storybook/testing-library'; +import { graphql } from 'msw'; -import { AuthModal } from '@/auth/components/Modal'; -import { AuthLayout } from '@/ui/layout/components/AuthLayout'; -import { graphqlMocks } from '~/testing/graphqlMocks'; import { getRenderWrapperForPage } from '~/testing/renderWrappers'; +import { GET_CURRENT_USER } from '../../../modules/users/queries'; +import { mockedOnboardingUsersData } from '../../../testing/mock-data/users'; import { CreateWorkspace } from '../CreateWorkspace'; const meta: Meta = { @@ -17,15 +19,23 @@ export default meta; export type Story = StoryObj; export const Default: Story = { - render: getRenderWrapperForPage( - - - - - , - '/create-workspace', - ), + render: getRenderWrapperForPage(, '/create/workspace'), parameters: { - msw: graphqlMocks, + msw: [ + graphql.query( + getOperationName(GET_CURRENT_USER) ?? '', + (req, res, ctx) => { + return res( + ctx.data({ + currentUser: mockedOnboardingUsersData[0], + }), + ); + }, + ), + ], + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await canvas.findByText('Create your workspace'); }, }; diff --git a/front/src/pages/auth/__stories__/SignInUp.stories.tsx b/front/src/pages/auth/__stories__/SignInUp.stories.tsx index a0dbb0b22..68032d93e 100644 --- a/front/src/pages/auth/__stories__/SignInUp.stories.tsx +++ b/front/src/pages/auth/__stories__/SignInUp.stories.tsx @@ -1,7 +1,6 @@ import type { Meta, StoryObj } from '@storybook/react'; +import { fireEvent, within } from '@storybook/testing-library'; -import { AuthModal } from '@/auth/components/Modal'; -import { AuthLayout } from '@/ui/layout/components/AuthLayout'; import { graphqlMocks } from '~/testing/graphqlMocks'; import { getRenderWrapperForPage } from '~/testing/renderWrappers'; @@ -17,15 +16,19 @@ export default meta; export type Story = StoryObj; export const Default: Story = { - render: getRenderWrapperForPage( - - - - - , - '/', - ), + render: getRenderWrapperForPage(, '/sign-in'), parameters: { msw: graphqlMocks, + cookie: { + tokenPair: '{}', + }, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + const continueWithEmailButton = await canvas.findByText( + 'Continue With Email', + ); + + await fireEvent.click(continueWithEmailButton); }, }; diff --git a/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx index 1fefb9cf7..535ce77c6 100644 --- a/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx +++ b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx @@ -1,4 +1,5 @@ import type { Meta, StoryObj } from '@storybook/react'; +import { within } from '@storybook/testing-library'; import { graphqlMocks } from '~/testing/graphqlMocks'; import { getRenderWrapperForPage } from '~/testing/renderWrappers'; @@ -19,4 +20,8 @@ export const Default: Story = { parameters: { msw: graphqlMocks, }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await canvas.findByText('All opportunities'); + }, }; diff --git a/front/src/pages/settings/__stories__/SettingsWorkspaceMembers.stories.tsx b/front/src/pages/settings/__stories__/SettingsWorkspaceMembers.stories.tsx index 0f1a74cae..b1f695bf8 100644 --- a/front/src/pages/settings/__stories__/SettingsWorkspaceMembers.stories.tsx +++ b/front/src/pages/settings/__stories__/SettingsWorkspaceMembers.stories.tsx @@ -1,4 +1,5 @@ import type { Meta, StoryObj } from '@storybook/react'; +import { within } from '@storybook/testing-library'; import { graphqlMocks } from '~/testing/graphqlMocks'; import { getRenderWrapperForPage } from '~/testing/renderWrappers'; @@ -22,4 +23,8 @@ export const Default: Story = { parameters: { msw: graphqlMocks, }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await canvas.findByText('Copy link'); + }, }; diff --git a/front/src/testing/mock-data/users.ts b/front/src/testing/mock-data/users.ts index d015615c9..9d07c437c 100644 --- a/front/src/testing/mock-data/users.ts +++ b/front/src/testing/mock-data/users.ts @@ -60,3 +60,60 @@ export const mockedUsersData: Array = [ }, }, ]; + +export const mockedOnboardingUsersData: Array = [ + { + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6d', + __typename: 'User', + email: 'workspace-onboarding@test.com', + displayName: '', + firstName: '', + lastName: '', + avatarUrl: null, + workspaceMember: { + __typename: 'WorkspaceMember', + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6b', + workspace: { + __typename: 'Workspace', + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6b', + displayName: '', + domainName: '', + inviteHash: 'twenty.com-invite-hash-1', + logo: '', + }, + }, + settings: { + id: '7dfbc3f7-6e5e-4128-957e-8d86808cde9y', + __typename: 'UserSettings', + locale: 'en', + colorScheme: ColorScheme.System, + }, + }, + { + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6d', + __typename: 'User', + email: 'profile-onboarding@test.com', + displayName: '', + firstName: '', + lastName: '', + avatarUrl: null, + workspaceMember: { + __typename: 'WorkspaceMember', + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6b', + workspace: { + __typename: 'Workspace', + id: '7dfbc3f7-6e5e-4128-957e-8d86808cdf6b', + displayName: 'Test', + domainName: 'test.com', + inviteHash: 'twenty.com-invite-hash-2', + logo: '', + }, + }, + settings: { + id: '7dfbc3f7-6e5e-4128-957e-8d86808cde9y', + __typename: 'UserSettings', + locale: 'en', + colorScheme: ColorScheme.System, + }, + }, +];