Files
deepseek-harness/packages/client/ui-primitives/tests/icons.spec.tsx
creatixchu 3f34a72b66 review(ui-primitives): stop the size doc from enumerating native sizes
The parenthetical listed 14/16 and this branch added 20, but the set never
held to it: IconRightUpOutline14 defaults to 8, IconTreeCorner8x10 to 10,
and IconWarningOutline16 to 14. Drop the list rather than maintain one that
drifts, and retitle the icons test that carried the same generalization.
2026-08-03 10:42:34 +08:00

61 lines
2.7 KiB
TypeScript

// @vitest-environment jsdom
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'
afterEach(cleanup)
// Icon components all share the IconProps signature; the barrel also exports
// non-icon atoms (different props shapes), so filter by prefix BEFORE typing.
const icons = Object.fromEntries(
Object.entries(primitives).filter(([name]) => name.startsWith('Icon')),
) as Record<string, (p: primitives.IconProps) => React.JSX.Element>
const iconNames = Object.keys(icons)
describe('ic_ds_ icon set', () => {
it('exports the full P-I set (45 deepsuite + 15 figma extracts + the hand-authored sparkle)', () => {
expect(iconNames.length).toBe(61)
})
it.each(iconNames)('%s renders an svg with currentColor fills and no hardcoded palette', (name) => {
const Icon = icons[name]!
const { container } = render(<Icon />)
const svg = container.querySelector('svg')
expect(svg).not.toBeNull()
const markup = container.innerHTML
expect(markup).not.toMatch(/#[0-9a-fA-F]{3,8}"/)
expect(markup).toContain('currentColor')
})
it('size and className props land on the root svg', () => {
const { container } = render(<IconSendOutline16 size={20} className="x" />)
const svg = container.querySelector('svg')!
expect(svg.getAttribute('width')).toBe('20')
expect(svg.getAttribute('height')).toBe('20')
expect(svg.classList.contains('x')).toBe(true)
})
it('each glyph defaults to its own drawn size, not one set-wide default', () => {
const api = render(<IconApiOutline14 />)
expect(api.container.querySelector('svg')!.getAttribute('width')).toBe('14')
const folder = render(<IconFolderClose16 />)
expect(folder.container.querySelector('svg')!.getAttribute('width')).toBe('16')
const archive = render(<IconArchiveOutline20 />)
expect(archive.container.querySelector('svg')!.getAttribute('width')).toBe('20')
})
})
describe('FishLogo', () => {
it('renders the fish path in currentColor at the native ratio', () => {
const { container } = render(<primitives.FishLogo />)
const svg = container.querySelector('svg')!
expect(svg.getAttribute('width')).toBe('24')
expect(Number(svg.getAttribute('height'))).toBeCloseTo(17.66, 1)
expect(svg.getAttribute('viewBox')).toBe('0 0 23.16 17.04')
expect(container.querySelectorAll('path')).toHaveLength(1)
expect(container.innerHTML).toContain('currentColor')
expect(container.innerHTML).not.toContain('M0 0L23.16')
})
})