refactor(form): make errrormessageid required #1365

akashsonune · 2026-01-23T08:25:25Z

BREAKING CHANGE: The property SiFormItemControl.errormessageId is now required. All implementations of SiFormItemControl must provide this property to ensure proper accessibility support for error messages.

Describe in detail what your merge request does and why. Add relevant
screenshots and reference related issues via Closes #XY or Related to #XY.

I confirm that this MR follows the contribution guidelines.

gemini-code-assist · 2026-01-23T08:25:40Z

Summary of Changes

Hello @akashsonune, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a breaking change by making the errormessageId property mandatory within the SiFormItemControl interface. This change is designed to significantly enhance accessibility by guaranteeing that all form item controls consistently provide an identifier for their associated error messages, which is vital for assistive technologies like screen readers.

Highlights

Interface Modification: The errormessageId property in the SiFormItemControl interface has been changed from optional to required, ensuring all implementations provide this crucial accessibility identifier.
Directive Implementation: The SiFormlyFormFieldProviderDirective now explicitly implements the errormessageId property, dynamically computing its value based on the field's ID to maintain consistency.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	`/gemini review`	Performs a code review for the current pull request in its current state.
Pull Request Summary	`/gemini summary`	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	`/gemini help`	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

projects/element-ng/form/si-form-item.control.ts

gemini-code-assist

Code Review

This pull request makes the errormessageId property on the SiFormItemControl interface required, which is a breaking change. This is a good step towards improving accessibility for form error messages. The change is correctly implemented in SiFormlyFormFieldProviderDirective to satisfy the new interface requirement. However, I've noted an issue with the implementation in SiFormlyFormFieldProviderDirective where it doesn't fully adhere to the contract of SiFormItemControl regarding the assignment of aria-describedby, which is crucial for accessibility. Please see my detailed comment.

projects/element-ng/formly/wrapper/si-formly-form-field-provider.directive.ts

github-actions · 2026-01-23T08:40:46Z

Documentation.
Examples.
Playwright report.

Coverage Reports:

BREAKING CHANGE: The property `SiFormItemControl.errormessageId` is now required. All implementations of `SiFormItemControl` must provide this property to ensure proper accessibility support for error messages.

projects/element-ng/form/si-form-item.control.ts

spike-rabbit

Seems like many of our examples are broken. Please fix them ideally in another PR upfront so we don't mix the changes here.

spike-rabbit · 2026-01-28T16:56:47Z

src/app/examples/si-application-header/si-launchpad.html

            <div class="row g-4">
              <div class="col-sm-12">
-                <si-form-item class="mb-0">
+                <si-form-item label="" class="mb-0">


Please fix the usage of the form-item here instead of just adding an empty label

spike-rabbit · 2026-01-28T16:57:40Z

src/app/examples/si-datepicker/si-datepicker-input.html

 <div class="row justify-content-center mx-0">
  <div class="col-xs-12 col-12 col-md-4 my-4">
-    <si-form-item>
+    <si-form-item label="">


Those should all have a lable. Otherwise this is an a11y flaw

spike-rabbit · 2026-01-28T16:58:30Z

src/app/examples/si-localization/si-localization.html

 <si-form-container>
  <div si-form-container-content class="p-6">
-    <si-form-item>
+    <si-form-item label="">


same here, should have a label. Please also use the form-item in a correct way

spike-rabbit · 2026-01-28T16:59:42Z

projects/element-ng/form/si-form-item/si-form-field-native.control.ts


  isFormCheck: boolean;

+  readonly labelledby = null;


I guess this change is no longer needed

spike-rabbit · 2026-01-28T17:00:15Z

projects/element-ng/ag-grid/components/ag-date-input.component.ts

  imports: [FormsModule, SiDatepickerDirective, SiCalendarButtonComponent, SiFormItemComponent],
  template: `
-    <si-form-item>
+    <si-form-item label="">


Out of scope of this PR, but this also must have a real label for a11y

github-actions · 2026-01-28T18:16:27Z

BREAKING CHANGE: The input `SiFormItemComponent.label` is now required.

akashsonune requested review from a team and chintankavathia as code owners January 23, 2026 08:25

akashsonune added the breaking-changes Marks issues and PRs that are breaking the API label Jan 23, 2026

akashsonune added this to the 49.0.0 milestone Jan 23, 2026

spike-rabbit requested changes Jan 23, 2026

View reviewed changes

projects/element-ng/form/si-form-item.control.ts Outdated Show resolved Hide resolved

gemini-code-assist bot reviewed Jan 23, 2026

View reviewed changes

projects/element-ng/formly/wrapper/si-formly-form-field-provider.directive.ts Show resolved Hide resolved

refactor(form): make errrormessageid required

185bbd6

BREAKING CHANGE: The property `SiFormItemControl.errormessageId` is now required. All implementations of `SiFormItemControl` must provide this property to ensure proper accessibility support for error messages.

akashsonune force-pushed the refactor/make-errormessageid-required branch from f9e81dc to 0d00bca Compare January 27, 2026 07:09

akashsonune requested review from dr-itz and spliffone as code owners January 27, 2026 07:09

akashsonune force-pushed the refactor/make-errormessageid-required branch from 0d00bca to fbe5d89 Compare January 27, 2026 10:21

spike-rabbit requested changes Jan 27, 2026

View reviewed changes

projects/element-ng/form/si-form-item.control.ts Show resolved Hide resolved

akashsonune force-pushed the refactor/make-errormessageid-required branch from fbe5d89 to 5a1b28a Compare January 27, 2026 13:00

akashsonune requested a review from a team as a code owner January 27, 2026 13:00

akashsonune force-pushed the refactor/make-errormessageid-required branch from 5a1b28a to 46a97f5 Compare January 27, 2026 13:36

spike-rabbit requested changes Jan 28, 2026

View reviewed changes

akashsonune force-pushed the refactor/make-errormessageid-required branch from 46a97f5 to fa68f68 Compare January 28, 2026 18:06

refactor(form): make input label as required

74dee51

BREAKING CHANGE: The input `SiFormItemComponent.label` is now required.

akashsonune force-pushed the refactor/make-errormessageid-required branch from fa68f68 to 74dee51 Compare January 29, 2026 09:09

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor(form): make errrormessageid required #1365

refactor(form): make errrormessageid required #1365

akashsonune commented Jan 23, 2026

Uh oh!

gemini-code-assist bot commented Jan 23, 2026

Uh oh!

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

Uh oh!

github-actions bot commented Jan 23, 2026

Uh oh!

Uh oh!

spike-rabbit left a comment

Uh oh!

spike-rabbit Jan 28, 2026

Uh oh!

spike-rabbit Jan 28, 2026

Uh oh!

spike-rabbit Jan 28, 2026

Uh oh!

spike-rabbit Jan 28, 2026

Uh oh!

spike-rabbit Jan 28, 2026

Uh oh!

github-actions bot commented Jan 28, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

refactor(form): make errrormessageid required #1365

Are you sure you want to change the base?

refactor(form): make errrormessageid required #1365

Conversation

akashsonune commented Jan 23, 2026

Uh oh!

gemini-code-assist bot commented Jan 23, 2026

Summary of Changes

Highlights

Footnotes

Uh oh!

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

github-actions bot commented Jan 23, 2026

Uh oh!

Uh oh!

spike-rabbit left a comment

Choose a reason for hiding this comment

Uh oh!

spike-rabbit Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

spike-rabbit Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

spike-rabbit Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

spike-rabbit Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

spike-rabbit Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Jan 28, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants