fix: updated tab bar behavior (#42875)

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Fix: remove tab auto completion in favor of tab handlers
This commit is contained in:
Ali Waseem authored and GitHub committed 2026-02-17 17:05:35 +00:00
1 parent e97b067a94
commit c558c5d22e
3 files changed
+22 -19

No files matched your search

+19 -18
View File
@@ -149,8 +149,8 @@ test.describe('Filter Bar', () => {
}
})
test('Tab selects column from dropdown', async ({ page, ref }) => {
const tableName = `${tableNamePrefix}_tab_col`
test('Tab exits filter bar to next DOM element', async ({ page, ref }) => {
const tableName = `${tableNamePrefix}_tab_exit`
const columnName = 'name'
await createTable(tableName, columnName, [{ name: 'Alice' }])
@@ -159,14 +159,16 @@ test.describe('Filter Bar', () => {
await setupFilterBarPage(page, ref, toUrl(`/project/${ref}/editor?schema=public`))
await navigateToTable(page, ref, tableName)
await addFilter(page, ref, columnName, '=', 'Alice')
const freeformInput = getFilterBarInput(page)
await freeformInput.click()
await freeformInput.fill(columnName)
await expect(page.getByTestId(`filter-menu-item-${columnName}`)).toBeVisible()
await expect(freeformInput).toBeFocused()
// Tab should exit the filter bar (freeform input should lose focus)
await page.keyboard.press('Tab')
await expect(page.getByTestId(`filter-condition-${columnName}`)).toBeVisible()
await expect(freeformInput).not.toBeFocused()
} finally {
await dropTable(tableName)
}
@@ -784,27 +786,26 @@ test.describe('Filter Bar', () => {
}
})
test('Tab selects dropdown value option', async ({ page, ref }) => {
const tableName = `${tableNamePrefix}_kb_tab`
test('Shift+Tab exits filter bar to previous DOM element', async ({ page, ref }) => {
const tableName = `${tableNamePrefix}_shifttab_exit`
const columnName = 'name'
await query(
`CREATE TABLE IF NOT EXISTS ${tableName} (
id bigint generated by default as identity primary key,
is_active boolean
)`
)
await query(`INSERT INTO ${tableName} (is_active) VALUES (true), (false)`)
await createTable(tableName, columnName, [{ name: 'Alice' }])
try {
await setupFilterBarPage(page, ref, toUrl(`/project/${ref}/editor?schema=public`))
await navigateToTable(page, ref, tableName)
await selectColumnFilter(page, 'is_active')
await selectOperator(page, 'is_active', '=')
await addFilter(page, ref, columnName, '=', 'Alice')
await page.keyboard.press('Tab')
const freeformInput = getFilterBarInput(page)
await freeformInput.click()
await expect(freeformInput).toBeFocused()
await expect(page.getByTestId('filter-condition-is_active')).toBeVisible()
// Shift+Tab should exit the filter bar (freeform input should lose focus)
await page.keyboard.press('Shift+Tab')
await expect(freeformInput).not.toBeFocused()
} finally {
await dropTable(tableName)
}