Fix tests (#848)

* Fix tests

* Fix tests

* Fix tests

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