Passkey icons use wrong color variant when realm disables dark mode#51091
Conversation
There was a problem hiding this comment.
Pull request overview
Fixes passkey icon selection when dark mode is disabled for a realm.
Changes:
- Gates dark passkey icons on the realm’s dark-mode setting.
- Exposes
darkModethrough console environments. - Updates login and Account Console rendering.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
themes/.../webauthn-authenticate.ftl |
Gates the login passkey dark icon. |
js/libs/ui-shared/src/context/environment.ts |
Adds the optional environment setting. |
js/apps/admin-ui/.../index.ftl |
Exposes dark mode to Admin UI. |
js/apps/account-ui/src/account-security/SigningIn.tsx |
Gates Account Console dark icons. |
js/apps/account-ui/.../index.ftl |
Exposes dark mode to Account UI. |
Unreported flaky test detectedIf the flaky tests below are affected by the changes, please review and update the changes accordingly. Otherwise, a maintainer should report the flaky tests prior to merging the PR. org.keycloak.testsuite.forms.MultipleTabsLoginTest#multipleTabsParallelLoginTestWithAuthSessionExpiredAndRegisterClickKeycloak CI - Forms IT (chrome) org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#salesPostSigTestKeycloak CI - Adapter IT Strict Cookies org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#disabledClientTestKeycloak CI - Adapter IT Strict Cookies org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#idpInitiatedLoginTestKeycloak CI - Adapter IT Strict Cookies |
Closes keycloak#51087 Signed-off-by: Martin Bartoš <mabartos@redhat.com>
Unreported flaky test detectedIf the flaky tests below are affected by the changes, please review and update the changes accordingly. Otherwise, a maintainer should report the flaky tests prior to merging the PR. org.keycloak.testsuite.forms.MultipleTabsLoginTest#multipleTabsParallelLoginTestWithAuthSessionExpiredAndRegisterClickKeycloak CI - Forms IT (chrome) org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#salesPostSigTestKeycloak CI - Adapter IT Strict Cookies org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#disabledClientTestKeycloak CI - Adapter IT Strict Cookies org.keycloak.testsuite.adapter.servlet.SAMLServletAdapterTest#idpInitiatedLoginTestKeycloak CI - Adapter IT Strict Cookies |
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 6 out of 6 changed files in this pull request and generated 2 comments.
Comments suppressed due to low confidence (1)
js/apps/account-ui/src/account-security/SigningIn.tsx:136
- Extend the existing signing-in tests to cover both values of the injected
darkModeflag and assert whether this dark<source>is present. Without that regression coverage, the account-console half of #51087 can recur independently of the login template.
{context.environment.darkMode && iconDarkSrc && (
<source
srcSet={iconDarkSrc}
media="(prefers-color-scheme: dark)"
| /** The URL to be followed when the logo is clicked. */ | ||
| logoUrl: string; | ||
| /** Whether dark mode is enabled for the realm. */ | ||
| darkMode: boolean; |
There was a problem hiding this comment.
Hmm, I'm still thinking about this - whether to have it as required or optional. For the admin/account console, it should be fine to have it required as those versions should come up with the same version of the Keycloak server, so there should not be any problem.
Do we use this ui-shared environment even outside these scenarios? Like JS client?
@edewit WDYT? Or should we rather make it optional and be on the safe side? :P
There was a problem hiding this comment.
it's fine to have this as a required field, it only shows what fields are injected into the page
Unreported flaky test detectedIf the flaky tests below are affected by the changes, please review and update the changes accordingly. Otherwise, a maintainer should report the flaky tests prior to merging the PR. org.keycloak.testsuite.forms.MultipleTabsLoginTest#testLoginPageRefreshKeycloak CI - Forms IT (firefox) org.keycloak.testsuite.webauthn.passwordless.WebAuthnPwdLessPropertyTest#timeout |
Resolves the issue:
Screencast.From.2026-07-22.14-29-08.mp4
Screencast.From.2026-07-22.14-23-17.mp4
@edewit Could you please check it? I'd like to backport it to 26.7, and I mark the darkMode as required in the environment. I think it should be fine as users always uses the same server version and console versions, right?