Pressing Escape is one of the most familiar keyboard interactions in a web application. It should dismiss the active dropdown, close a dialog, or cancel the current interaction.

But what happens when an input component prevents that keyboard event from reaching the modal that contains it?

That was the problem in GitLab UI's GlTokenSelector when used inside GlModal . Pressing Escape while the input had focus could fail to close the modal because the component stopped keyboard event propagation unconditionally.

In Pajamas MR !6678 , addressing work item #3762 , I fixed this behavior while preserving the expected two-step Escape interaction.

The Problem: Escape Never Reached the Modal

The issue was in:

packages/gitlab-ui/src/components/base/token_selector/token_selector.vue

The input used Vue's .stop event modifier:

@keydown.stop="$emit('keydown', $event)"

Enter fullscreen mode

Exit fullscreen mode

Vue's .stop modifier calls event.stopPropagation() for every keydown event.

That means the component…