Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Pressing the escape key closing a <BModal> does not emit an update to v-model value.

See original GitHub issue

Hey community I hope you are all well.

I just realized, that when showing a <BModal> and closing the modal with the escape key, the modal’s v-model binding is not updated, leading to issues when wanting to reshow the modal.

See for a reproduction of this issue.

This issue has the same systemic root cause as #657, as bootstrap-vue-3’s events are quite detached from bootstrap’s events. This might or should raise concern, whether it is really manageable to predict and cover these often unapparent corner cases, or whether there should be another strategy, such as #658.

Best regards Markus

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

VividLemoncommented, Sep 16, 2022

Just another perspective: There might be a valid UX-Unit-Test in the future to just these corner-cases (Escape, Aria, Back key (?)).

Due to the teleport in BModal, I was having issues when targeting the component when component testing. As such, BModal is not currently covered by tests. Eventually it will contain tests for all of those.

Atokuluscommented, Sep 16, 2022

Dear @devhus and @VividLemon I can totally support this side as well, as it gets much more clear for the developer to read bootstrap-vue-3’s code, so in the end it does not really matter to me.

Please just consider there are currently and in the future many more UX concepts e.g. for impaired people, and bootstrap seems to handle them quite well. It can get frustrating quite fast to keep up with these changes 😉

Best regards and many thanks for your insights 😀 Markus

Read more comments on GitHub >

github_iconTop Results From Across the Web

Disabling the escape key handler #761 - euvl/vue-js-modal
Problem: Looking for a way to be able to disable the escape key handler while maintaining the ability to click to close. Right...
Read more >
Close dialog when ESC key is pressed - vue.js - Stack Overflow
This only works, if you have selected anything inside the modal. If there is no selection, the event will be triggered on the...
Read more >
Modal | Components - BootstrapVue
preventDefault() method of the event object passed to your ok (OK button), cancel (Cancel button), close (modal header close button) and hide event...
Read more >
Cancel a React Modal with Escape Key or External Click
How do you cancel a React modal with an escape key or external click? Thanks to a few handy hooks, it's easier than...
Read more >
Modal | Components | BootstrapVue
<b-modal> supports close on ESC (enabled by default), close on backdrop click (enabled by default), and the X close button in the header...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found