// @vitest-environment jsdom
/**
 * MarkdownText is used for chat/activity/timeline short LLM output (thinking,
 * user messages, agent asks, movement previews). Raw HTML embedded in that
 * output must NOT be injected as live DOM — otherwise a final answer that
 * contains an HTML document (which the agent is often asked to write) renders
 * its own tags and shatters the chat layout. Raw HTML must show as escaped
 * source text instead.
 */
import '../test/dom-setup';
import { describe, it, expect } from 'vitest';
import { render } from '@testing-library/react';
import { MarkdownText } from './markdown-text';

describe('MarkdownText raw-HTML handling', () => {
  it('does not render a raw block HTML tag as a live element', () => {
    const { container } = render(
      <MarkdownText text={'ここが出力です。\n\n<div class="boom">hello</div>'} />,
    );
    // The <div class="boom"> must not exist as a real element.
    expect(container.querySelector('div.boom')).toBeNull();
    // Its source must be visible as escaped text.
    expect(container.textContent).toContain('<div class="boom">hello</div>');
  });

  it('shows a full HTML document as escaped source, not a rendered page', () => {
    const doc = '<!DOCTYPE html>\n<html>\n<body><h1>Title</h1></body>\n</html>';
    const { container } = render(<MarkdownText text={doc} />);
    // No live <body>/<h1> smuggled into the chat DOM.
    expect(container.querySelector('h1')).toBeNull();
    expect(container.textContent).toContain('<!DOCTYPE html>');
    expect(container.textContent).toContain('<h1>Title</h1>');
  });

  it('escapes inline raw HTML instead of rendering it', () => {
    const { container } = render(<MarkdownText text={'a <b>bold</b> c'} />);
    expect(container.querySelector('b')).toBeNull();
    expect(container.textContent).toContain('<b>bold</b>');
  });

  it('still renders normal Markdown constructs', () => {
    const { container } = render(<MarkdownText text={'**strong** and `code`'} />);
    expect(container.querySelector('strong')?.textContent).toBe('strong');
    expect(container.querySelector('code')?.textContent).toBe('code');
  });
});
