// @vitest-environment happy-dom
import { render, screen } from '@testing-library/react'
import { describe, expect, it } from 'vitest'

import { ArticleBodySection } from '../../views/page-editor/sections/ArticleBodySection.js'
import type { PageSection } from '../../lib/page-editor-service.js'

function section(content: Record<string, unknown> = {}): PageSection {
  return {
    id: 's1',
    sectionType: 'article-body',
    name: 'Article Body',
    visible: true,
    content,
    settings: {},
  }
}

describe('ArticleBodySection', () => {
  it('renders post body HTML with rich-text preview class', () => {
    const { container } = render(
      <ArticleBodySection
        section={section({ source: 'field' })}
        context={{ body: '<h2>What is Lorem Ipsum?</h2><p>Body copy.</p>' }}
      />,
    )

    expect(screen.getByRole('heading', { level: 2, name: 'What is Lorem Ipsum?' })).toBeTruthy()
    expect(container.querySelector('.actuate-rich-text')).toBeTruthy()
    expect(container.querySelector('.prose')).toBeNull()
  })
})
