What causes "Could not find Tailwind Play's ${label} editor tab" in saadeghi/daisyui?

Update tailwind-play-share; the tab selector is UI-coupled and tracked upstream.

saadeghi/daisyui · error · Error

Could not find Tailwind Play's ${label} editor tab

Error message

Could not find Tailwind Play's ${label} editor tab

What it means

Thrown by clickEditorTab when no visible button or [role=tab] element whose normalized text equals the requested label ("HTML" or "CSS") could be found. This runs only in the keyboard/UI fallback path setWithEditorUi, used when the Monaco model API was not accessible.

Source

Thrown at packages/tailwind-play-share/index.mjs:578

  const clicked = await evaluate(
    client,
    `(() => {
      const normalize = (value) => value?.replace(/\\s+/g, " ").trim().toLowerCase() ?? "";
      const visible = (element) => {
        const rect = element.getBoundingClientRect();
        const style = getComputedStyle(element);
        return rect.width > 0 && rect.height > 0 && style.visibility !== "hidden" && style.display !== "none";
      };
      const target = [...document.querySelectorAll("button,[role=tab]")]
        .filter(visible)
        .find((element) => normalize(element.textContent) === ${JSON.stringify(label.toLowerCase())});
      if (!target) return false;
      target.click();
      return true;
    })()`,
  )

  if (!clicked) throw new Error(`Could not find Tailwind Play's ${label} editor tab`)
  await delay(150)
}

async function focusVisibleEditor(client, label, timeoutMs) {
  const deadline = Date.now() + timeoutMs
  let target

  do {
    target = await evaluate(
      client,
      `(() => {
      const normalize = (value) => value?.replace(/\\s+/g, " ").trim().toLowerCase() ?? "";
      const visible = (element) => {
        const rect = element.getBoundingClientRect();
        const style = getComputedStyle(element);
        return rect.width > 0 && rect.height > 0 && style.visibility !== "hidden" && style.display !== "none";
      };

View on GitHub (pinned to 42b09e637e)

Solutions

Update tailwind-play-share; the tab selector is UI-coupled and tracked upstream.
Raise --timeout so tabs are present before the fallback runs.
Run with --verbose and --headed to inspect the live tab labels.
Retry once; transient render races can miss the tab.

Defensive patterns

Strategy: try-catch

Try / catch

try {
  url = await createTailwindPlay(inputs)
} catch (error) {
  if (/Could not find Tailwind Play's .* editor tab/.test(error.message)) {
  // UI coupling broke; update the script or retry after raising timeout
  }
  throw error
}

Prevention

Update tailwind-play-share when Tailwind Play ships UI changes.
Raise --timeout so tabs are present before the fallback path runs.
Use --headed to inspect the actual tab labels when debugging.

When it happens

Trigger: evaluate() returns clicked === false because the querySelectorAll("button,[role=tab]") filter found no visible element whose textContent lowercases to "html"/"css".

Common situations: Tailwind Play redesigned its editor chrome so the HTML/CSS tabs are no longer labeled or structured as the script expects, the page is still rendering when the click is attempted, or a different locale changes the tab labels.

Related errors

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