From a04bdc68244caca942092ae9f45292ae5f16c394 Mon Sep 17 00:00:00 2001
From: Charles Bochet <charles@twenty.com>
Date: Thu, 5 Oct 2023 16:16:02 +0200
Subject: [PATCH] Fix tests

---
 .../ui/button/components/LightIconButton.tsx     |  3 +++
 .../dropdown/components/DropdownMenuHeader.tsx   |  2 ++
 .../__stories__/Opportunities.stories.tsx        | 16 ++++++++++++----
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/front/src/modules/ui/button/components/LightIconButton.tsx b/front/src/modules/ui/button/components/LightIconButton.tsx
index 3f5e10c1b..e08569180 100644
--- a/front/src/modules/ui/button/components/LightIconButton.tsx
+++ b/front/src/modules/ui/button/components/LightIconButton.tsx
@@ -9,6 +9,7 @@ export type LightIconButtonSize = 'small' | 'medium';
 
 export type LightIconButtonProps = {
   className?: string;
+  testId?: string;
   Icon?: IconComponent;
   title?: string;
   size?: LightIconButtonSize;
@@ -81,6 +82,7 @@ const StyledButton = styled.button<
 export const LightIconButton = ({
   'aria-label': ariaLabel,
   className,
+  testId,
   Icon,
   active = false,
   size = 'small',
@@ -92,6 +94,7 @@ export const LightIconButton = ({
   const theme = useTheme();
   return (
     <StyledButton
+      data-testid={testId}
       aria-label={ariaLabel}
       onClick={onClick}
       disabled={disabled}
diff --git a/front/src/modules/ui/dropdown/components/DropdownMenuHeader.tsx b/front/src/modules/ui/dropdown/components/DropdownMenuHeader.tsx
index 66429d73d..36d4b3b20 100644
--- a/front/src/modules/ui/dropdown/components/DropdownMenuHeader.tsx
+++ b/front/src/modules/ui/dropdown/components/DropdownMenuHeader.tsx
@@ -44,6 +44,7 @@ export const DropdownMenuHeader = ({
     <StyledHeader {...props}>
       {StartIcon && (
         <LightIconButton
+          data-testid="dropdown-menu-header-end-icon"
           Icon={StartIcon}
           onClick={onClick}
           accent="tertiary"
@@ -53,6 +54,7 @@ export const DropdownMenuHeader = ({
       <StyledChildrenWrapper>{children}</StyledChildrenWrapper>
       {EndIcon && (
         <StyledLightIconButton
+          testId="dropdown-menu-header-end-icon"
           Icon={EndIcon}
           onClick={onClick}
           accent="tertiary"
diff --git a/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx
index 9ee3a61c1..3a4601138 100644
--- a/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx
+++ b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx
@@ -49,11 +49,15 @@ export const AddCompanyFromHeader: Story = {
         await canvas.findByTestId('company-progress-dropdown-menu'),
       );
 
-      const pipelineStageButton = await canvas.findByTestId(
+      const pipelineStageDropdownHeader = await canvas.findByTestId(
         'selected-pipeline-stage',
       );
 
-      await pipelineStageButton.click();
+      const pipelineStageDropdownUnfoldButton = await within(
+        pipelineStageDropdownHeader,
+      ).findByTestId('dropdown-menu-header-end-icon');
+
+      await pipelineStageDropdownUnfoldButton.click();
 
       const menuItem1 = await canvas.findByTestId('select-pipeline-stage-1');
 
@@ -67,11 +71,15 @@ export const AddCompanyFromHeader: Story = {
         await canvas.findByTestId('company-progress-dropdown-menu'),
       );
 
-      const pipelineStageButton = await canvas.findByTestId(
+      const pipelineStageDropdownHeader = await canvas.findByTestId(
         'selected-pipeline-stage',
       );
 
-      await pipelineStageButton.click();
+      const pipelineStageDropdownUnfoldButton = await within(
+        pipelineStageDropdownHeader,
+      ).findByTestId('dropdown-menu-header-end-icon');
+
+      await pipelineStageDropdownUnfoldButton.click();
 
       const menuItem1 = await canvas.findByTestId('select-pipeline-stage-1');