import { describe, test, expect } from 'vitest'
import { render, waitFor } from '@testing-library/react'
import { ChatAgentMessageMarkdown } from './chat-agent-message-markdown'

// MarkdownContent is lazy-loaded, so these await the chunk resolving.
describe('ChatAgentMessageMarkdown', () => {
  test('renders emphasis as elements', async () => {
    const { container } = render(
      <ChatAgentMessageMarkdown>
        {'Some **bold** text'}
      </ChatAgentMessageMarkdown>,
    )
    await waitFor(() =>
      expect(container.querySelector('strong')?.textContent).toBe('bold'),
    )
  })

  test('renders GFM tables', async () => {
    const md = '| name | pop |\n| --- | --- |\n| CA | 39M |'
    const { container } = render(
      <ChatAgentMessageMarkdown>{md}</ChatAgentMessageMarkdown>,
    )
    await waitFor(() => expect(container.querySelector('table')).toBeTruthy())
    expect(container.querySelector('td')?.textContent).toBe('CA')
  })

  test('skips raw HTML and strips images (model output)', async () => {
    // Separate paragraphs: a CommonMark HTML block swallows its whole line,
    // so inline content sharing the script's line would be skipped with it.
    const md = '<script>alert(1)</script>\n\nsafe ![alt](https://x/y.png)'
    const { container } = render(
      <ChatAgentMessageMarkdown>{md}</ChatAgentMessageMarkdown>,
    )
    await waitFor(() => expect(container.textContent).toContain('safe'))
    expect(container.querySelector('script')).toBeNull()
    expect(container.querySelector('img')).toBeNull()
  })
})