diff --git a/frontend-modern/src/components/Alerts/Thresholds/sections/__tests__/CollapsibleSection.test.tsx b/frontend-modern/src/components/Alerts/Thresholds/sections/__tests__/CollapsibleSection.test.tsx index e29b68cba..40f9cab7f 100644 --- a/frontend-modern/src/components/Alerts/Thresholds/sections/__tests__/CollapsibleSection.test.tsx +++ b/frontend-modern/src/components/Alerts/Thresholds/sections/__tests__/CollapsibleSection.test.tsx @@ -1,4 +1,5 @@ import { afterEach, describe, expect, it, vi } from 'vitest'; +import { createSignal } from 'solid-js'; import { cleanup, fireEvent, render, screen } from '@solidjs/testing-library'; import { CollapsibleSection, SectionActionButton, NestedGroupHeader } from '../CollapsibleSection'; import { @@ -173,6 +174,47 @@ describe('CollapsibleSection', () => { expect(button).toHaveAttribute('aria-expanded', 'false'); }); + it('preserves an edited threshold across controlled collapse and reopen', () => { + const [collapsed, setCollapsed] = createSignal(true); + render(() => ( + + + + )); + + const disclosure = screen.getByRole('button', { name: 'Snapshot Age' }); + const panel = document.getElementById(disclosure.getAttribute('aria-controls')!); + expect(panel).toHaveAttribute('inert'); + expect(panel).toHaveAttribute('aria-hidden', 'true'); + + fireEvent.click(disclosure); + expect(disclosure).toHaveAttribute('aria-expanded', 'true'); + expect(panel).not.toHaveAttribute('inert'); + expect(panel).not.toHaveAttribute('aria-hidden'); + const input = screen.getByRole('spinbutton', { name: 'Warning days' }); + fireEvent.input(input, { target: { value: '14' } }); + + fireEvent.click(disclosure); + expect(disclosure).toHaveAttribute('aria-expanded', 'false'); + expect(panel).toHaveAttribute('inert'); + expect(panel).toHaveAttribute('aria-hidden', 'true'); + + fireEvent.click(disclosure); + expect(disclosure).toHaveAttribute('aria-expanded', 'true'); + expect(panel).not.toHaveAttribute('inert'); + expect(panel).not.toHaveAttribute('aria-hidden'); + expect(screen.getByRole('spinbutton', { name: 'Warning days' })).toBe(input); + expect(input).toHaveValue(14); + }); + it('shows "Disabled" badge when isGloballyDisabled is true', () => { render(() => (