libre.sh/keycloak-scim
2
0
Fork 0
Code Issues 14 Pull requests Releases Packages Activity Actions 6

Standardize error messages from client and server in login theme (keycloak.v2) (#34141)

Browse source 
Closes #34137

Signed-off-by: SebastEnn <103125747+SebastEnn@users.noreply.github.com>
This commit is contained in:
SebastEnn 2024-10-22 18:02:23 +02:00 committed by GitHub
parent f3af54e69d
commit e3936a9b38
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 32 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
themes/src/main/resources/theme/keycloak.v2/login/field.ftl
View file

@ -1,33 +1,32 @@
<#macro group name label error="" required=false> <#macro group name label error="" required=false>
<div class="${properties.kcFormGroupClass}"> <div class="${properties.kcFormGroupClass}">
<div class="${properties.kcFormGroupLabelClass}"> <div class="${properties.kcFormGroupLabelClass}">
<label for="${name}" class="${properties.kcFormGroupLabelClass}"> <label for="${name}" class="${properties.kcFormGroupLabelClass}">
<span class="${properties.kcFormGroupLabelTextClass}"> <span class="${properties.kcFormGroupLabelTextClass}">
${label} ${label}
</span> </span>
<#if required> <#if required>
<span class="${properties.kcInputRequiredClass}" aria-hidden="true">&#42;</span> <span class="${properties.kcInputRequiredClass}" aria-hidden="true">&#42;</span>
</#if> </#if>
</label> </label>
</div> </div>
<#nested> <#nested>
<div id="input-error-client-${name}"></div> <div id="input-error-container-${name}">
<#if error?has_content> <#if error?has_content>
<div class="${properties.kcFormHelperTextClass}" aria-live="polite"> <div class="${properties.kcFormHelperTextClass}" aria-live="polite">
<div class="${properties.kcInputHelperTextClass}"> <div class="${properties.kcInputHelperTextClass}">
<div <div class="${properties.kcInputHelperTextItemClass} ${properties.kcError}" id="input-error-${name}">
class="${properties.kcInputHelperTextItemClass} ${properties.kcError}" <span class="${properties.kcInputErrorMessageClass}">
id="input-error-${name}"> ${error}
<span class="${properties.kcInputErrorMessageClass}"> </span>
${error} </div>
</span> </div>
</div> </div>
</div> </#if>
</div> </div>
</#if>
</div> </div>
</#macro> </#macro>

16
themes/src/main/resources/theme/keycloak.v2/login/register.ftl
View file

@ -73,14 +73,16 @@
].filter(p => p.policy.value !== -1); ].filter(p => p.policy.value !== -1);
document.getElementById("password").addEventListener("change", (event) => { document.getElementById("password").addEventListener("change", (event) => {
const serverErrors = document.getElementById("input-error-password");
if (serverErrors) { const errorContainer = document.getElementById("input-error-container-password");
serverErrors.remove(); const template = document.querySelector("#errorTemplate").content.cloneNode(true);
const errors = validatePassword(event.target.value, activePolicies);
if (errors.length === 0) {
errorContainer.replaceChildren();
return;
} }
const template = document.querySelector("#errorTemplate").content.cloneNode(true);
const errors = validatePassword(event.target.value, activePolicies);
const errorList = template.querySelector("ul"); const errorList = template.querySelector("ul");
const htmlErrors = errors.forEach((e) => { const htmlErrors = errors.forEach((e) => {
const row = document.querySelector("#errorItemTemplate").content.cloneNode(true); const row = document.querySelector("#errorItemTemplate").content.cloneNode(true);
@ -88,7 +90,7 @@
li.textContent = e; li.textContent = e;
errorList.appendChild(li); errorList.appendChild(li);
}); });
document.getElementById("input-error-client-password").replaceChildren(template); errorContainer.replaceChildren(template);
}); });
</script> </script>
</#if> </#if>