Scrollbar click closes modal with long content

[IvanVasquez]

Prerequisites

• [X] I have searched for duplicate or closed issues
• [X] I have validated any HTML to avoid common problems
• [X] I have read the contributing guidelines

Describe the issue

Previously on v5.1 when a modal was open, I was able to scroll throw the content by clicking any part of the window scrollbar, now on 5.2 clicking the scrollbar closes automatically the modal.

I tested on bootstrap docs page just to be sure I wasn't doing anything different and the issue can be tested by opening the demo modal for long content and clicking the scrollbar.

Reduced test cases

v5.1 (scroll bar click works) https://getbootstrap.com/docs/5.1/components/modal/#scrolling-long-content

v5.2.0 (scroll bar click closes modal) https://getbootstrap.com/docs/5.2/components/modal/#scrolling-long-content

What operating system(s) are you seeing the problem on?

Windows

What browser(s) are you seeing the problem on?

Chrome, Firefox, Microsoft Edge

What version of Bootstrap are you using?

v5.2.0

[julien-deramond]

This issue seems to come from https://github.com/twbs/bootstrap/commit/d05c42a3979be30efc7a932c3c0f483098841b19.

[dgibbs64]

I can confirm this behaviour as well.

[plonknimbuzz]

temporary fix while waiting permanent bug fix:

edit bootstrap.js (v5.2.0) LINE 3008 https://github.com/twbs/bootstrap/blob/a685b9648bf14c853b9a417c7c68f95d93e1aabc/dist/js/bootstrap.js#L3008-L3011

before

if (event.target !== event.currentTarget) {
  // click is inside modal-dialog
  return;
}

after

if (event.target !== event.currentTarget) {
  // click is inside modal-dialog
  return;
}
if (event.offsetX > event.target.clientWidth || event.offsetY > event.target.clientHeight) 
{
      // click is on scrollbar
      return;
}

NOTE:

• maybe break some feature. Do at your own Risk!!
• if you are using popper bundle, just find similar line of code https://github.com/twbs/bootstrap/blob/a685b9648bf14c853b9a417c7c68f95d93e1aabc/dist/js/bootstrap.bundle.js#L4823-L4826