Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
core/src/components/tabs/test/a11y/tab-button-dark-focused.e2e.ts
Outdated
Show resolved
Hide resolved
core/src/components/tabs/test/a11y/tab-button-dark-focused.e2e.ts
Outdated
Show resolved
Hide resolved
core/src/components/tabs/test/a11y/tab-button-dark-focused.e2e.ts
Outdated
Show resolved
Hide resolved
ShaneK
changed the title
ShaneK
left a comment
ShaneK
left a comment
There was a problem hiding this comment.
Nice improvements! A couple of new things
There was a problem hiding this comment.
Looks good to me! FWIW we typically include preview URLs in the PR description when possible. For yours, you used setContent, but there's other tests that can be used to test this interaction.
Here's yours:
https://ionic-framework-git-fw-6293-ionic1.vercel.app/src/components/tabs/test/basic?ionic:mode=ios&palette=dark
brandyscarney
left a comment
brandyscarney
left a comment
There was a problem hiding this comment.
Requesting some changes to the colors chosen!
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
There was a problem hiding this comment.
You will need to regenerate these.
There was a problem hiding this comment.
@brandyscarney Sorry, I thought the GAs would regenerate them. Can you please recheck it?
4 participants
Issue number: resolves resolves internal
What is the current behavior?
In the dark palette, the
--ion-tab-bar-background-focusedCSS token was not defined.When a
ion-tab-buttonreceives focus, the::afteroverlay on.button-nativefalls back toget-color-shade(#fff)→#e0e0e0— a light grey that blends into the dark background and makes the focus indicator invisible.What is the new behavior?
--ion-tab-bar-background-focusedis now defined in the dark palette:#252525for iOS and#353535for MD , providing a dark-appropriate focus indicator.The same token is added to
high-contrast-dark.scsswith the same values.tab-button/test/states/(where the existing focused-state tests live) usingconfigs({ palettes: ['dark'] })andpage.setContent()withclass="ion-focused"applied directly, matching the established pattern for focus-state testing in this component.Does this introduce a breaking change?
Other information
The test triggers keyboard mode (required by
focus-visible.ts) before focusing the inner<a>element inside the tab button's shadow DOM, since calling.focus()on the host element is a no-op withoutdelegatesFocus.