Tengo un div fade html que quiero hacer algo cuando un usuario hace clic fuera del div y lo cierra, o hace clic en el botón de descartar en el mismo div .

Puedo disparar fácilmente un EventListener para el botón de dismiss , pero ¿hay alguna manera de manejar el usuario que descarta el div haciendo clic fuera de él?

Nota: El diseño actual es el div que se cierra si el usuario hace clic fuera de él.

 <div class="modal fade" id="show_laptop_instructions" tabindex="-1" role="dialog" aria-labelledby="show_laptop_instructions_title" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered" style="max-width: fit-content" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modal_title" style="font-size: large">Laptop Instructions for <strong><span style="color: green;" id="msg_hostname"></span></strong></h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body"> <div class=container> <details open> <summary ><strong>Instructions</strong></summary> <div id="msg_instructions"></div> </details> </div> </div> <div class="modal-footer"> <button type="button" id="dismiss_laptop_instructions" class="btn btn-secondary" data-dismiss="modal">Dismiss</button> </div> </div> </div> </div>