Files
supabase/apps/studio/components/interfaces/Database/Hooks/HTTPParameters.test.tsx
Vaibhav 1cffe632e3 fix: webhook apikey (#47317)
## TL;DR
Database webhooks/Cron jobs now add `apikey: <secret-key>` for edge
function auth..

## ref:
- related to: https://github.com/supabase/supabase/pull/46890
- towards COM-269

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## New Features
* Improved edge function webhook authentication by automatically
selecting the appropriate API key or authorization header format.
* Authorization headers are now added or normalized when required, while
preserving existing custom headers and supported credentials.

## Improvements
* Simplified “Add header” and “Add parameter” controls with clearer
labels.
* Updated authentication actions to clearly describe the selected header
type.

## Tests
* Expanded coverage for key formats, authorization behavior, header
preservation, and revised control labels.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Tomás Pozo <tomaspozo@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-08-24 10:06:36 -06:00

56 lines
1.6 KiB
TypeScript

import { render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { useForm } from 'react-hook-form'
import { Form } from 'ui'
import { describe, expect, it } from 'vitest'
import { type WebhookFormValues } from './EditHookPanel.constants'
import { HTTPParameters } from './HTTPParameters'
const HTTPParametersHarness = () => {
const form = useForm<WebhookFormValues>({
defaultValues: {
name: 'test-hook',
table_id: 'public.messages',
http_method: 'POST',
timeout_ms: 1000,
events: ['INSERT'],
function_type: 'http_request',
http_url: 'https://hooks.example.com/webhook',
httpHeaders: [],
httpParameters: [{ id: 'param-1', name: 'tenant', value: 'prod' }],
},
})
return (
<Form {...form}>
<HTTPParameters form={form} />
</Form>
)
}
describe('HTTPParameters', () => {
it('appends a new parameter row', async () => {
const user = userEvent.setup()
render(<HTTPParametersHarness />)
await user.click(screen.getByRole('button', { name: 'Add parameter' }))
expect(screen.getAllByPlaceholderText('Parameter name')).toHaveLength(2)
expect(screen.getAllByPlaceholderText('Parameter value')).toHaveLength(2)
})
it('removes an existing parameter row', async () => {
const user = userEvent.setup()
render(<HTTPParametersHarness />)
expect(screen.getByDisplayValue('tenant')).toBeInTheDocument()
await user.click(screen.getByRole('button', { name: 'Remove parameter' }))
expect(screen.queryByDisplayValue('tenant')).not.toBeInTheDocument()
})
})