Files
supabase/apps/studio/components/interfaces/QueryPerformance/useQueryPerformanceQuery.test.ts
Jordi Enric 2e1795dfa0 feat(studio): add pagination to query performance page FE-2774 (#43697)
## Problem

The Query Performance page loaded all results in a single query with a
fixed limit of 20 rows, giving users no way to browse beyond the first
page. There was also no way to control how many rows were shown at once.

## Fix

adds pagination 

## How to test

- Navigate to `/observability/query-performance` in Studio
- scroll to bottom
- should automatically load more results

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-23 15:27:43 +01:00

173 lines
5.7 KiB
TypeScript

import { describe, expect, it } from 'vitest'
import { generateQueryPerformanceSql } from './useQueryPerformanceQuery'
describe('generateQueryPerformanceSql', () => {
it('generates sql with no filters', () => {
const result = generateQueryPerformanceSql({ preset: 'mostFrequentlyInvoked' })
expect(result.sql).toBeDefined()
expect(result.whereSql).toBe('')
expect(result.orderBySql).toBeUndefined()
})
it('generates ORDER BY clause', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
orderBy: { column: 'calls', order: 'desc' },
})
expect(result.orderBySql).toBe('ORDER BY calls desc')
})
it('filters by roles', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
roles: ['postgres', 'anon'],
})
expect(result.whereSql).toContain("auth.rolname in ('postgres', 'anon')")
})
it('filters by search query', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
searchQuery: 'SELECT',
})
expect(result.whereSql).toContain("statements.query ~* 'SELECT'")
})
it('filters by dashboard source only', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
sources: ['dashboard'],
})
expect(result.whereSql).toContain("statements.query ~* 'source: dashboard'")
})
it('filters by non-dashboard source only', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
sources: ['non-dashboard'],
})
expect(result.whereSql).toContain("statements.query !~* 'source: dashboard'")
})
it('does not add source filter when both sources are selected', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
sources: ['dashboard', 'non-dashboard'],
})
expect(result.whereSql).not.toContain('source: dashboard')
})
it('filters by minimum calls', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
minCalls: 10,
})
expect(result.whereSql).toContain('statements.calls >= 10')
})
it('does not filter by minCalls when 0', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
minCalls: 0,
})
expect(result.whereSql).not.toContain('statements.calls')
})
it('filters by minimum total time', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
minTotalTime: 500,
})
expect(result.whereSql).toContain(
'(statements.total_exec_time + statements.total_plan_time) >= 500'
)
})
it('combines multiple WHERE conditions with AND', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
roles: ['postgres'],
searchQuery: 'SELECT',
minCalls: 5,
})
expect(result.whereSql).toContain("auth.rolname in ('postgres')")
expect(result.whereSql).toContain("statements.query ~* 'SELECT'")
expect(result.whereSql).toContain('statements.calls >= 5')
expect(result.whereSql.split(' AND ').length).toBe(3)
})
it('passes WHERE clause to base sql function', () => {
const result = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
roles: ['postgres'],
})
expect(result.sql).toContain('WHERE')
})
it('does not include user-defined WHERE conditions when no filters set', () => {
const result = generateQueryPerformanceSql({ preset: 'mostFrequentlyInvoked' })
expect(result.whereSql).toBe('')
// The base SQL may still contain its own WHERE clause (e.g. statements.calls > 0)
// but the user-defined whereSql should be empty
})
it('passes runIndexAdvisor and filterIndexAdvisor flags', () => {
const resultWithAdvisor = generateQueryPerformanceSql({
preset: 'mostFrequentlyInvoked',
runIndexAdvisor: true,
filterIndexAdvisor: true,
})
expect(resultWithAdvisor.sql).toBeDefined()
})
it('works with different presets', () => {
const presets = [
'mostFrequentlyInvoked',
'mostTimeConsuming',
'slowestExecutionTime',
'queryHitRate',
'unified',
] as const
for (const preset of presets) {
const result = generateQueryPerformanceSql({ preset })
expect(result.sql).toBeDefined()
}
})
it('clamps page=0 to page=1 (no negative offset)', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: 0, pageSize: 20 })
expect(result.sql).toContain('offset 0')
expect(result.sql).not.toMatch(/offset -\d/)
})
it('clamps negative page to page=1', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: -5, pageSize: 20 })
expect(result.sql).toContain('offset 0')
})
it('clamps pageSize above 100 to 100', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: 1, pageSize: 9999 })
expect(result.sql).toContain('limit 100')
expect(result.sql).not.toContain('limit 9999')
})
it('applies LIMIT and OFFSET for page 2', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: 2, pageSize: 20 })
expect(result.sql).toContain('limit 20 offset 20')
})
it('does not produce NaN in SQL when page is NaN', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: NaN, pageSize: 20 })
expect(result.sql).not.toContain('NaN')
expect(result.sql).toContain('offset 0')
})
it('does not produce NaN in SQL when pageSize is NaN', () => {
const result = generateQueryPerformanceSql({ preset: 'unified', page: 1, pageSize: NaN })
expect(result.sql).not.toContain('NaN')
expect(result.sql).toContain('limit 20')
})
})