refactor(shell): a live sidebar drag leaves the docked inspector's width stale

オープン
#598 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
55/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
静か
技術スタック
typescript

調査の方向性

src/ui/app-shell.ts の dragCtx.apply 周辺と既存の inspector の reclamp ロジックから始め、次に src/ui/splitters.ts と既存のサイドバーのテストを確認します。まず関連するブラウザテストを実行し、inspector を開いたまま .col-resize をドラッグする場合のカバレッジを追加します。完了条件は、中央領域が CENTRE_MIN_PX を守り、保存された rightInspectorPx 設定が変更されず、一覧にあるすべての npm チェックが通ることです。

索引モデルが issue の本文から書いたものです。

説明

inbox refactor

Surfaced by ChatGPT review pass 2 of PR #596 (#586, phase 1 of #593), verified against the code.
Deliberately not fixed in #586 — see "Why deferred".

What

#586 made the docked inspector's displayed width dock-aware: its ceiling reserves
CENTRE_MIN_PX for the centre surface plus reservedPx = state.sidebarPx + 2 * HANDLE_PX
(src/ui/app-shell.ts:174). The re-clamp (app.dom.reclampInspectorWidth) runs at three moments:

  1. shell construction (app-shell.ts:252),
  2. inspector unfold (called from showInInspector),
  3. window resize.

A live left-sidebar drag is not one of them. dragCtx.apply (src/ui/app-shell.ts:182-186)
handles the 'col' axis by setting sidebar.style.width only:

apply: (axis, value) => {
  if (axis === 'col') sidebar.style.width = value + 'px';
  else if (axis === 'rightInspector') inspectorHost.style.width = value + 'px';
  else schemaPane.style.height = value + '%';
},

So while both panels are visible, widening the sidebar silently invalidates the reservation the
inspector's width was chosen against.

Reproduction

At a 1280px viewport:

  1. Open Cell, Rows or Reference and size the inspector to 600px (default sidebar 248px →
    reservedPx 262 → centre ≈ 418px).
  2. Drag .col-resize to the sidebar's maximum 420px (dragValue's clamp(ev.clientX, 180, 420),
    src/ui/splitters.ts:108) → reservedPx becomes 434.
  3. The inspector stays 600px, so the centre falls to ≈ 246px — below CENTRE_MIN_PX (320) — and
    stays there until an unrelated window resize or a fold/unfold happens to re-clamp it.

Why the existing tests miss it

Both new tests avoid the live transition:

  • the e2e sidebar test closes the inspector, changes the sidebar, then reopens it (so the unfold
    hook does the work);
  • the unit test changes state.sidebarPx while the inspector is folded.

Neither drags the sidebar while the inspector is open, which is the only path that exposes this.

Why deferred

It is a small, self-contained fix, but it shares a root cause with the centre-minimum policy
question (filed separately): both are about what the shell does when the row's three columns
cannot all keep their minima. Fixing the re-clamp alone would keep the centre at
CENTRE_MIN_PX only while that is feasible, so the two are best resolved together. It is also
not a regression — pre-#586 the surface was a position: fixed overlay that the sidebar's width
did not interact with at all.

Acceptance

  • The 'col' apply path re-clamps the displayed inspector width, without mutating the
    saved rightInspectorPx preference (the same displayed-vs-preferred split #586 established).
  • A real-browser test drags .col-resize while the inspector stays open and asserts the
    centre against CENTRE_MIN_PX. happy-dom evaluates no CSS layout, so a unit test cannot
    stand in for this.
  • npm test, npm run check:types, npm run check:arch, npm run build pass.
主要言語
TypeScript
スター
8
フォーク
2
平均マージ
1時間 34分
マージ済み PR(30日)
6

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

Altinity/altinity-sql-browser のほかの issue

Altinity/altinity-sql-browser の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。