jpmorganchase / salt-ds

React UI components built with a focus on accessibility, customisation and ease-of-use
https://www.saltdesignsystem.com
Apache License 2.0
109 stars 78 forks source link

Input not reading out content (text) passed in end Adornment #3615

Open ThusharaJ07 opened 1 week ago

ThusharaJ07 commented 1 week ago

Package name(s)

Core (@salt-ds/core)

Package version(s)

@salt-ds/core": "1.29.0

Description

Adornments should be read similar to a placeholder when user lands on the text input field. Based on the current configuration for the end adornment of “USD”, the Salt storybook shows a configuration where the salt Text element is passed which results in the attached image. <Input endAdornment={USD} defaultValue={args.defaultValue ?? "Value 1"} {...args} />

https://storybook.saltdesignsystem.com/?path=/story/core-input--with-static-adornments

Steps to reproduce

Use screenreader to tab onto field in example.

Expected behavior

Screenreader should announce something like “Edit text, USD"

Operating system

Browser

Are you a JPMorgan Chase & Co. employee?

origami-z commented 1 week ago

Will need information whether expectation is the same between static adornment and button adornments

mark-tate commented 1 week ago

Goal: S(3)

Pepper team to provide more information (update this story)

ThusharaJ07 commented 5 days ago

Updates:

origami-z commented 5 days ago

Update static adornment examples with a11y recommendation, likely via aria-describedby