Note that we some of the fields rely on browser validation for some fields. We don't need to update those warnings as part of this task.

HTMLForm on its "codex" variant already uses Codex field components. The first two acceptance criteria are already met by current status quo:

• Special:CreateAccount uses Codex Field components for form inputs
• Validation messages use Codex inline Message component

The third AC Component implementation supports experimentation with different validation patterns and messaging it's a bit confusing. SpecialCreateAccount does not use VueJS for generating the form, it uses Codex CSS-only version of some components, namely CdxMessage,CdxField,CdxLabel,CdxButton,CdxCheckbox,CdxRadio,CdxSelect,CdxTextArea,CdxTextInput. That means that we can display HTML that looks like the Codex JS component version but has zero behavour and logic.

As per the last AC In addition to changing the dynamically added created messages, it is also approved to change the way errors messages are displayed in HTMLForm in general. We should clarify that there are three types of validation messages in this form. Live validation errors (shown as block below the field input), post-submit validation errors (shown as block below the field input same as prior) and post-submit umbrella top form error message (show as message block above the first field of the form).

From all criteria here, the only actionable that I've found is using cdx-message--inline instead of cdx-message--block for live and post-submit validation errors. This is how it looks when we mix live validation errors with post-submit errors. If this outcome is acceptable, the change is trivial. If we also want to change the top form error, that's also doable but need a confirmation, at first glance inline message does not look appropriate for that case, so leaving as it is makes sense. cc @AAlhazwani-WMF for confirmation.

Live validation	Top error + live validation	Top error + post submit validation

Change #1267000 had a related patch set uploaded (by Sergio Gimeno; author: Sergio Gimeno):

[mediawiki/core@master] HTMLFormField: use codex inline message for validation messages

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

This is how it looks when we mix live validation errors with post-submit errors. If this outcome is acceptable, the change is trivial. If we also want to change the top form error, that's also doable but need a confirmation, at first glance inline message does not look appropriate for that case, so leaving as it is makes sense. cc @AAlhazwani-WMF for confirmation.

I think we talked about this error-message at the top: it is fine to remain as a block-styled error message. Only the ones directly associated with an input should change to the inline style.

In T416666#11782171, @Michael wrote:

I think we talked about this error-message at the top: it is fine to remain as a block-styled error message. Only the ones directly associated with an input should change to the inline style.

Ack. Also, for clarity, this change can be released as regular improvement, not platform specific, and it is not part of any create account experiment right?

In T416666#11782469, @Sgs wrote:

In T416666#11782171, @Michael wrote:

I think we talked about this error-message at the top: it is fine to remain as a block-styled error message. Only the ones directly associated with an input should change to the inline style.

Ack. Also, for clarity, this change can be released as regular improvement, not platform specific, and it is not part of any create account experiment right?

Yes! Though it would be great to have it before v2 starts. But it is perfectly fine to arrive in the middle of v1.

Test wiki created on Patch demo by SGimeno (WMF) using patch(es) linked to this task:
https://07cef92349.catalyst.wmcloud.org/w/

Test wiki on Patch demo by SGimeno (WMF) using patch(es) linked to this task was deleted:

https://07cef92349.catalyst.wmcloud.org/w/

Test wiki created on Patch demo by SGimeno (WMF) using patch(es) linked to this task:
https://ad7f3db79a.catalyst.wmcloud.org/w/

In T416666#11782490, @Michael wrote:

Yes! Though it would be great to have it before v2 starts. But it is perfectly fine to arrive in the middle of v1.

I am now reluctant to release this change before v2 as it would create a non-ideal experience for "several validation errors" scenario, where error messages are stacked as ul.li items, the non-wrapped design of validation inline messages, generates a lot of text flying around, eg:

All/control V2	treatment V2

Note on placement: Also observe the inconsistency on the inline message placement, while in current experience it is below the input and above the help message, in experiment V2 treatment it is the other way around. The latter follows Codex field validation guidelines.

This changes can affect the control group, and since we don't have a current baseline, make the analysis of results more complex. Thoughts? @Michael @AAlhazwani-WMF @KStoller-WMF

I'm fine with waiting and releasing this as part of V2.
I updated the release task to make that clearer: T422295: [V2 experiment release] Mobile web account creation form improvements + username TL;DR

Test wiki on Patch demo by SGimeno (WMF) using patch(es) linked to this task was deleted:

https://ad7f3db79a.catalyst.wmcloud.org/w/