From 8a25fb3c0a72ccecafc7333b36619d3cbb1d9607 Mon Sep 17 00:00:00 2001
From: Gbacc <Gbacc@users.noreply.github.com>
Date: Thu, 21 Mar 2024 14:28:17 +0100
Subject: [PATCH] feat(DS): transmit DS Field data-test attributes to related
 description (#5235)

---
 .changeset/fifty-rocks-fly.md                      |  5 +++++
 .../src/components/Form/Primitives/Field/Field.tsx | 14 ++++++++++----
 .../Primitive/InlineMessagePrimitive.tsx           | 13 +++++++++----
 3 files changed, 24 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/fifty-rocks-fly.md

diff --git a/.changeset/fifty-rocks-fly.md b/.changeset/fifty-rocks-fly.md
new file mode 100644
index 00000000000..0d6adaeeaf3
--- /dev/null
+++ b/.changeset/fifty-rocks-fly.md
@@ -0,0 +1,5 @@
+---
+"@talend/design-system": minor
+---
+
+DS Field data-test attributes are now passed down to related description
diff --git a/packages/design-system/src/components/Form/Primitives/Field/Field.tsx b/packages/design-system/src/components/Form/Primitives/Field/Field.tsx
index 282b2ddd284..9390862f085 100644
--- a/packages/design-system/src/components/Form/Primitives/Field/Field.tsx
+++ b/packages/design-system/src/components/Form/Primitives/Field/Field.tsx
@@ -1,10 +1,10 @@
 import { forwardRef, ReactElement, Ref } from 'react';
 
+import { InlineMessageDestructive, InlineMessageInformation } from '../../../InlineMessage';
 import Link, { LinkProps } from '../../../Link/Link';
 import { StackVertical } from '../../../Stack';
-import Label, { LabelPrimitiveProps } from '../Label/Label';
-import { InlineMessageDestructive, InlineMessageInformation } from '../../../InlineMessage';
 import { VisuallyHidden } from '../../../VisuallyHidden';
+import Label, { LabelPrimitiveProps } from '../Label/Label';
 
 export type FieldStatusProps =
 	| {
@@ -54,12 +54,18 @@ const Field = forwardRef(
 		);
 
 		const Description = () => {
+			const inlineMessageProps = {
+				'data-test': children?.props['data-test'] && children?.props['data-test'] + '-description',
+				'data-testid':
+					children?.props['data-testid'] && children?.props['data-testid'] + '-description',
+			};
+
 			if (description) {
 				if (hasError) {
-					return <InlineMessageDestructive description={description} />;
+					return <InlineMessageDestructive description={description} {...inlineMessageProps} />;
 				}
 
-				return <InlineMessageInformation description={description} />;
+				return <InlineMessageInformation description={description} {...inlineMessageProps} />;
 			}
 			return null;
 		};
diff --git a/packages/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.tsx b/packages/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.tsx
index 34c70fb2be8..fc98688cce4 100644
--- a/packages/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.tsx
+++ b/packages/design-system/src/components/InlineMessage/Primitive/InlineMessagePrimitive.tsx
@@ -1,11 +1,15 @@
 import { forwardRef, HTMLAttributes, Ref } from 'react';
+
+import classnames from 'classnames';
+import { DataAttributes } from 'src/types';
+
 // eslint-disable-next-line @talend/import-depth
 import { IconNameWithSize } from '@talend/icons/dist/typeUtils';
-import classnames from 'classnames';
 
-import styles from './InlineMessagePrimitive.module.scss';
-import Link, { LinkProps } from '../../Link/Link';
 import { SizedIcon } from '../../Icon';
+import Link, { LinkProps } from '../../Link/Link';
+
+import styles from './InlineMessagePrimitive.module.scss';
 
 export type AvailableVariantsTypes = 'destructive' | 'success' | 'information' | 'warning' | 'beta';
 export type InlineMessageVariantType<T extends AvailableVariantsTypes, P extends object> = {
@@ -23,7 +27,8 @@ export type SharedInlineMessageTypes = {
 };
 
 export type BaseInlineMessageProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> &
-	SharedInlineMessageTypes;
+	SharedInlineMessageTypes &
+	Partial<DataAttributes>;
 
 const InlineMessagePrimitive = forwardRef(
 	(