saadeghi/daisyui · error · Error

No fenced HTML example found in ${filePath}

Error message

No fenced HTML example found in ${filePath}

What it means

Thrown by extractFirstHtmlExample when a component docs page markdown has no fenced ```html code block matching the expected pattern (an opening ```html line followed by content and a closing ```). The error names the docs file path. This runs while combining HTML examples for the preview.

Source

Thrown at packages/tailwind-play-share/pr-preview.mjs:433

function readFileAtRevision(revision, filePath) {
  return git(["show", `${revision}:${filePath}`])
}

function listDocsPages(revision) {
  return git(["ls-tree", "-r", "--name-only", "-z", revision, "--", docsRoot])
    .split("\0")
    .filter((filePath) => filePath.endsWith("/+page.md"))
    .sort()
}

export function sourceCssFilename(markdown) {
  return markdown.match(/^source:\s+\S*\/([^/\s]+\.css)\s*$/m)?.[1]
}

export function extractFirstHtmlExample(markdown, filePath = "component page") {
  const match = markdown.match(/^[ \t]*```html[ \t]*\r?\n([\s\S]*?)^[ \t]*```[ \t]*$/m)
  if (!match) throw new Error(`No fenced HTML example found in ${filePath}`)
  return match[1].replaceAll("$$", "").trim()
}

export function indexDocsPages(pages) {
  const index = new Map()
  for (const { filePath, markdown } of pages) {
    const cssFilename = sourceCssFilename(markdown)
    if (!cssFilename) continue
    const mappedPages = index.get(cssFilename) ?? []
    mappedPages.push({ filePath, markdown })
    index.set(cssFilename, mappedPages)
  }
  return index
}

function buildDocsIndex(revision) {
  return indexDocsPages(
    listDocsPages(revision).map((filePath) => ({

View on GitHub (pinned to 42b09e637e)

Solutions

1. Open the named docs file and add a top-level ```html fenced example.
2. Ensure the fence is exactly ```html (no language suffix variants the regex won't match).
3. If the component genuinely has no HTML example, update the docs page to include one.

Example fix

<!-- before: packages/docs/.../btn/+page.md -->
```tsx
<button class="btn">X</button>
```

<!-- after -->
```html
<button class="btn">X</button>
```

import { readFileSync } from "node:fs"
function assertHasHtmlExample(markdownPath) {
  const md = readFileSync(markdownPath, "utf8")
  if (!/^[ \t]*```html[ \t]*\r?\n([\s\S]*?)^[ \t]*```[ \t]*$/m.test(md)) {
    throw new Error(`${markdownPath} needs a top-level \`\`\`html fenced example`)
  }
}

const hasHtmlFence = (md) => /^[ \t]*```html[ \t]*\r?\n([\s\S]*?)^[ \t]*```[ \t]*$/m.test(md)

try {
  inputs = buildPreviewInputs(baseSha, headSha)
} catch (error) {
  if (/No fenced HTML example found in /.test(error.message)) {
  // add a ```html block to the named docs page, then re-run
  }
  throw error
}

When it happens

Trigger: markdown.match(/^[ \t]*```html[ \t]*\r?\n([\s\S]*?)^[ \t]*```[ \t]*$/m) returns null on a docs page that the docs index mapped to a changed component.

Common situations: A component +page.md whose example uses a different fence label (e.g. ```tsx, ```html with extra text, indented fence that doesn't start at column 0 in a way the regex rejects), a docs page that documents only CSS with no HTML example, or a partially-written docs page in the PR.

Related errors

• No component docs page maps to ${cssFilename}
• Unsafe PR CSS in ${filePath}: ${reason}
• No changed component CSS files were found between the suppli
• --base-sha is required
• --head-sha is required

AI-assisted analysis of saadeghi/daisyui@42b09e637e (2026-08-13). Data as JSON: /api/errors/8ce4b103e9dc0f1a. Report an issue: GitHub.