fix(dialog): apply CodeRabbit review suggestions

- VideoHelpDialog: call event.preventDefault() in escape handler so Reka does
  not auto-dismiss in parallel with the v-model close path
- Collapse :open + @update:open to v-model:open across migrated dialogs
- SecretFormDialog.test: reset captured handler via beforeEach
This commit is contained in:
dante01yoon
2026-05-12 15:23:19 +09:00
parent d30556f5c9
commit 9dcb9fac1a
4 changed files with 11 additions and 10 deletions

View File

@@ -1,9 +1,5 @@
<template>
<Dialog
:open="visible"
:modal="false"
@update:open="(open) => (visible = open)"
>
<Dialog v-model:open="visible" :modal="false">
<DialogPortal>
<DialogOverlay />
<DialogContent

View File

@@ -1,5 +1,5 @@
<template>
<Dialog :open="isVisible" @update:open="(open) => (isVisible = open)">
<Dialog v-model:open="isVisible">
<DialogPortal>
<DialogOverlay class="bg-black/70" />
<DialogContent
@@ -56,8 +56,10 @@ const { videoUrl, ariaLabel = 'Help video' } = defineProps<{
// The dialog mounts inside other dialogs (e.g. UploadModelFooter inside an
// asset modal). Reka's Escape handling bubbles to the parent dialog and would
// close it as well. Stop propagation so only this dialog closes.
// close it as well. Stop propagation so only this dialog closes, and prevent
// Reka's default auto-dismiss so the close path stays solely under the model.
function onEscapeKeyDown(event: KeyboardEvent) {
event.preventDefault()
event.stopPropagation()
isVisible.value = false
}

View File

@@ -1,5 +1,5 @@
import { render } from '@testing-library/vue'
import { describe, expect, it, vi } from 'vitest'
import { beforeEach, describe, expect, it, vi } from 'vitest'
import { defineComponent } from 'vue'
import { createI18n } from 'vue-i18n'
@@ -80,8 +80,11 @@ vi.mock('@/components/ui/dialog/DialogClose.vue', () => ({
const i18n = createI18n({ legacy: false, locale: 'en', messages: { en: {} } })
describe('SecretFormDialog', () => {
it('prevents backdrop pointer-down-outside from closing the dialog', () => {
beforeEach(() => {
capturedPointerDownOutside = null
})
it('prevents backdrop pointer-down-outside from closing the dialog', () => {
render(SecretFormDialog, {
global: { plugins: [i18n] },
props: { visible: true }

View File

@@ -1,5 +1,5 @@
<template>
<Dialog :open="visible" @update:open="(open) => (visible = open)">
<Dialog v-model:open="visible">
<DialogPortal>
<DialogOverlay />
<DialogContent