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 ;
+ return ;
}
- return ;
+ return ;
}
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 = {
@@ -23,7 +27,8 @@ export type SharedInlineMessageTypes = {
};
export type BaseInlineMessageProps = Omit, 'style'> &
- SharedInlineMessageTypes;
+ SharedInlineMessageTypes &
+ Partial;
const InlineMessagePrimitive = forwardRef(
(