[a11y]: The AI Label examples on inputs are not prepopulated in storybook

[mbgower]

Package

@carbon/react

Browser

Chrome

Operating System

MacOS

Package version

Storybook https://react.carbondesignsystem.com/?path=/story/components-textinput--with-ai-label

React version

Storybook version

Automated testing tool and ruleset

n/a

Assistive technology

n/a

Description

I've put this under "Accessibility" because of the ramifications of the bug, but maybe it's likely better just listed as a bug...?

The prior experimental versions of the AI slug had demos for various inputs. These allowed the user to see how a pre-populated value in an input, flagged by the AI slug (now called AI Label), when altered, provided a revert function. This revert function is covered in the component documentation

AFAIK, none of the implementations of the AI label that have been added to various inputs possess this ability in storybook, because none of them are prepopulated with values.

First, it does not make logical sense for the AI label to reside in an unpopulated field. The AI label is meant to indicate when a value has been generated by AI. WIth no value, the AI label should not exist.

Further, because the AI label is already in place on the empty field, I cannot trigger the revert function, even if I add a value to the field.

The result is one cannot test these interactions for accessibility, or use them to confirm expected behaviour.

WCAG 2.1 Violation

No response

Reproduction/example

https://react.carbondesignsystem.com/?path=/story/components-textinput--with-ai-label

Steps to reproduce

1. Go to any of the inputs in Storybook and choose "With AI label" from its variants.
   The AI label exists, but there is not value.
2. Populate a value.
3. No revert function appears.

Suggested Severity

None

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems

[mbgower]

@aagonzales I mentioned this in some thread awhile ago, but since it came up as a problem again today, i thought I'd better generate an issue for it.

[alina-jacob]

Thanks for creating and detailing out the issue Michael, just sharing some observations!

In the initial storybook examples, the Revert functionality existed only for two components, Text and Number input. This was also placed under a folder named Revert test. So technically, the other components were never built to show the full workflow from AI presence to Revert. But you're right, its worth adding them so users can fully understand the interaction.

I did find Revert available for the Form component, but its not working as intended.