fix: property panel responsive layout + status dropdown click regression
- StatusDropdown: change anchor element from <div> to <span> to fix invalid HTML nesting inside <span> parents. Browsers auto-correct <div> inside <span> by ripping the element out, breaking anchorRef.parentElement positioning. JSDOM doesn't auto-correct, so tests passed but the real app's dropdown failed to position. - StatusValue: revert shrink-0 back to min-w-0 so the status pill can truncate in narrow panels instead of overflowing. - PropertyRow: add min-w-0 and gap-2 for proper flex overflow, wrap property key in truncate span. - AddPropertyForm: add flex-wrap, reduce input widths, set min-w-[60px] on value inputs for narrow panel support. - InfoRow/TypeSelector/ReadOnlyType: add min-w-0 and gap-2. - Tests: increase timeout for 3 Radix Select interaction tests that are slow in JSDOM. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1012,7 +1012,7 @@ describe('DynamicPropertiesPanel', () => {
|
||||
expect(screen.getByText('\u2713 Yes')).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('stores actual boolean value when adding boolean property', () => {
|
||||
it('stores actual boolean value when adding boolean property', { timeout: 15_000 }, () => {
|
||||
render(
|
||||
<DynamicPropertiesPanel
|
||||
entry={makeEntry()}
|
||||
@@ -1034,7 +1034,7 @@ describe('DynamicPropertiesPanel', () => {
|
||||
expect(onAddProperty).toHaveBeenCalledWith('published', true)
|
||||
})
|
||||
|
||||
it('shows date picker trigger when date type selected', () => {
|
||||
it('shows date picker trigger when date type selected', { timeout: 15_000 }, () => {
|
||||
render(
|
||||
<DynamicPropertiesPanel
|
||||
entry={makeEntry()}
|
||||
@@ -1050,7 +1050,7 @@ describe('DynamicPropertiesPanel', () => {
|
||||
expect(screen.getByText('Pick a date\u2026')).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('shows status dropdown when status type selected', () => {
|
||||
it('shows status dropdown when status type selected', { timeout: 15_000 }, () => {
|
||||
render(
|
||||
<DynamicPropertiesPanel
|
||||
entry={makeEntry()}
|
||||
|
||||
Reference in New Issue
Block a user