Fix tests (#848)

* Fix tests

* Fix tests

* Fix tests

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/**/*"
     ]

front/src/modules/ui/layout/components/AuthLayout.tsx

@@ -1,10 +0,0 @@
-import { CompaniesMockMode } from '~/pages/companies/CompaniesMockMode';
-
-export function AuthLayout({ children }: React.PropsWithChildren) {
-  return (
-    <>
-      <CompaniesMockMode />
-      {children}
-    </>
-  );
-}

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<typeof CreateProfile> = {
@@ -17,15 +19,23 @@ export default meta;
 export type Story = StoryObj<typeof CreateProfile>;
 
 export const Default: Story = {
-  render: getRenderWrapperForPage(
-    <AuthLayout>
-      <AuthModal>
-        <CreateProfile />
-      </AuthModal>
-    </AuthLayout>,
-    '/auth/create-profile',
-  ),
+  render: getRenderWrapperForPage(<CreateProfile />, '/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');
   },
 };

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<typeof CreateWorkspace> = {
@@ -17,15 +19,23 @@ export default meta;
 export type Story = StoryObj<typeof CreateWorkspace>;
 
 export const Default: Story = {
-  render: getRenderWrapperForPage(
-    <AuthLayout>
-      <AuthModal>
-        <CreateWorkspace />
-      </AuthModal>
-    </AuthLayout>,
-    '/create-workspace',
-  ),
+  render: getRenderWrapperForPage(<CreateWorkspace />, '/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');
   },
 };

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<typeof SignInUp>;
 
 export const Default: Story = {
-  render: getRenderWrapperForPage(
-    <AuthLayout>
-      <AuthModal>
-        <SignInUp />
-      </AuthModal>
-    </AuthLayout>,
-    '/',
-  ),
+  render: getRenderWrapperForPage(<SignInUp />, '/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);
   },
 };

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');
+  },
 };

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');
+  },
 };

front/src/testing/mock-data/users.ts

@@ -60,3 +60,60 @@ export const mockedUsersData: Array<MockedUser> = [
     },
   },
 ];
+
+export const mockedOnboardingUsersData: Array<MockedUser> = [
+  {
+    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,
+    },
+  },
+];