diff --git a/packages/terra-date-time-picker/CHANGELOG.md b/packages/terra-date-time-picker/CHANGELOG.md index 23e80dcb339..83773ebbc8e 100644 --- a/packages/terra-date-time-picker/CHANGELOG.md +++ b/packages/terra-date-time-picker/CHANGELOG.md @@ -2,6 +2,9 @@ ## Unreleased +* Fixed + * Fixed the accessibility issue to allow announcement as a single group label. + ## 4.114.0 - (April 4, 2024) * Changed diff --git a/packages/terra-date-time-picker/src/DateTimePicker.jsx b/packages/terra-date-time-picker/src/DateTimePicker.jsx index a492af2e63f..2597550b3b7 100644 --- a/packages/terra-date-time-picker/src/DateTimePicker.jsx +++ b/packages/terra-date-time-picker/src/DateTimePicker.jsx @@ -780,6 +780,8 @@ class DateTimePicker extends React.Component { {...customProps} className={cx('date-time-picker', theme.className)} ref={this.dateTimePickerContainer} + role="group" + aria-label={ariaLabel} > -
{ ); expect(dateTime).toMatchSnapshot(); }); + +it('renders DateTimePicker with correct ARIA attributes', () => { + const ariaLabel = 'Enter Date/Time'; + const role = 'group'; + const dateTime = enzymeIntl.shallowWithIntl( + , + ); + expect(dateTime.prop('ariaLabel')).toBe(ariaLabel); + expect(dateTime.prop('role')).toBe(role); + expect(dateTime).toMatchSnapshot(); +}); diff --git a/packages/terra-date-time-picker/tests/jest/__snapshots__/DateTimePicker.test.jsx.snap b/packages/terra-date-time-picker/tests/jest/__snapshots__/DateTimePicker.test.jsx.snap index 301b3b0ab02..f2a94b10eb2 100644 --- a/packages/terra-date-time-picker/tests/jest/__snapshots__/DateTimePicker.test.jsx.snap +++ b/packages/terra-date-time-picker/tests/jest/__snapshots__/DateTimePicker.test.jsx.snap @@ -17,6 +17,52 @@ exports[`correctly applies the theme context className 1`] = ` `; +exports[`renders DateTimePicker with correct ARIA attributes 1`] = ` + +`; + exports[`should render a date time picker with a default date and time 1`] = `