410 lines
12 KiB
TypeScript
410 lines
12 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
|
import { render, screen, waitFor } from '@testing-library/react'
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
|
import userEvent from '@testing-library/user-event'
|
|
import ProxyHostForm from '../ProxyHostForm'
|
|
import type { ProxyHost } from '../../api/proxyHosts'
|
|
import type { AccessList } from '../../api/accessLists'
|
|
import type { SecurityHeaderProfile } from '../../api/securityHeaders'
|
|
|
|
// Mock all required hooks
|
|
vi.mock('../../hooks/useRemoteServers', () => ({
|
|
useRemoteServers: vi.fn(() => ({
|
|
servers: [],
|
|
isLoading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
vi.mock('../../hooks/useDocker', () => ({
|
|
useDocker: vi.fn(() => ({
|
|
containers: [],
|
|
isLoading: false,
|
|
error: null,
|
|
refetch: vi.fn(),
|
|
})),
|
|
}))
|
|
|
|
vi.mock('../../hooks/useDomains', () => ({
|
|
useDomains: vi.fn(() => ({
|
|
domains: [{ uuid: 'domain-1', name: 'test.com' }], // Add test.com so modal doesn't appear
|
|
createDomain: vi.fn().mockResolvedValue({}),
|
|
isLoading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
vi.mock('../../hooks/useCertificates', () => ({
|
|
useCertificates: vi.fn(() => ({
|
|
certificates: [],
|
|
isLoading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
vi.mock('../../hooks/useDNSDetection', () => ({
|
|
useDetectDNSProvider: vi.fn(() => ({
|
|
mutateAsync: vi.fn(),
|
|
isPending: false,
|
|
data: undefined,
|
|
reset: vi.fn(),
|
|
})),
|
|
}))
|
|
|
|
const mockAccessLists: AccessList[] = [
|
|
{
|
|
id: 1,
|
|
uuid: 'acl-uuid-1',
|
|
name: 'Office Network',
|
|
description: 'Office IP range',
|
|
type: 'whitelist',
|
|
ip_rules: JSON.stringify([]),
|
|
country_codes: '',
|
|
local_network_only: false,
|
|
enabled: true,
|
|
created_at: '2024-01-01',
|
|
updated_at: '2024-01-01',
|
|
},
|
|
{
|
|
id: 2,
|
|
uuid: 'acl-uuid-2',
|
|
name: 'VPN Users',
|
|
description: 'VPN IP range',
|
|
type: 'whitelist',
|
|
ip_rules: JSON.stringify([]),
|
|
country_codes: '',
|
|
local_network_only: false,
|
|
enabled: true,
|
|
created_at: '2024-01-01',
|
|
updated_at: '2024-01-01',
|
|
},
|
|
]
|
|
|
|
const mockSecurityProfiles: SecurityHeaderProfile[] = [
|
|
{
|
|
id: 1,
|
|
uuid: 'profile-uuid-1',
|
|
name: 'Basic Security',
|
|
description: 'Basic security headers',
|
|
is_preset: true,
|
|
preset_type: 'basic',
|
|
security_score: 60,
|
|
created_at: '2024-01-01',
|
|
updated_at: '2024-01-01',
|
|
hsts_enabled: false,
|
|
hsts_max_age: 0,
|
|
hsts_include_subdomains: false,
|
|
hsts_preload: false,
|
|
csp_enabled: false,
|
|
csp_directives: '',
|
|
csp_report_only: false,
|
|
csp_report_uri: '',
|
|
x_frame_options: '',
|
|
x_content_type_options: false,
|
|
referrer_policy: '',
|
|
permissions_policy: '',
|
|
cross_origin_opener_policy: '',
|
|
cross_origin_resource_policy: '',
|
|
cross_origin_embedder_policy: '',
|
|
xss_protection: false,
|
|
cache_control_no_store: false,
|
|
},
|
|
{
|
|
id: 2,
|
|
uuid: 'profile-uuid-2',
|
|
name: 'Strict Security',
|
|
description: 'Strict security headers',
|
|
is_preset: true,
|
|
preset_type: 'strict',
|
|
security_score: 90,
|
|
created_at: '2024-01-01',
|
|
updated_at: '2024-01-01',
|
|
hsts_enabled: true,
|
|
hsts_max_age: 31536000,
|
|
hsts_include_subdomains: true,
|
|
hsts_preload: true,
|
|
csp_enabled: true,
|
|
csp_directives: "default-src 'self'",
|
|
csp_report_only: false,
|
|
csp_report_uri: '',
|
|
x_frame_options: 'DENY',
|
|
x_content_type_options: true,
|
|
referrer_policy: 'no-referrer',
|
|
permissions_policy: '',
|
|
cross_origin_opener_policy: 'same-origin',
|
|
cross_origin_resource_policy: 'same-origin',
|
|
cross_origin_embedder_policy: 'require-corp',
|
|
xss_protection: true,
|
|
cache_control_no_store: false,
|
|
},
|
|
]
|
|
|
|
vi.mock('../../hooks/useAccessLists', () => ({
|
|
useAccessLists: vi.fn(() => ({
|
|
data: mockAccessLists,
|
|
isLoading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
vi.mock('../../hooks/useSecurityHeaders', () => ({
|
|
useSecurityHeaderProfiles: vi.fn(() => ({
|
|
data: mockSecurityProfiles,
|
|
isLoading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
// Mock fetch for health endpoint
|
|
vi.stubGlobal('fetch', vi.fn(() => Promise.resolve({
|
|
json: () => Promise.resolve({ internal_ip: '127.0.0.1' }),
|
|
})))
|
|
|
|
const createWrapper = () => {
|
|
const queryClient = new QueryClient({
|
|
defaultOptions: {
|
|
queries: { retry: false },
|
|
mutations: { retry: false },
|
|
},
|
|
})
|
|
return ({ children }: { children: React.ReactNode }) => (
|
|
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
|
|
)
|
|
}
|
|
|
|
describe('ProxyHostForm Dropdown Change Bug Fix', () => {
|
|
let mockOnSubmit: (data: Partial<ProxyHost>) => Promise<void>
|
|
let mockOnCancel: () => void
|
|
|
|
beforeEach(() => {
|
|
mockOnSubmit = vi.fn<(data: Partial<ProxyHost>) => Promise<void>>()
|
|
mockOnCancel = vi.fn<() => void>()
|
|
})
|
|
|
|
it('allows changing ACL selection after initial selection', async () => {
|
|
const user = userEvent.setup()
|
|
const Wrapper = createWrapper()
|
|
|
|
render(
|
|
<Wrapper>
|
|
<ProxyHostForm onSubmit={mockOnSubmit} onCancel={mockOnCancel} />
|
|
</Wrapper>
|
|
)
|
|
|
|
// Fill required fields
|
|
await user.type(screen.getByLabelText(/^Name/), 'Test Service')
|
|
await user.type(screen.getByLabelText(/Domain Names/), 'test.com')
|
|
await user.type(screen.getByLabelText(/^Host$/), 'localhost')
|
|
await user.clear(screen.getByLabelText(/^Port$/))
|
|
await user.type(screen.getByLabelText(/^Port$/), '8080')
|
|
|
|
// Select first ACL
|
|
const aclTrigger = screen.getByRole('combobox', { name: /Access Control List/i })
|
|
await user.click(aclTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Office Network/i }))
|
|
|
|
// Verify first ACL is selected
|
|
expect(screen.getByText('Office Network')).toBeInTheDocument()
|
|
|
|
// Change to second ACL
|
|
await user.click(aclTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /VPN Users/i }))
|
|
|
|
// Verify second ACL is now selected
|
|
expect(screen.getByText('VPN Users')).toBeInTheDocument()
|
|
|
|
// Submit and verify the correct ACL ID is in the payload
|
|
await user.click(screen.getByRole('button', { name: /Save/i }))
|
|
|
|
await waitFor(() => {
|
|
expect(mockOnSubmit).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
access_list_id: 2, // Should be second ACL
|
|
})
|
|
)
|
|
})
|
|
})
|
|
|
|
it('allows removing ACL selection', async () => {
|
|
const user = userEvent.setup()
|
|
const Wrapper = createWrapper()
|
|
|
|
render(
|
|
<Wrapper>
|
|
<ProxyHostForm onSubmit={mockOnSubmit} onCancel={mockOnCancel} />
|
|
</Wrapper>
|
|
)
|
|
|
|
// Fill required fields
|
|
await user.type(screen.getByLabelText(/^Name/), 'Test Service')
|
|
await user.type(screen.getByLabelText(/Domain Names/), 'test.com')
|
|
await user.type(screen.getByLabelText(/^Host$/), 'localhost')
|
|
await user.clear(screen.getByLabelText(/^Port$/))
|
|
await user.type(screen.getByLabelText(/^Port$/), '8080')
|
|
|
|
// Select an ACL
|
|
const aclTrigger = screen.getByRole('combobox', { name: /Access Control List/i })
|
|
await user.click(aclTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Office Network/i }))
|
|
|
|
// Verify ACL is selected
|
|
expect(screen.getByText('Office Network')).toBeInTheDocument()
|
|
|
|
// Remove ACL by selecting "No Access Control"
|
|
await user.click(aclTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /No Access Control/i }))
|
|
|
|
// Submit and verify ACL is null
|
|
await user.click(screen.getByRole('button', { name: /Save/i }))
|
|
|
|
await waitFor(() => {
|
|
expect(mockOnSubmit).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
access_list_id: null,
|
|
})
|
|
)
|
|
})
|
|
})
|
|
|
|
it('allows changing Security Headers selection after initial selection', async () => {
|
|
const user = userEvent.setup()
|
|
const Wrapper = createWrapper()
|
|
|
|
render(
|
|
<Wrapper>
|
|
<ProxyHostForm onSubmit={mockOnSubmit} onCancel={mockOnCancel} />
|
|
</Wrapper>
|
|
)
|
|
|
|
// Fill required fields
|
|
await user.type(screen.getByLabelText(/^Name/), 'Test Service')
|
|
await user.type(screen.getByLabelText(/Domain Names/), 'test.com')
|
|
await user.type(screen.getByLabelText(/^Host$/), 'localhost')
|
|
await user.clear(screen.getByLabelText(/^Port$/))
|
|
await user.type(screen.getByLabelText(/^Port$/), '8080')
|
|
|
|
// Select first security profile
|
|
const headersTrigger = screen.getByRole('combobox', { name: /Security Headers/i })
|
|
await user.click(headersTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Basic Security/i }))
|
|
|
|
// Change to second profile
|
|
await user.click(headersTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Strict Security/i }))
|
|
|
|
// Submit and verify the correct profile ID is in the payload
|
|
await user.click(screen.getByRole('button', { name: /Save/i }))
|
|
|
|
await waitFor(() => {
|
|
expect(mockOnSubmit).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
security_header_profile_id: 2, // Should be second profile
|
|
})
|
|
)
|
|
})
|
|
})
|
|
|
|
it('allows removing Security Headers selection', async () => {
|
|
const user = userEvent.setup()
|
|
const Wrapper = createWrapper()
|
|
|
|
render(
|
|
<Wrapper>
|
|
<ProxyHostForm onSubmit={mockOnSubmit} onCancel={mockOnCancel} />
|
|
</Wrapper>
|
|
)
|
|
|
|
// Fill required fields
|
|
await user.type(screen.getByLabelText(/^Name/), 'Test Service')
|
|
await user.type(screen.getByLabelText(/Domain Names/), 'test.com')
|
|
await user.type(screen.getByLabelText(/^Host$/), 'localhost')
|
|
await user.clear(screen.getByLabelText(/^Port$/))
|
|
await user.type(screen.getByLabelText(/^Port$/), '8080')
|
|
|
|
// Select a security profile
|
|
const headersTrigger = screen.getByRole('combobox', { name: /Security Headers/i })
|
|
await user.click(headersTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Basic Security/i }))
|
|
|
|
// Remove security headers by selecting "None"
|
|
await user.click(headersTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /None \(No Security Headers\)/i }))
|
|
|
|
// Submit and verify security_header_profile_id is null
|
|
await user.click(screen.getByRole('button', { name: /Save/i }))
|
|
|
|
await waitFor(() => {
|
|
expect(mockOnSubmit).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
security_header_profile_id: null,
|
|
})
|
|
)
|
|
})
|
|
})
|
|
|
|
it('allows editing existing host with ACL and changing it', async () => {
|
|
const user = userEvent.setup()
|
|
const Wrapper = createWrapper()
|
|
|
|
const existingHost: ProxyHost = {
|
|
uuid: 'host-uuid-1',
|
|
name: 'Existing Service',
|
|
domain_names: 'existing.com',
|
|
forward_scheme: 'http',
|
|
forward_host: 'localhost',
|
|
forward_port: 8080,
|
|
ssl_forced: true,
|
|
http2_support: true,
|
|
hsts_enabled: true,
|
|
hsts_subdomains: true,
|
|
block_exploits: true,
|
|
websocket_support: false,
|
|
enable_standard_headers: true,
|
|
application: 'none',
|
|
advanced_config: '',
|
|
enabled: true,
|
|
locations: [],
|
|
certificate_id: null,
|
|
access_list_id: 1, // Initially has first ACL
|
|
security_header_profile_id: 1, // Initially has first profile
|
|
dns_provider_id: null,
|
|
created_at: '2024-01-01',
|
|
updated_at: '2024-01-01',
|
|
}
|
|
|
|
render(
|
|
<Wrapper>
|
|
<ProxyHostForm host={existingHost} onSubmit={mockOnSubmit} onCancel={mockOnCancel} />
|
|
</Wrapper>
|
|
)
|
|
|
|
// Verify initial ACL is shown
|
|
expect(screen.getByText('Office Network')).toBeInTheDocument()
|
|
|
|
// Change ACL
|
|
const aclTrigger = screen.getByRole('combobox', { name: /Access Control List/i })
|
|
await user.click(aclTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /VPN Users/i }))
|
|
|
|
// Verify new ACL is shown
|
|
expect(screen.getByText('VPN Users')).toBeInTheDocument()
|
|
|
|
// Change security headers
|
|
const headersTrigger = screen.getByRole('combobox', { name: /Security Headers/i })
|
|
await user.click(headersTrigger)
|
|
await user.click(await screen.findByRole('option', { name: /Strict Security/i }))
|
|
|
|
// Submit and verify changes
|
|
await user.click(screen.getByRole('button', { name: /Save/i }))
|
|
|
|
await waitFor(() => {
|
|
expect(mockOnSubmit).toHaveBeenCalledWith(
|
|
expect.objectContaining({
|
|
access_list_id: 2,
|
|
security_header_profile_id: 2,
|
|
})
|
|
)
|
|
})
|
|
})
|
|
})
|