✨ (toolbar-button.tsx): add data-testid prop to ToolbarButton component for better testing capabilities

📝 (index.tsx): add data-testid attribute to various ToolbarButton components for better testability

Author: Cristhianzl

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/components/toolbar-button.tsx

@@ -13,19 +13,22 @@ export const ToolbarButton = memo(
     label,
     shortcut,
     className,
+    dataTestId,
   }: {
     onClick: () => void;
     icon: string;
     label?: string;
     shortcut?: any;
     className?: string;
+    dataTestId?: string;
   }) => (
     <ShadTooltip content={<ShortcutDisplay {...shortcut} />} side="top">
       <Button
         className={cn("node-toolbar-buttons", className)}
         variant="ghost"
         onClick={onClick}
         size="node-toolbar"
+        data-testid={dataTestId}
       >
         <ForwardedIconComponent name={icon} className="h-4 w-4" />
         {label && <span className="text-[13px] font-medium">{label}</span>}

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

@@ -444,6 +444,7 @@ const NodeToolbarComponent = memo(
               shortcut={shortcuts.find((s) =>
                 s.name.toLowerCase().startsWith("code"),
               )}
+              dataTestId="code-button-modal"
             />
           )}
           {nodeLength > 0 && (
@@ -454,6 +455,7 @@ const NodeToolbarComponent = memo(
               shortcut={shortcuts.find((s) =>
                 s.name.toLowerCase().startsWith("advanced"),
               )}
+              dataTestId="edit-button-modal"
             />
           )}
           {!hasToolMode && (
@@ -471,6 +473,7 @@ const NodeToolbarComponent = memo(
                 s.name.toLowerCase().startsWith("freeze path"),
               )}
               className={cn("node-toolbar-buttons", frozen && "text-blue-500")}
+              dataTestId="freeze-path-button"
             />
           )}
           {hasToolMode && (