From 29e76eefc9d168238134a9dafd0565a4f1274a9c Mon Sep 17 00:00:00 2001
From: Guillaume Lepoetre <guillaume.lepoetre@prestashop.com>
Date: Tue, 31 Oct 2023 17:34:37 +0100
Subject: [PATCH] feat: add data-test to PuikTag

---
 packages/components/tag/src/tag.ts             | 5 +++++
 packages/components/tag/src/tag.vue            | 3 ++-
 packages/components/tag/stories/tag.stories.ts | 5 +++++
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/components/tag/src/tag.ts b/packages/components/tag/src/tag.ts
index f0b1ec83..e5eaf77a 100644
--- a/packages/components/tag/src/tag.ts
+++ b/packages/components/tag/src/tag.ts
@@ -52,6 +52,11 @@ export const tagProps = buildProps({
     Required: false,
     default: 'bottom',
   },
+  dataTest: {
+    type: String,
+    required: false,
+    default: undefined,
+  },
 } as const)
 
 export type TagProps = ExtractPropTypes<typeof tagProps>
diff --git a/packages/components/tag/src/tag.vue b/packages/components/tag/src/tag.vue
index 21f7bc8e..fec3e809 100644
--- a/packages/components/tag/src/tag.vue
+++ b/packages/components/tag/src/tag.vue
@@ -7,11 +7,12 @@
     ]"
   >
     <PuikIcon v-if="icon && icon != ''" :icon="icon" class="puik-tag__icon" />
-    <div class="puik-tag__content">
+    <div class="puik-tag__content" :data-test="`content-${dataTest}`">
       <puik-tooltip
         v-if="content?.length >= 30"
         :position="(tooltipPosition as PuikTooltipPosition)"
         :description="content"
+        :data-test="`tooltip-${dataTest}`"
       >
         <template #description>{{ content }}</template>
         {{ content }}
diff --git a/packages/components/tag/stories/tag.stories.ts b/packages/components/tag/stories/tag.stories.ts
index cc3d6251..b5c25d4d 100644
--- a/packages/components/tag/stories/tag.stories.ts
+++ b/packages/components/tag/stories/tag.stories.ts
@@ -103,6 +103,11 @@ export default {
         },
       },
     },
+    dataTest: {
+      description:
+        'Set the data-test attribute `content-${dataTest}` `tooltip-${dataTest}`',
+      control: 'text',
+    },
   },
   args: {
     id: 'puik-tag-id',