Why is the client-side validation triggered on every keypress when using the self asserted AD B2C page layout?

Patrick van Kleef 0 Reputation points
2023-05-15T13:58:08.6833333+00:00

When using the selfasserted (2.1.20) page layout the clientside validation is triggered on every key press. It seems that the setting window.SETTINGS.inputVerificationDelayTimeInMilliseconds is not used?

If I inspect the source code there is only a delay of 50ms?

                    validateData: function(n) {
                        if (n = n || "",
                        n)
                            setTimeout(function() {
                                i.validateDataAsync(n)
                            }, 50);
                        else
                            return i.validateDataAsync()
                    },	

The source code (https://login.woodgrovedemo.com/) looks different probably because an older version of the selfasserted is used?

                    validateInputWithDelay: function(n) {
                        var u = $(n)
                          , r = u.siblings("#api .error.itemLevel");
                        r !== null && r.html("");
                        clearTimeout(this._timeout);
                        this._timeout = setTimeout(function() {
                            i.isClaimValueValid(r, u.attr("id")) ? i.hideInlineError(r, u) : i.showInlineError(r, u)
                        }, t.config.inputVerificationDelayTimeInMilliseconds)
                    },

Is the delay intentionally removed? If yes, how can I implement a delay myself? Currently, when a user start typing an email address it shows an error message immediately (on the first letter).

enter image description here

Microsoft Entra External ID
Microsoft Entra External ID
A modern identity solution for securing access to customer, citizen and partner-facing apps and services. It is the converged platform of Azure AD External Identities B2B and B2C. Replaces Azure Active Directory External Identities.
2,703 questions
Microsoft Entra ID
Microsoft Entra ID
A Microsoft Entra identity service that provides identity management and access control capabilities. Replaces Azure Active Directory.
20,092 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Shweta Mathur 28,691 Reputation points Microsoft Employee
    2023-05-17T07:58:31.41+00:00

    Hi @Patrick van Kleef ,

    Thanks for reaching out.

    Yes, this is expected behavior and has been introduced in 2.1.17 page layout version.

    User's image

    Enabling JavaScript in Azure AD B2C page enhances the UI experience. However, it is not recommended to update window.SETTINGS, window.CONTENT objects.

    As window.Settings is not storing objects in this version. You can add delay to this to introduce the delay.

    Reference: https://learn.microsoft.com/en-us/azure/active-directory-b2c/javascript-and-page-layout?pivots=b2c-user-flow

    Hope this will help.

    Thanks,

    Shweta

    Please remember to "Accept Answer" if answer helped you.