Scroll bar is not working when we use it in a modal popup

[vishvanathaa]

When we used it inside modal popup, The auto complete list disappears when we try to scroll bar using mouse.

[dustintenney]

Same issue any luck finding a fix for this?

[sundlee]

Even though it is late, I am writing a workaround for the issue.

'onMouseDown' will check if cursor position is on scroll bar when 'mousedown' event is detected. If cursor position is on scroll bar, the modal popup will not be hidden by v-show with 'isFocused' variable.

Good luck with this!

---

data() {
return {
...
isClickedScrollbar: false,
};
},

methods: {
...
runFocusOut(tgt) {
setTimeout(() => {
if ((tgt && tgt.classList.contains('vbst-item'))) {
return;
}
if (this.isClickedScrollbar === true) {
this.isClickedScrollbar = false;
return;
}
this.isFocused = false;
}, 100);
},

onMouseDown(e) {
  if (e.offsetX > e.target.clientWidth || e.offsetY > e.target.clientHeight) {
    this.isClickedScrollbar = true;
  } else {
    this.isClickedScrollbar = false;
  }
},

},

mounted() {
...
window.addEventListener('mousedown', this.onMouseDown);
}