@Sarai-WMDE Could you please have a look at this? We received it as part of teh testing feedback.

The new designs are aligned with the system design proposal to only display an indicator when fields are optional. Even if that's the general rule, I agree that informing users about required fields after submission might not be the best pattern in the context at hand. I think we should make it apparent to users of the NewLexemeAlpha page that all fields are required.

Now, adding an asterisk within the fields is not recommended: as of now, the decision is to not introduced this pattern in our new common system [1]. A simple solution instead might be to add an asterisk beside the fields' labels (e.g. Lemma*) :

There's no need to update WiKit for this, as the indicators can be added in context. This pattern is visually aligned with the general Norman/Nielsen recommendation, but we can iterate (e.g. use a different color or placement) if we detect that the indicator is not sufficiently visible.

[1] The current end icon included within the fields is not compatible with all form elements (e.g. Select). The design system team didn't find it acceptable to display said asterisk sometimes inside and sometimes outside of form elements (depending on whether it fits or not), as it impacts recognition. Therefore, the current solution (depicted in the second screenshot included in the description) was discarded.

Thank you! That makes sense. Let's do that.

Implementation note:

We should make sure that the fields have the aria-required attribute set to true to ensure that this information is also translated to screen readers.

In T313113#8100800, @Michael wrote:

Implementation note:

We should make sure that the fields have the aria-required attribute set to true to ensure that this information is also translated to screen readers.

I'm not sure if this is necessary, The input field is still an input at the lowest level, and I should hope that any signifier of it as a required field would find itself in the input field too. AFAIK, aria-required is only needed on non semantic elements like a <div> with contenteditable for example.

In T313113#8100800, @Michael wrote:

Implementation note:

We should make sure that the fields have the aria-required attribute set to true to ensure that this information is also translated to screen readers.

It looks like that’s already the case, so we just need to not remove it:

<div class="wikit wikit-TextInput wbl-snl-lemma-input" data-v-0aac40c2="">
  <span class="wikit-TextInput__label-wrapper">
    <label class="wikit-TextInput__label" for="wikit-TextInput-725624">Lemma</label>
    <span></span>
  </span>
  <input type="text" class="wikit wikit-Input" id="wikit-TextInput-725624" placeholder="Base form of a word, e.g. 'cat'" name="lemma" aria-required="true">
  <!---->
</div>

I agree with the need to add aria-required to all the fields in order to make users of screen readers aware of a state that we're communicating via a visual cue in the label. I didn't mention it myself because I found that attribute already applied on inspection.

But I'm realizing now that the attribute is not used by lookups:

Task Breakdown Notes:

• We can make two tasks, one to add the asterisk (in special-new-lexeme-page.git), and the other to add the aria-required attribute
• The aria-required attribute should probably be a toggled boolean prop passed down to the lookup's input
• Adding the asterisk can be done by adding it to the suffix slot of the input label
• To hide the asterisk from screen readers, we can wrap it in a span and add aria-hidden to it

Potential Plan of Action:

• Add asterisk to each of the three required lookup components [TASK TBC: @noarave ]
• In wikit: review Lucas' PR at: https://github.com/wmde/wikit/pull/618 [TASK TBC: @Lucas_Werkmeister_WMDE]

Change 820097 had a related patch set uploaded (by Lucas Werkmeister (WMDE); author: Lucas Werkmeister (WMDE)):

[mediawiki/extensions/WikibaseLexeme@master] Bump Special:NewLexemeAlpha

https://gerrit.wikimedia.org/r/820097

Change 820097 merged by jenkins-bot:

[mediawiki/extensions/WikibaseLexeme@master] Bump Special:NewLexemeAlpha

https://gerrit.wikimedia.org/r/820097