68 lines
2.4 KiB
TypeScript
68 lines
2.4 KiB
TypeScript
import { describe, it, expect } from 'vitest'
|
|
import { pageSchema, type Page } from '@/lib/schema/page'
|
|
import { exportPage } from '@/lib/exporter/html'
|
|
|
|
const makePage = (): Page =>
|
|
pageSchema.parse({
|
|
title: 'Form Help Snapshot',
|
|
locale: 'en',
|
|
theme: { primaryColor: '#0ea5e9', fontFamily: 'Inter' },
|
|
sections: [],
|
|
form: {
|
|
actionUrl: '',
|
|
fields: [
|
|
{ type: 'text', name: 'name', label: 'Name', required: true, help: 'Your full name' },
|
|
{ type: 'email', name: 'email', label: 'Email', required: true },
|
|
{ type: 'radio', name: 'size', label: 'Size', options: ['S','M'], help: 'Pick one size' },
|
|
{ type: 'select', name: 'plan', label: 'Plan', options: ['Free','Pro'], help: 'Choose plan' },
|
|
{ type: 'checkbox', name: 'agree', label: 'Agree', required: true, help: 'Must agree' },
|
|
],
|
|
spamProtection: { honeypotFieldName: '_hp', minSubmitSeconds: 2 },
|
|
},
|
|
seo: { title: 'SEO', description: 'Desc' },
|
|
})
|
|
|
|
function extractForm(html: string): string {
|
|
const m = html.match(/<form[\s\S]*?<\/form>/)
|
|
return m ? m[0]
|
|
// normalize whitespace for snapshot stability
|
|
.replace(/\s+\n/g, '\n')
|
|
.replace(/\n\s+/g, '\n')
|
|
.trim()
|
|
: ''
|
|
}
|
|
|
|
describe('Exporter - form helptext snapshot', () => {
|
|
it('contains stable wiring for ids/labels/help/aria', () => {
|
|
const out = exportPage(makePage())
|
|
const form = extractForm(out.html)
|
|
|
|
// name with help
|
|
expect(form).toContain('id="field-name"')
|
|
expect(form).toContain('<label for="field-name">Name')
|
|
expect(form).toContain('id="field-name-help"')
|
|
expect(form).toContain('aria-describedby="field-name-help"')
|
|
|
|
// email present (no help)
|
|
expect(form).toContain('id="field-email"')
|
|
expect(form).toContain('<label for="field-email">Email')
|
|
expect(form).not.toContain('field-email-help')
|
|
|
|
// radio group help on fieldset
|
|
expect(form).toContain('<fieldset')
|
|
expect(form).toContain('aria-describedby="field-size-help"')
|
|
expect(form).toContain('id="field-size-help"')
|
|
expect(form).toContain('type="radio"')
|
|
|
|
// select with help
|
|
expect(form).toContain('id="field-plan"')
|
|
expect(form).toContain('aria-describedby="field-plan-help"')
|
|
expect(form).toContain('id="field-plan-help"')
|
|
|
|
// checkbox with help
|
|
expect(form).toContain('id="field-agree"')
|
|
expect(form).toContain('aria-describedby="field-agree-help"')
|
|
expect(form).toContain('id="field-agree-help"')
|
|
})
|
|
})
|