Usé popperJS para agregar un cuadro emergente cuando el usuario se enfoca en el campo de contraseña. Esta es una personalización de página de Azure AD B2C. Puedo ver que el elemento del cuadro está allí, pero no se muestra. Cualquier ayuda es muy apreciada, ¡gracias!
Puedo ver que el cuadro emergente está en la página
if (window.jQuery) { (function ($) { $(document).ready(function () { const passwordField = document.querySelector('input[id=newPassword]'); passwordField.removeAttribute('title'); passwordField.addEventListener('focus', () => { $('#newPassword').popover({ trigger: 'focus', container: 'body', html: true, content: '<p>And here some amazing content. It is very engaging. Right?</p><p>TEST Test</p><p>TEST Test</p><p>TEST Test</p>', placement: 'right' }); }); }); }(window.jQuery)); } <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.11.2/umd/popper.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/js/bootstrap.min.js"></script> <input id="newPassword" class="textInput" type="password" placeholder="New Password" aria-label="New Password" aria-required="true">El problema estaba en la versión de bootstrap.min.js. El tema de Azure AD B2C usa bootstrap.min.css versión 3.3.5 y no funciona con bootstrap.min.js de una versión superior. Esto dio como resultado que la clase .fade no funcionara correctamente y la opacidad se estableciera en 0.
Verifique el HTML personalizado de su tema Azure AD B2C y asegúrese de que no haya fallas en las versiones de los recursos de arranque.