Skip to content

Test databases sidebar tree interactions (nav / expand / context menus) #1490

Description

@dawsontoth

Follow-up from the review of #1471 (databases tab tree-nav redesign). Reviewers @kriszyp and @DavidCockerill noted the tree interaction logic isn't covered by tests — the tree builder (buildItems.test.ts) is, but the click/expand/context-menu wiring is not.

Files under test

  • src/features/instance/databases/components/DatabasesTree/index.tsxDatabasesTree (react-complex-tree ControlledTreeEnvironment)
  • src/features/instance/databases/components/DatabasesTree/DatabaseTreeContextMenu.tsx
  • src/features/instance/databases/components/TableContextMenuItems.tsx

Behaviors to lock in

  • Single-click a table navigates to it; single-click a database navigates to its overview (/databases/<db>); clicking the synthetic "Create a Table" row fires setWatchedValue('ShowCreateTable', { databaseName: <focused db> }). Mode is DoubleClickItemToExpand, so double-click / the chevron expands a database without navigating.
  • Right-click a database → Create a Table + Drop Database; right-click a table → Add Record(s) / Import Data / Export CSV / Drop Table (Drop Table hidden when it's the last table in the DB) — each firing the correct target-carrying watched value (see src/lib/storage/watchedValueKeys.ts).
  • An already-open context menu re-anchors on a second right-click (content is keyed by cursor position).

Notes

  • Follow the repo's Radix-in-jsdom conventions in CLAUDE.md ("Testing Radix menus in jsdom") and mirror src/features/instance/databases/components/PickColumnsDropdown.test.tsx (no @testing-library/user-event; use fireEvent, /** @vitest-environment jsdom */, pointer-event polyfills).
  • Provide a TanStack Router context (useNavigate/useParams) + QueryClient, and mock the permission hooks. ⚠️ Importing usePermissions pulls in the auth store (touches localStorage), so prefer jsdom env and/or mock it.
  • Assert watched-value fires via a useListener subscription spy on the events bus (src/lib/events/watcher.ts).

Verify with npx vitest run src/features/instance/databases, npx tsc -b, npx oxlint.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions