Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Nov 19, 2025

βœ… 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.
  • 🌐 All strings intended for humans or assistive technology must be localized with i18n.
  • πŸ“¦ The Lit component is exported in the appropriate index.ts and lazy-index.ts files.
  • 🎨 CSS parts are documented still accessible.
  • πŸ¦₯ Slotted Content, public methods and properties are documented
  • πŸ”„ The component outputs the same Angular output as before with Stencil
  • 🏷️ The component declares the component type in the HTMLElementTagNameMap

https://coveord.atlassian.net/browse/KIT-[____]

fix #6413

Description

Migrates the atomic-automatic-facet component from Stencil to Lit. This component is a specialized facet generated by the automatic facets feature and is used internally by atomic-automatic-facet-generator.

Changes Made

Component Migration

  • Converted component from Stencil (.tsx) to Lit (.ts) with Tailwind CSS styling
  • Moved component from facets/atomic-automatic-facet/ to top-level atomic-automatic-facet/ directory in /search folder
  • All imports converted to @/* path aliases
  • Replaced JSX with html template literals and Lit directives (when, nothing)
  • Applied proper Lit decorators (@customElement, @bindings(), @withTailwindStyles)

Testing

  • Created buildFakeAutomaticFacet test fixture
  • Added comprehensive Vitest unit tests (300+ lines) covering all functionality
  • Added minimalist golden path E2E tests with Playwright:
    • Page object model for component interactions
    • Test fixtures for test setup
    • 4 golden path test cases covering rendering, value selection, and clearing
  • Analyzed and migrated 12 Cypress test scenarios
  • Removed Cypress test files (170+ lines)
  • Improved test organization by grouping shadow part tests under descriptive blocks
  • Removed duplicate test cases

Documentation

  • Added .mdx file documenting internal nature, shadow parts, and generator relationship
  • Added Storybook stories for component demonstration

Updated Files

  • Updated React wrapper to export the migrated component
  • Added test fixtures for the automatic facet controller
  • Updated component exports in index.ts and lazy-index.ts

Testing

  • βœ… All unit tests pass
  • βœ… E2E tests validate golden path scenarios
  • βœ… Linting passes
  • βœ… Build succeeds without errors
  • βœ… Component maintains same API and behavior as Stencil version

πŸ’¬ We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Copilot AI and others added 5 commits November 19, 2025 15:10
BREAKING CHANGE: atomic-automatic-facet has been migrated from Stencil to Lit

Co-authored-by: alexprudhomme <[email protected]>
Copilot AI changed the title [WIP] Migrate atomic-automatic-facet to search folder feat(atomic): migrate atomic-automatic-facet to Lit Nov 19, 2025
Copilot AI requested a review from alexprudhomme November 19, 2025 15:32
Copilot finished work on behalf of alexprudhomme November 19, 2025 15:32
@alexprudhomme
Copy link
Contributor

@copilot Add straight forward minimalist golden path e2e tests. Thanks

Copy link
Contributor Author

Copilot AI commented Nov 19, 2025

@copilot Add straight forward minimalist golden path e2e tests. Thanks

Added minimalist golden path E2E tests in commit a163594. The tests cover:

  • Rendering automatic facet with label
  • Displaying facet values
  • Selecting facet values
  • Clearing selected values

Files created:

  • e2e/page-object.ts - Page object model with locators
  • e2e/fixture.ts - Test fixture
  • e2e/atomic-automatic-facet.e2e.ts - 4 golden path test cases

Copilot finished work on behalf of alexprudhomme November 19, 2025 16:28
@alexprudhomme alexprudhomme changed the title feat(atomic): migrate atomic-automatic-facet to Lit chore(atomic): migrate atomic-automatic-facet to Lit Nov 19, 2025
Copy link
Contributor

@fbeaudoincoveo fbeaudoincoveo left a comment

Choose a reason for hiding this comment

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

I honestly have nothing to

- Group clear-button and clear-button-icon tests under 'when values are selected' describe block
- Remove duplicate 'should show clear button when values are selected' test (was duplicating shadow parts test)

Co-authored-by: alexprudhomme <[email protected]>
@alexprudhomme alexprudhomme added this pull request to the merge queue Nov 24, 2025
Merged via the queue into main with commit 7918ede Nov 24, 2025
93 checks passed
@alexprudhomme alexprudhomme deleted the copilot/migrate-atomic-automatic-facet branch November 24, 2025 13:08
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.

Migrate atomic-automatic-facet

4 participants