fix(validator): project validation messages for a host that starts invalid - #2374
Merged
Conversation
…valid The container's first render is neutral for SSR parity and `create` skips the light DOM projection slots until the host has updated. A host that hydrated invalid (`<igc-input required invalid>`) never re-rendered, so its validation messages stayed hidden. The container now asks the host for a follow-up render from `firstUpdated` when it is invalid. Also: - cache kebab-cased slot names at module load instead of per render - take the projected-slot set in `_renderHelper` and make the render helpers private - tighten comments and the `target` docs; the `?invalid` note wrongly claimed the internal events cover failed submissions - add specs for the initially invalid host and the `create()` config
Contributor
There was a problem hiding this comment.
🟡 Changes recommended
create() currently treats an omitted hasHelperText as false (disabling helper text when config is provided), and the updated spec should include the required accessibility audit assertions to match project testing conventions.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
Fixes a hydration/SSR-parity edge case where a form control that starts out invalid never triggers the follow-up host render needed for projecting validation-message slots, leaving validation messages hidden. The container now prompts a host re-render from firstUpdated when starting invalid, and the PR also refactors slot-name handling and expands specs around initial-invalid and create() configuration behavior.
Changes:
- Request a follow-up host render from the container’s
firstUpdated()when the host hydrates invalid so validation slots can be projected. - Refactor validation slot name generation by caching kebab-cased slot names at module load and tightening internal helper APIs.
- Add/extend specs for the “initially invalid host” case and
create()configuration behavior.
File summaries
| File | Description |
|---|---|
| src/components/validation-container/validation-container.ts | Updates slot generation and lifecycle behavior to ensure projected validation messages appear when the host starts invalid. |
| src/components/validation-container/validation-container.spec.ts | Adds coverage for initially-invalid hosts and create() config scenarios (with suggested additions for a11y + default helper slot behavior). |
Review details
- Files reviewed: 2/2 changed files
- Comments generated: 3
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Comment on lines
99
to
101
| const helperText = config.hasHelperText | ||
| ? html`<slot name="helper-text" slot="helper-text"></slot>` | ||
| : nothing; |
Comment on lines
+138
to
+143
| it('projects a helper-text slot by default', async () => { | ||
| const container = await createContainer(); | ||
|
|
||
| expect(container.id).to.equal(helperSlot); | ||
| expect(container.querySelector(projectedHelperSlot)).not.to.be.null; | ||
| }); |
Comment on lines
+152
to
+162
| it('applies the id, slot and part from the configuration', async () => { | ||
| const container = await createContainer({ | ||
| id: 'custom-id', | ||
| slot: 'anchor', | ||
| part: 'custom-part', | ||
| }); | ||
|
|
||
| expect(container.id).to.equal('custom-id'); | ||
| expect(container.slot).to.equal('anchor'); | ||
| expect(container.part.contains('custom-part')).to.be.true; | ||
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The container's first render is neutral for SSR parity and
createskips the light DOM projection slots until the host has updated. A host that hydrated invalid (<igc-input required invalid>) never re-rendered, so its validation messages stayed hidden. The container now asks the host for a follow-up render fromfirstUpdatedwhen it is invalid.Also:
_renderHelperand make the render helpers privatetargetdocs; the?invalidnote wrongly claimed the internal events cover failed submissionscreate()configType of Change
Checklist