Stabilize flaky Argos stories in twenty-front storybook (#21691)

Three twenty-front stories rendered non-deterministically and
intermittently tripped Argos as false positives (flaky on `main`, not
caused by any recent change). Each is now deterministic:

- **SettingsDataModelFieldSettingsFormCard › WithRelationForm**: the
relation preview was screenshotted mid-settle — it briefly shows the
fallback object/record before the form default and the sample record
load. Added a `play` that waits for the settled state so Argos captures
it consistently.
- **MultiSelectInput › SingleSelection**: the final deselect click left
a transient hover/tooltip. The play now moves the pointer off the option
and waits for the tooltip to disappear.
- **Breadcrumb › Default**: ambiguous intrinsic width made the last
crumb flip between "New" and "N…". Gave the story a fixed container
width.

Verified the three stories pass in the Storybook vitest runner across
repeated runs.

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/21691?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->

packages/twenty-front/src/modules/settings/data-model/fields/forms/components/__stories__/SettingsDataModelFieldSettingsFormCard.stories.tsx

@@ -1,4 +1,5 @@
 import { type Meta, type StoryObj } from '@storybook/react-vite';
+import { expect, waitFor, within } from 'storybook/test';
 
 import { FieldMetadataType } from '~/generated-metadata/graphql';
 import { FormProviderDecorator } from '~/testing/decorators/FormProviderDecorator';
@@ -57,6 +58,13 @@ export const WithRelationForm: Story = {
     fieldType: FieldMetadataType.RELATION,
     objectNameSingular: 'company',
   },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+
+    await waitFor(() => {
+      expect(canvas.getByText('Housecall Pro')).toBeVisible();
+    });
+  },
 };
 
 export const WithSelectForm: Story = {

packages/twenty-front/src/modules/ui/field/input/components/__stories__/MultiSelectInput.stories.tsx

@@ -210,6 +210,12 @@ export const SingleSelection: Story = {
 
       expect(checkboxes).toHaveLength(0);
     });
+
+    await userEvent.unhover(canvas.getByText('Professional Network'));
+
+    await waitFor(() => {
+      expect(canvas.queryByRole('tooltip')).not.toBeInTheDocument();
+    });
   },
 };
 

packages/twenty-front/src/modules/ui/navigation/bread-crumb/components/__stories__/Breadcrumb.stories.tsx

@@ -15,6 +15,9 @@ const meta: Meta<typeof Breadcrumb> = {
       { children: 'New' },
     ],
   },
+  parameters: {
+    container: { width: 350 },
+  },
 };
 
 export default meta;