From 6785c08961cd5256834bc6b997efbbea30700d20 Mon Sep 17 00:00:00 2001 From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com> Date: Fri, 16 Oct 2026 00:09:21 +0200 Subject: [PATCH] fix(ui): add close() to table dropdown so options do not call window.close() Closes #11869 --- .../views/components/table/dropdown.blade.php | 5 +- tests/v4/Browser/TableDropdownCloseTest.php | 50 +++++++++++++++++++ 2 files changed, 54 insertions(+), 1 deletion(-) create mode 100644 tests/v4/Browser/TableDropdownCloseTest.php diff --git a/resources/views/components/table/dropdown.blade.php b/resources/views/components/table/dropdown.blade.php index e6bc1518f5..d3c9f3a453 100644 --- a/resources/views/components/table/dropdown.blade.php +++ b/resources/views/components/table/dropdown.blade.php @@ -17,6 +17,9 @@ this.open = true; this.$nextTick(() => this.updatePosition()); }, + close() { + this.open = false; + }, updatePosition() { const trigger = this.$refs.trigger.getBoundingClientRect(); const panel = this.$refs.panel.getBoundingClientRect(); @@ -29,7 +32,7 @@ this.panelStyle = `position: fixed; left: ${left}px; top: ${top}px; min-width: 0;`; } -}" @click.outside="open = false" @keydown.escape.window="open = false" +}" @click.outside="close()" @keydown.escape.window="close()" x-on:resize.window="if (open) updatePosition()" x-on:scroll.window="if (open) updatePosition()">
{{ $trigger }} diff --git a/tests/v4/Browser/TableDropdownCloseTest.php b/tests/v4/Browser/TableDropdownCloseTest.php new file mode 100644 index 0000000000..35a10122ba --- /dev/null +++ b/tests/v4/Browser/TableDropdownCloseTest.php @@ -0,0 +1,50 @@ +fill('email', 'test@example.com') + ->fill('password', 'password') + ->click('Login') + ->assertSee('Dashboard') + ->navigate(route('project.resource.create', [ + 'project_uuid' => $stack['project']->uuid, + 'environment_uuid' => $stack['environment']->uuid, + ])) + ->assertSee('Filter'); + + $page->script(<<<'JS' + () => { + window.__windowCloseCalls = 0; + window.close = () => window.__windowCloseCalls++; + [...document.querySelectorAll('button')].find(button => button.textContent.trim() === 'Filter').click(); + } + JS); + $page->wait(0.5); + + $page->script(<<<'JS' + () => [...document.querySelectorAll('[role="option"]')] + .find(option => option.textContent.trim() === 'Applications') + .click() + JS); + $page->wait(0.5); + + $state = $page->script(<<<'JS' + () => { + const trigger = [...document.querySelectorAll('button')].find(button => button.textContent.trim() === 'Filter'); + + return { + windowCloseCalls: window.__windowCloseCalls, + open: Alpine.$data(trigger.closest('[x-data]')).open, + }; + } + JS); + + expect($state)->toBe(['windowCloseCalls' => 0, 'open' => false]); + $page->screenshot(filename: 'table-dropdown-close'); +});