Add search operator autocomplete dropdown (#2828)#2843
Open
bendichter wants to merge 7 commits into
Open
Conversation
Surface the available GitHub-style search operators (species:, approach:, created_after:, etc.) in a dropdown beneath the search field to make them discoverable, as requested in #2828. - Suggestions are derived from the existing operatorHelp list, so the help table and the dropdown stay in sync. - Filters by substring as the user types the operator token; matches the token under the cursor, so operators work mid-query too. - Keyboard support: up/down to move, Enter/Tab to insert the highlighted operator, Esc to dismiss. When browsing the full list (empty token) nothing is highlighted, so Enter still submits the search. - The list is teleported to <body> and positioned manually so the toolbar's overflow:hidden doesn't clip it; focus stays in the input. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Member
Author
Display the example value (e.g. the 2024-01-01 date format for date operators) as a muted hint after each operator key, so users can see the expected value format. Derived from the same operatorHelp examples. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Member
|
I think it begs for at least some basic tests added to e2e or frontend alone. Note -- update to |
Cover the operator dropdown end-to-end on the home page search field: full list on focus, filtering as you type, insertion via Enter/click, mid-query insertion on the token under the cursor, Escape-to-dismiss, and Enter-submits-while-browsing. Also update the existing dandisets-page search test to target the field by its combobox role, since the search input now exposes role="combobox". Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The Playwright E2E job runs the API via `manage.py runserver`, which spawns a
thread per request. With the inherited CONN_MAX_AGE of 10 minutes, each thread
holds its Postgres connection for the whole run, so the connection count grows
with the number of requests. Past Postgres's default max_connections (100) the
server starts returning 500s ("sorry, too many clients already"), which surfaced
as flaky/failed E2E tests once the suite grew.
Make CONN_MAX_AGE overridable in development settings (default unchanged, so
local dev and production are unaffected) and set DJANGO_CONN_MAX_AGE=0 for the
E2E job so connections close per-request and the count stays bounded regardless
of test count.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Vuetify renders role="combobox" on the search field's wrapper element, but the
inner <input> still exposes the implicit textbox role with the placeholder as
its accessible name. `getByRole('combobox', { name: 'Search Dandisets' })`
therefore never matched (the combobox wrapper has no accessible name), so the
dandisets-page search test timed out. Revert to matching the textbox, which is
what the field actually exposes.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
`performSearch` short-circuited whenever `searchText` equaled the route's `search` param (normalized with `|| ''`). On a dandiset landing page or the home page the param is absent, so an empty Enter — which previously navigated to the search results page (listing all dandisets) — became a no-op. This regressed the `dandisetsPage` E2E test, which relies on that navigation to reach the results page before toggling filters. Restructure so that searching from anywhere other than the search page always navigates there (empty query allowed), and only apply the unchanged-query no-op guard when already on the search page. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.


Summary
Closes #2828.
The search bar supports GitHub-style operators (
species:,approach:,created_after:, etc.), but they weren't discoverable — a user had no way to know they exist or which are available.This adds an autocomplete dropdown beneath the search field that lists the operators and filters them as you type, similar to github.com/issues.
Behavior
spe) narrows to matching operators (species:), matched against the token under the cursor — so operators work mid-query too (neuropixels spe…).Implementation notes
DandisetSearchField.vue(the search field actually in use). Suggestions are derived from the existingoperatorHelparray, so the help-icon table and the dropdown share a single source of truth.<body>and positioned manually beneath the input, because the toolbar usesoverflow: hiddenand would otherwise clip it; it tracks scroll/resize. Focus stays in the input (list items usemousedown.prevent) so keyboard interaction is uninterrupted.Notes
masterand live on the sandbox API; this is a frontend-only change.🤖 Generated with Claude Code