github/dbx
4
0
Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-10-19 16:16:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(desktop): avoid blank area after connection dialog closes

Browse Source
This commit is contained in:
zipg
2026-07-30 00:07:07 +08:00
committed by GitHub
parent f80fdcdfa7
commit eafc497563
4 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/desktop/src/components/editor/QueryEditor.vue
+1 -2
View File
@@ -3400,7 +3400,7 @@ onMounted(async () => {
})();
const [
{ EditorView, keymap, rectangularSelection, hoverTooltip, showTooltip, closeHoverTooltips, Decoration, tooltips, gutter, GutterMarker, lineNumberMarkers, lineNumbers, highlightActiveLineGutter, highlightSpecialChars, drawSelection, dropCursor, crosshairCursor, scrollPastEnd, ViewPlugin },
{ EditorView, keymap, rectangularSelection, hoverTooltip, showTooltip, closeHoverTooltips, Decoration, gutter, GutterMarker, lineNumberMarkers, lineNumbers, highlightActiveLineGutter, highlightSpecialChars, drawSelection, dropCursor, crosshairCursor, scrollPastEnd, ViewPlugin },
{ EditorState, EditorSelection, Compartment, Prec, RangeSet, StateEffect, StateField },
langSql,
{ autocompletion, startCompletion, acceptCompletion, closeBrackets, closeBracketsKeymap, snippetCompletion, completionStatus, completionKeymap, insertCompletionText, nextSnippetField },
@@ -3855,7 +3855,6 @@ onMounted(async () => {
keymap.of([...defaultKeymap, ...searchKeymap, ...historyKeymap, ...foldKeymap, ...completionKeymap]),
sqlLanguageComp.of(buildSqlLanguageExtension()),
sqlSemanticHighlightComp.of(buildSqlSemanticHighlightExtension()),
tooltips({ parent: document.body }),
completionComp.of(buildSqlCompletionExtension()),
sqlCompletionTheme(EditorView),
codeMirrorTheme.of(theme),
apps/desktop/src/components/ui/dialog/DialogOverlay.vue
+1 -9
View File
@@ -26,16 +26,8 @@ async function startWindowDrag(event: PointerEvent) {
</script>
<template>
<DialogOverlay data-slot="dialog-overlay" v-bind="delegatedProps" :class="cn('dbx-dialog-overlay-backdrop data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 fixed inset-0 isolate z-50', props.class)">
<DialogOverlay data-slot="dialog-overlay" v-bind="delegatedProps" :class="cn('data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 fixed inset-0 isolate z-50', props.class)">
<div v-if="isDesktop" aria-hidden="true" class="fixed inset-x-0 top-0 h-10 pointer-events-auto" data-tauri-drag-region @pointerdown="startWindowDrag" />
<slot />
</DialogOverlay>
</template>
<style scoped>
.dbx-dialog-overlay-backdrop[data-state="open"],
.dbx-dialog-overlay-backdrop[data-open]:not([data-open="false"]) {
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
}
</style>
apps/desktop/src/lib/__tests__/editor/queryEditorTooltipParent.spec.ts
Vendored
+10
View File
@@ -0,0 +1,10 @@
import { readFileSync } from "node:fs";
import { describe, expect, it } from "vitest";
const queryEditorSource = readFileSync(new URL("../../../components/editor/QueryEditor.vue", import.meta.url), "utf8");
describe("QueryEditor tooltip container", () => {
it("keeps CodeMirror tooltips inside the editor instead of extending document.body", () => {
expect(queryEditorSource).not.toContain("tooltips({ parent: document.body })");
});
});
apps/desktop/src/styles/__tests__/legacyWebviewFallback.spec.ts
Vendored
+6
View File
@@ -4,6 +4,7 @@ import { describe, expect, it } from "vitest";
const globalsCss = readFileSync(new URL("../globals.css", import.meta.url), "utf8");
const dialogContentSource = readFileSync(new URL("../../components/ui/dialog/DialogContent.vue", import.meta.url), "utf8");
const dialogScrollContentSource = readFileSync(new URL("../../components/ui/dialog/DialogScrollContent.vue", import.meta.url), "utf8");
const dialogOverlaySource = readFileSync(new URL("../../components/ui/dialog/DialogOverlay.vue", import.meta.url), "utf8");
const connectionDialogSource = readFileSync(new URL("../../components/connection/ConnectionDialog.vue", import.meta.url), "utf8");
const desktopIndexSource = readFileSync(new URL("../../../index.html", import.meta.url), "utf8");
const connectionDialogLegacyCss = readFileSync(new URL("../../../public/connection-dialog-legacy.css", import.meta.url), "utf8");
@@ -43,6 +44,11 @@ describe("legacy WebView CSS fallbacks", () => {
expect(connectionDialogSource).toContain("max-height: calc(var(--dbx-viewport-height) - 2rem);");
});
it("avoids full-window backdrop filters that can blank WebKit after a dialog closes", () => {
expect(dialogOverlaySource).not.toContain("backdrop-filter");
expect(dialogOverlaySource).toContain("bg-black/10");
});
it("keeps legacy tab triggers connected to the configured corner style", () => {
const tabsTriggerRule = globalsCss.match(/\[data-slot="tabs-trigger"\] \{([\s\S]*?)\n \}/)?.[1];