Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Combobox: Pressing Escape in while focusing a Combobox inside a Modal will close the Modal #3053

Conversation

it-vegard
Copy link
Contributor

Description

If pressing Escape in a Combobox inside of a Modal, the Modal would close.
Combobox should instead swallow the keydown event, so it does not close the Modal.
NB! This fix only swallows the event if FilteredOptions is open.

Fixes #3052

Change summary

Suppress keydown event when pressing Escape key while Combobox.FilteredOptions is open

For discussion:

I don't have any tests yet, because I couldn't get them to fail pre-fix.

Turns out Storybook/Testing Library userEvent.keyboard("{Escape}") does not cause the Modal to close, while doing the same manually (even in Storybook) will cause the error. Found references to the same here, and a potential fix here, but then the fix wouldn't work in the test (but it worked in real-life).

Do we need tests for this?

Copy link

changeset-bot bot commented Jul 26, 2024

🦋 Changeset detected

Latest commit: fb19ffb

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 7 packages
Name Type
@navikt/ds-react Patch
@navikt/ds-css Patch
@navikt/ds-tokens Patch
@navikt/ds-tailwind Patch
@navikt/aksel-icons Patch
@navikt/aksel Patch
@navikt/aksel-stylelint Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Contributor

github-actions bot commented Jul 26, 2024

Storybook demo

d38ccbede | 87 komponenter | 133 stories

@HalvorHaugan
Copy link
Contributor

I think we can live without a test, but would be nice with a story.

@it-vegard it-vegard changed the title bugfix: Pressing Escape in open Combobox inside a Modal will close the Modal Combobox: Pressing Escape in while focusing a Combobox inside a Modal will close the Modal Aug 1, 2024
it-vegard and others added 2 commits August 2, 2024 11:24
Co-authored-by: Halvor Haugan <83693529+HalvorHaugan@users.noreply.github.com>
…e a value (which will be cleared).

Also co-located all the Escape-handling in keyDown. This also better mimics Select's native behaviour.
HalvorHaugan
HalvorHaugan previously approved these changes Aug 2, 2024
…ombobox-with-escape

# Conflicts:
#	@navikt/core/react/src/form/combobox/Input/Input.tsx
#	@navikt/core/react/src/form/combobox/combobox.stories.tsx
@it-vegard it-vegard merged commit 18d20aa into main Aug 2, 2024
4 checks passed
@it-vegard it-vegard deleted the bugfix/stop-closing-modal-too-when-closing-combobox-with-escape branch August 2, 2024 11:30
@github-actions github-actions bot mentioned this pull request Aug 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[BUG] Combobox i modal: Escape for å lukke dropdown lukker hele modalen
2 participants