pbakaus/impeccable · warning

[impeccable] Could not find original element in live DOM.

Error message

[impeccable] Could not find original element in live DOM.

What it means

After a Svelte component-variant manifest is accepted, the script must find the original element the user picked in the live page DOM to swap it for the variants wrapper. When findLiveElementForSvelteManifest returns nothing (or the element has no parent), this warning fires and the session enters recovery: it keeps the variant counts, remembers the saved visible variant, and waits for the anchor to appear again rather than failing outright.

Source

Thrown at skill/scripts/live-browser.js:5832

        const remounted = await mountSvelteComponentVariant(visibleVariant || 1);
        if (!remounted) {
          // The mount already reported the failure and raised the card.
          // Advancing to CYCLING here would show a bar claiming variants are
          // ready over a page where nothing rendered.
          saveSession();
          return;
        }
        setLiveState('CYCLING');
        hideShaderOverlay();
        showOrUpdateCyclingBar();
        saveSession();
        completeParameterGenerationIfReady();
        return;
      }

      const liveEl = findLiveElementForSvelteManifest(manifest);
      if (!liveEl?.parentElement) {
        console.warn('[impeccable] Could not find original element in live DOM.');
        arrivedVariants = availableVariants;
        expectedVariants = Number(manifest.count) || expectedVariants || arrivedVariants;
        const saved = loadSession();
        const savedVisibleVariant = saved && saved.id === sessionId ? saved.visible : 0;
        visibleVariant = visibleVariant > 0 && visibleVariant <= arrivedVariants
          ? visibleVariant
          : (savedVisibleVariant > 0 && savedVisibleVariant <= arrivedVariants ? savedVisibleVariant : 1);
        enterRecoveryWaitingForAnchor({ checkpointReason: 'component_preview_anchor_missing', trackScroll: true });
        waitForSvelteComponentTargetAndRetry({ manifestPath, sessionId, manifest });
        return;
      }

      const wrapper = document.createElement('div');
      wrapper.dataset.impeccableVariants = sessionId;
      wrapper.dataset.impeccableVariantCount = String(manifest.count || expectedVariants || 1);
      wrapper.dataset.impeccablePreview = componentPreviewMode;
      wrapper.style.display = 'contents';

View on GitHub (pinned to 2bc2879276)

Solutions

  1. Navigate back to the route/view where the picked element is rendered — the session recovers automatically once the anchor appears.
  2. Retrace the path that made the element visible (open the modal/panel, trigger the conditional).
  3. If the element is permanently gone, discard the session and pick a new element.
  4. Check the manifest's sourceFile/anchor metadata matches the page you are viewing.
Defensive patterns

Strategy: fallback

Type guard

const liveEl = findLiveElementForSvelteManifest(manifest);
if (!liveEl?.parentElement) {
  // enter recovery: keep counts, wait for anchor to reappear
  enterRecoveryWaitingForAnchor({ checkpointReason: 'component_preview_anchor_missing', trackScroll: true });
}

Prevention

When it happens

Trigger: Resuming or mounting Svelte component variants when the picked element is no longer in the DOM — a route change, conditional render (closed modal/panel), or framework re-render removed it between generation and mount.

Common situations: Page navigated to another route while variants were generating; element inside a conditionally rendered block that unmounted; full page refresh landed on a page where the element is not rendered; HMR replaced the component instance before mount.

Related errors


AI-assisted analysis of pbakaus/impeccable@2bc2879276 (2026-09-08). Data as JSON: /api/errors/34d5a3c32fd26cab. Report an issue: GitHub.