import { describe, test, expect } from 'vitest';
import { Divider } from './Divider';

const toHtml = (Divider as any).toHtml;

describe('Divider.toHtml normal rendering', () => {
  test('renders thickness/color into the border-top style', () => {
    const { html } = toHtml({ thickness: '2px', color: '#ff0000' }, '');
    expect(html).toContain('border-top:2px solid #ff0000');
  });
});

describe('Divider.toHtml XSS hardening (thickness/color into style=)', () => {
  test('a thickness value with an attribute-breakout string cannot escape style=""', () => {
    const malicious = '1px" onmouseover="alert(1)';
    const { html } = toHtml({ thickness: malicious as any, color: '#000' }, '');
    // The quote must not survive unescaped -- otherwise it closes style=""
    // early and "onmouseover" becomes a live, attacker-controlled attribute.
    expect(html).not.toMatch(/"\s+onmouseover="/);
    expect(html).not.toMatch(/style="[^"]*"[^>]*onmouseover/);
  });

  test('a color value with a </style><script> breakout is neutralized', () => {
    const malicious = '#000</style><script>alert(1)</script>';
    const { html } = toHtml({ thickness: '1px', color: malicious as any }, '');
    expect(html).not.toContain('<script>alert(1)</script>');
  });

  test('a non-string thickness (object) does not raw-splice into style=""', () => {
    const malicious = { toString: () => '1px" onmouseover="alert(1)' };
    const { html } = toHtml({ thickness: malicious as any, color: '#000' }, '');
    expect(html).not.toMatch(/"\s+onmouseover="/);
  });
});