import * as React from 'react'
import { renderToStaticMarkup } from 'react-dom/server'
import { describe, expect, it } from 'vitest'
import { SkipLink } from '../src/primitives/skip-link'

describe('SkipLink', () => {
  it('renders the shared main-content anchor contract by default', () => {
    const markup = renderToStaticMarkup(<SkipLink />)

    expect(markup).toContain('href="#main-content"')
    expect(markup).toContain('class="skip-link"')
    expect(markup).toContain('Skip to main content')
  })

  it('accepts target and label overrides for layout callers', () => {
    const markup = renderToStaticMarkup(
      <SkipLink targetId="docs-main-content" label="Skip to docs" />,
    )

    expect(markup).toContain('href="#docs-main-content"')
    expect(markup).toContain('Skip to docs')
  })
})