feat: open filter dropdowns upwards when there is no room below (#361)

[timdegroot1996]

Fixes #361

Problem

The checkbox dropdowns in the filter modal (Filter Profiles, Run Tags, Versions, custom filters like Pipeline/Release) and the settings modal (hidden custom filters) always opened below their select with a fixed max-height: 50vh. Opening one near the bottom of the modal stretched the modal, added a scrollbar and made the page jump.

Root cause

The .filterCheckBoxes panels are custom absolute-positioned elements (not Bootstrap dropdowns, so no Popper flip). Nothing checked the available viewport space when a panel opened.

Fix

• New shared helper set_filter_dropdown_visible(select, panel, visible) in js/filter/controls.js. When a panel opens it measures the viewport space below and above the select:
  • opens below when the content (capped at 50vh) fits there;
  • otherwise opens above (.drop-up) when there is more room above;
  • caps the height to the space on the chosen side (minimum 120px). Long lists keep scrolling inside the panel with the search box pinned.
• The placement decision is a pure function, get_filter_dropdown_placement.
• CSS: the select + panel wrapper is the positioning anchor. .drop-up uses bottom: 100%, so an upward panel stays attached to its select and shrinks towards it while searching.
• The five duplicated open/close handlers (filter_modal.js ×3, modal_options.js, settings_modal.js) now use the helper.

Also included: scripts/example.py --test (and scripts\example.bat --test) builds the example dashboard in the repo root without overwriting the committed example/ files, useful for checking a change by eye. Documented in CLAUDE.md, CONTRIBUTING.md and the dev-workflow skill.

Tests

• New JS unit test tests/javascript/filter_dropdown.test.js covers the placement decision: fits below, flips up, stays down, caps at the space above, very long lists, minimum height. JS suite: 18 files, 358 tests passed.
• Checked by hand in headless Chromium at 1312×883 against the example dashboard:
  • Run Tags, Versions and Filter Profiles open down.
  • Pipeline and Release open up, and the modal scrollHeight stays the same (no new scrollbar).
  • Searching shrinks an upward panel towards its select.
  • Clicking inside a panel keeps it open; clicking outside closes it.
  • The settings-modal dropdowns still work.
  • No console errors.
• No robot test (agreed with the maintainer).

🤖 Generated with Claude Code