Skip to content

chore(atomic): migrate atomic-insight-result-children-template to Lit#7171

Open
alexprudhomme wants to merge 21 commits intomainfrom
alexprudhomme/insight-result-template-children-4u8
Open

chore(atomic): migrate atomic-insight-result-children-template to Lit#7171
alexprudhomme wants to merge 21 commits intomainfrom
alexprudhomme/insight-result-template-children-4u8

Conversation

@alexprudhomme
Copy link
Contributor

@alexprudhomme alexprudhomme commented Feb 25, 2026

Migrates atomic-insight-result-children-template from Stencil to Lit, following the same patterns established by the search-equivalent atomic-result-children-template.

What changed

  • New Lit component — uses ResultTemplateController, @errorGuard(), @mapProperty, and @withTailwindStyles decorators
  • Imports from @coveo/headless/insight instead of @coveo/headless (the Stencil original used the less-specific import)
  • Unit tests (Vitest + browser mode) covering instantiation, default props, connectedCallback match conditions, getTemplate delegation, render output, and error rendering
  • E2E tests (Playwright) for default, nested grandchildren, and conditional template stories
  • Storybook stories (3): Default, With nested children (via inherit-templates), With conditions
  • MDX documentation with usage examples, template condition semantics, and nested children guidance
  • Registration in index.ts, lazy-index.ts, custom-element-tags.ts, and components.d.ts
  • Cypress test for the Atomic Insight result panel were removed

Scout camping

  • atomic-result-children-template.spec.ts (search sibling): fixed mockResolvedValuemockReturnValue (getTemplate is synchronous) and .toBeDefined().not.toBeNull() (vacuous assertion on querySelector return)

Editorial choices

  • allowEmpty kept as false (matching the Stencil original default) rather than setting it to true
  • Mock data refactored: extracted child result objects into reusable constants; added nestedFoldedResponse with grandchildren for the nested story
  • Module-level mock() instead of mockOnce in beforeEach, so the Storybook Docs page renders all stories correctly (shared harness was being exhausted)
  • @internal tag removed — intentional, needed for Storybook custom element manifest generation

Checklist

  • 🧪 The component is unit tested
  • 🧪 The component includes E2E tests
  • 🗑️ Old Cypress tests exclusive to the component are removed
  • 📖 The component is documented in storybook with an .mdx file
  • ♿ The component complies with the Web Content Accessibility Guidelines. N/A: Template-only component; renders nothing — accessibility depends on slotted content
  • 🌐 All strings intended for humans or assistive technology must be localized with i18n. N/A: No user-facing strings
  • 📦 The Lit component is exported in the appropriate index.ts and lazy-index.ts files.
  • 🎨 CSS parts are documented still accessible. N/A: Component renders nothing; no CSS parts
  • 🦥 Slotted Content, public methods and properties are documented
  • 🔄 The component outputs the same Angular output as before with Stencil N/A: Template component — not wrapped in Angular
  • 🏷️ The component declares the component type in the HTMLElementTagNameMap

https://coveord.atlassian.net/browse/KIT-5481

- Migrate Stencil component to Lit using ResultTemplateController
- Make component public (remove @internal)
- Add unit tests (7 test cases)
- Add e2e test infrastructure (page-object, fixture, e2e spec)
- Add Storybook stories (Default, WithConditions, WithNestedChildren)
- Add MDX documentation
- Update parent component import
- Delete old Stencil component
@alexprudhomme alexprudhomme changed the title feat(atomic): migrate atomic-insight-result-children-template to Lit chore(atomic): migrate atomic-insight-result-children-template to Lit Feb 26, 2026
…hildren-template (#7178)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: fbeaudoincoveo <23503066+fbeaudoincoveo@users.noreply.github.com>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the last Stencil component we're migrating. We no longer need the Atomic Insight Cypress tests. Bye bye!

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

o7

* For example, a template with the following attribute only applies to child results whose `filetype` and `sourcetype` fields are defined:
* `if-defined="filetype,sourcetype"`
*/
@property({type: String, attribute: 'if-defined'}) ifDefined?: string;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note that this prop and ifNotDefined are not present in the atomic-result-children-template (i.e., the search version). I'm leaving them here to avoid breaking changes, but there's a discrepancy.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants