"AI Suggestions" button accessibility
>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3531588. --> Reported by: [leo pitt](https://www.drupal.org/user/507600) Related to !694 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>As of <a href="https://www.drupal.org/project/ai/issues/3489572">https://www.drupal.org/project/ai/issues/3489572</a>, ai_content_suggestions now offers the ability for content editors to generate suggestions for content fields by clicking a button alongside an individual field, and receive a list of suggestions to choose from.</p> <p>There are some parts of the process which are currently a little confusing.</p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <ol> <li>Create a standard Drupal CMS install.</li> <li>Add a "Teaser" plain long text field to the standard Article content type.</li> <li>Go to the Form Display configuration and enable AI Suggestions for the Title, Teaser and Body field. Save.</li> <li>Go to create a new Article</li> <li>Attempt to click on the "AI Function" icon to the right of the Title field</li> <li>Try to locate the "AI Function" icon for the Teaser field.</li> </ol> <h3>Areas for possible update</h3> <h4>AI Function Usability</h4> <p>I expect that be able to activate the AI Function immediately by clicking on it.</p> <p>But instead when I click on the "AI Function" text, it disappears, the field is focussed, and a new AI Icon appears to the right of the field, which I have to click on again to trigger the desired functionality.</p> <h4>AI Function Accessibility</h4> <p>Using the keyboard, it is not possible to activate the function: I expect to be able to tab to the "AI Function" button to activate it. But when I tab to field, the "AI Button" disappears. And when I tab again to focus the new button that has appeared, the field loses focus and the intended button disappears.</p> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <ul> <li>Have the "AI Suggestions" button be visible at all times - not visible only when the field is focussed. Ensure it has an accessible label.</li> <li>Remove the "AI Suggestions" pseudo element which is on the field and disappears when focussed.</li> </ul>
issue