fix(web): address UI polish review feedback
This commit is contained in:
@@ -2,7 +2,9 @@
|
||||
import { cleanup, render } from '@testing-library/react'
|
||||
import { afterEach, describe, expect, it } from 'vitest'
|
||||
import * as primitives from '@deepseek-ai/dsh-client-ui-primitives'
|
||||
import { IconApiOutline14, IconArchiveOutline20, IconFolderClose16, IconSendOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
|
||||
import {
|
||||
IconApiOutline14, IconArchiveOutline20, IconFolderClose16, IconGoalOutline16, IconSendOutline16,
|
||||
} from '@deepseek-ai/dsh-client-ui-primitives'
|
||||
|
||||
afterEach(cleanup)
|
||||
|
||||
@@ -44,6 +46,12 @@ describe('ic_ds_ icon set', () => {
|
||||
const archive = render(<IconArchiveOutline20 />)
|
||||
expect(archive.container.querySelector('svg')!.getAttribute('width')).toBe('20')
|
||||
})
|
||||
|
||||
it('renders reusable goal glyphs without document-global ids', () => {
|
||||
const { container } = render(<><IconGoalOutline16 /><IconGoalOutline16 /></>)
|
||||
expect(container.querySelector('[id]')).toBeNull()
|
||||
expect(container.querySelector('[clip-path]')).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('FishLogo', () => {
|
||||
|
||||
@@ -92,6 +92,37 @@ describe('Tooltip', () => {
|
||||
}
|
||||
})
|
||||
|
||||
it('reclamps after label and viewport width changes', () => {
|
||||
const originalWidth = window.innerWidth
|
||||
const spy = vi.spyOn(Element.prototype, 'getBoundingClientRect').mockImplementation(function (this: Element) {
|
||||
if (this.getAttribute('role') !== 'tooltip') return rect(900, 1000)
|
||||
return this.textContent === 'Wide' ? rect(900, 1100) : rect(850, 950)
|
||||
})
|
||||
try {
|
||||
const view = render(
|
||||
<Tooltip label="Wide" side="bottom">
|
||||
<button type="button">anchor</button>
|
||||
</Tooltip>,
|
||||
)
|
||||
fireEvent.mouseEnter(screen.getByText('anchor'))
|
||||
expect(screen.getByRole('tooltip').style.left).toBe('862px')
|
||||
|
||||
view.rerender(
|
||||
<Tooltip label="Short" side="bottom">
|
||||
<button type="button">anchor</button>
|
||||
</Tooltip>,
|
||||
)
|
||||
expect(screen.getByRole('tooltip').style.left).toBe('950px')
|
||||
|
||||
Object.defineProperty(window, 'innerWidth', { configurable: true, value: 900 })
|
||||
fireEvent(window, new Event('resize'))
|
||||
expect(screen.getByRole('tooltip').style.left).toBe('888px')
|
||||
} finally {
|
||||
Object.defineProperty(window, 'innerWidth', { configurable: true, value: originalWidth })
|
||||
spy.mockRestore()
|
||||
}
|
||||
})
|
||||
|
||||
it('clamps a bubble past the left viewport edge back inside', () => {
|
||||
const spy = vi.spyOn(Element.prototype, 'getBoundingClientRect').mockReturnValue(rect(-20, 80))
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user