fix(dropdown-select): don't steal focus outline when dropdown is closed

[er-asm]

Problem

When scale-dropdown-select was initialized with a pre-selected value that was not the first item (e.g. value="cedric" with caspar being first), the steal-focus CSS part was incorrectly applied to the wrapper element on load. This suppressed the focus outline (outline: var(--focus-outline)) when the user tabbed to the combobox, breaking keyboard accessibility.

Fixes #2428

Root cause

currentIndex was being set whenever the value prop changed (including on initial render via @Watch('value')). In getBasePartMap(), currentIndex > -1 adds the steal-focus part, which CSS uses to suppress the focus outline. Since currentIndex equalled the index of the pre-selected item while the dropdown was closed, the outline was always suppressed.

Solution

• currentIndex is no longer set when value changes via @Watch while the dropdown is closed
• setOpen(true) initializes currentIndex to the selected item's index (correct starting point for keyboard navigation)
• setOpen(false) resets currentIndex to -1 (removing steal-focus when closed)
• connectedCallback() intentionally left without setting currentIndex

Changes

• packages/components/src/components/dropdown-select/dropdown-select.tsx — fix logic
• packages/components/src/components/dropdown-select/dropdown-select.spec.ts — 3 new unit tests covering issue scale-dropdown-select: no outline on focus #2428
• packages/visual-tests/src/dropdown-select.visual.spec.js — un-skipped visual test suite
• packages/visual-tests/src/__image_snapshots__/dropdown-select-* — 16 new visual snapshots (light/dark × standard/disabled/error)
• packages/visual-tests/setup.js — fix Express server to bind on 0.0.0.0 so Docker container can reach storybook

Testing

• Unit tests: all passing (yarn workspace @telekom/scale-components test --spec)
• Visual tests: 8 passed, 16 snapshots written (yarn workspace @telekom/scale-visual-tests jest --forceExit -u)

cc @maomaoZH @amir-ba

[Copilot]

Pull request overview

Fixes an accessibility regression in scale-dropdown-select where the steal-focus CSS part was applied on initial render for pre-selected (non-first) values, suppressing the visible focus outline when tabbing to the combobox (issue #2428).

Changes:

• Stop deriving currentIndex from value changes on initial render / while closed; manage currentIndex via setOpen() and interaction handlers instead.
• Add unit tests asserting steal-focus is not present while the dropdown is closed, regardless of the initially selected item.
• Re-enable dropdown-select visual tests and update visual-test infrastructure to bind the Storybook server to 0.0.0.0 (Docker reachability), with new snapshot baselines.

Reviewed changes

Copilot reviewed 4 out of 20 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
packages/components/src/components/dropdown-select/dropdown-select.tsx	Adjusts currentIndex lifecycle so steal-focus is not applied while closed; initializes index on open and resets on close.
packages/components/src/components/dropdown-select/dropdown-select.spec.ts	Adds unit tests covering the missing-outline regression by asserting steal-focus is absent while closed.
packages/visual-tests/src/dropdown-select.visual.spec.js	Un-skips the dropdown-select visual test suite.
packages/visual-tests/setup.js	Ensures the visual-test Storybook server binds to 0.0.0.0 for Docker access and awaits server readiness.
packages/visual-tests/src/image_snapshots/dropdown-select-*.png	Adds/updates snapshot baselines for the re-enabled visual tests across themes and states.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.