import { describe, test, expect } from 'vitest'; import { Logo } from './Logo'; /* * Regression coverage for Logo.toHtml -- audited during the toHtml * attribute-XSS sweep (see task-cssxss-brief.md) and found already fully * sanitized (href/src via escapeAttr(safeUrl()), alt/text via escapeAttr / * escapeHtml, imageWidth/fontSize/etc. routed through cssPropsToString which * sanitizes every value regardless of declared type). No fix was required; * these tests lock that behavior in against regressions. */ const toHtml = (Logo as any).toHtml; describe('Logo.toHtml href sanitization (attacker-controlled `href` prop)', () => { test('a javascript: URL is neutralized', () => { const { html } = toHtml({ href: 'javascript:alert(1)' }, ''); expect(html).not.toContain('javascript:alert'); }); test('a quote-breakout href does not escape the anchor attribute', () => { const malicious = '">'; const { html } = toHtml({ href: malicious }, ''); expect(html).not.toContain(''); }); }); describe('Logo.toHtml image src/alt sanitization (type="image")', () => { test('a javascript: imageSrc is neutralized', () => { const { html } = toHtml({ type: 'image', imageSrc: 'javascript:alert(1)', text: 'Logo' }, ''); expect(html).not.toContain('javascript:alert'); }); test('a quote-breakout alt (from `text`) does not escape the img attribute', () => { const malicious = '">'; const { html } = toHtml({ type: 'image', imageSrc: 'https://example.com/logo.png', text: malicious }, ''); expect(html).not.toContain(''); }); test('a non-numeric imageWidth (attribute-breakout attempt) does not escape the style attribute', () => { const malicious = '1">'; const { html } = toHtml({ type: 'image', imageSrc: 'https://example.com/logo.png', imageWidth: malicious }, ''); expect(html).not.toContain(''); }); }); describe('Logo.toHtml download attribute (F3: link-to-file toggle)', () => { test('download:true emits the download attribute', () => { const { html } = toHtml({ href: '/resume.pdf', download: true, text: 'Resume' }, ''); expect(html).toMatch(/ no download attribute emitted', () => { const { html } = toHtml({ href: '/', text: 'MySite' }, ''); expect(html).not.toContain('download'); }); }); describe('Logo (F4: box-model + animation + visibility props on craft.props)', () => { test('craft.props includes animation/visibility defaults so the panel controls always render', () => { const craftProps = (Logo as any).craft.props; expect(craftProps).toHaveProperty('animation', 'none'); expect(craftProps).toHaveProperty('animationDelay', '0'); expect(craftProps).toHaveProperty('hideOnDesktop', false); expect(craftProps).toHaveProperty('hideOnTablet', false); expect(craftProps).toHaveProperty('hideOnMobile', false); }); }); describe('Logo.toHtml text-logo styling sanitization', () => { test('a quote-breakout color does not escape the span style attribute', () => { const malicious = 'red" onmouseover="alert(1)'; const { html } = toHtml({ type: 'text', text: 'MySite', color: malicious }, ''); // The raw `"` must never survive un-escaped inside the style attribute // value -- if it did, `onmouseover` would land as a REAL new HTML // attribute (breakout) rather than being inert CSS-value garbage inside // a properly-escaped style="...". expect(html).not.toMatch(/style="[^"]*"[^>]*onmouseover/); }); test('a normal logo renders as expected', () => { const { html } = toHtml({ type: 'text', text: 'MySite', href: '/' }, ''); expect(html).toContain('href="/"'); expect(html).toContain('MySite'); }); });