fix(schema-diff): keep compare action reachable

This commit is contained in:
jearhe
2026-08-19 15:08:42 +08:00
committed by GitHub
parent ca8f6cd967
commit e9ca697c3b
2 changed files with 20 additions and 1 deletions
@@ -870,10 +870,16 @@ const targetConnectionInfo = computed(() => {
</DialogTitle>
</DialogHeader>
<div class="flex-1 min-h-0 overflow-hidden flex flex-col">
<!-- Result step relies on splitpanes to manage its own scroll/heights, so it keeps
`overflow-hidden`; the config step's tall content (e.g. the table multi-select
added in the "compare specific tables" feature) can overflow a fixed-height
dialog, so it must be allowed to scroll vertically instead of being clipped --
otherwise the Compare button at the bottom becomes unreachable. -->
<div :class="[step === 'result' ? 'overflow-hidden' : 'overflow-y-auto', 'flex-1 min-h-0 flex flex-col']">
<!-- Config Step -->
<SchemaDiffConfigStep
v-if="step === 'config'"
class="shrink-0"
v-model:source-connection-id="sourceConnectionId"
v-model:source-database="sourceDatabase"
v-model:source-schema="sourceSchema"
@@ -26,4 +26,17 @@ describe("SchemaDiffDialog fullscreen layout", () => {
it("lets the deploy confirm dialog body shrink so a long destructive statement can't push the footer buttons off-screen", () => {
expect(dialogSource).toContain('<div class="py-2 space-y-3 min-w-0">');
});
it("lets the config step scroll vertically so the Compare button stays reachable when 'compare specific tables' is enabled", () => {
// Regression for #6627: the "compare specific tables" feature (#6533/#6540) grows the
// config step (table multi-select + same-name match). Under a fixed-height dialog that
// step used to be clipped (`overflow-hidden`), pushing the Compare button below the
// visible area with no way to scroll to it. The container must scroll on all steps
// except the result step, which relies on splitpanes to manage its own height.
expect(dialogSource).toContain("step === 'result' ? 'overflow-hidden' : 'overflow-y-auto'");
// The config step must not be flex-shrunk (which would swallow its height and suppress
// the scrollbar); only then does the taller-than-dialog content actually overflow and
// become reachable via scrolling.
expect(dialogSource).toMatch(/<SchemaDiffConfigStep\n[\s\S]*?class="shrink-0"/);
});
});