/Docs

Troubleshooting

The Visual Editor handles most real-world pages out of the box. When something doesn't work, the cause is usually one of the scenarios below.

Shadow DOM

If you try to edit an element inside a shadow root, the editor detects this and warns you. The runtime can apply changes to open shadow roots if you provide a piercing selector, but it cannot reach closed shadow roots from outside.

  • Open shadow root — The editor offers to switch the selector to a shadow-piercing form (e.g. my-component::part(label)) when the host exposes a ::part attribute. If no part is available, ask engineering to add one.
  • Closed shadow root — Closed shadow roots are deliberately invisible to outside scripts. You cannot edit them via the Visual Editor; the change must ship as production code.
What you'll see
The panel shows a yellow warning banner that reads "This element lives inside a shadow root — edits may not apply on all pages." with a Learn more link to this page.

Cross-origin iframes

For security, browsers block scripts from one origin from accessing the DOM of another. If your page embeds a payment widget, chatbot, or video player from another domain, the snippet inside that iframe is a different snippet — your edits don't cross the boundary.

The editor detects when the element you clicked lives inside a cross-origin iframe and disables the edit form, instead suggesting you target the host page's wrapper element. Edits to the wrapper (size, positioning, visibility) work fine; edits to the iframe's contents do not.

Snippet not detected

When you open a page in the editor, the extension probes the page for a running A vs B snippet. If it doesn't find one, the panel shows a red banner: "A vs B snippet not detected on this page."

Most common causes and fixes:

  • The snippet isn't installed — Check Quick install and verify by opening the browser dev tools console and typing window.avsb.
  • Snippet is installed on a different environment — Confirm the URL in your experiment matches the environment where the snippet runs (staging vs production).
  • An ad blocker is interfering — Some aggressive blockers match the snippet URL. Pause the blocker on the editing domain.
  • Consent mode is denying the snippet — See the consent mode section below.

Lock conflicts

Only one teammate can edit a variation at a time. When somebody else opens the same variation, you'll see the message "Maya is editing this variation" in the panel header. Saving is disabled until they finish or the lock expires.

  • The lock TTL is 5 minutes of inactivity. Once it expires, the next person to open the variation receives the lock.
  • The editor refreshes a presence heartbeat every 30 secondswhile you're actively editing. Closing the tab drops your lock immediately on the next heartbeat.
  • If you save more than 30 times in one minute, the API rate-limits further saves until the next window opens. This guards against runaway scripts; manual editing never hits this limit.
  • To force a takeover, click Request edit access. The current editor receives a prompt to release the lock.

CORS

If your site's Content-Security-Policy doesn't allow the A vs B snippet origin, the editor can't inject its overlay. Symptom: the editor opens but nothing on the page is clickable and the browser console logs CSP violations.

Allow the A vs B origins
text
1Content-Security-Policy:
2 script-src 'self' https://snippet.avsb.io https://api.avsb.io;
3 connect-src 'self' https://api.avsb.io https://events.avsb.io;
4 frame-src 'self' https://app.avsb.io;

Add the directives above (or the equivalent for your CSP) and reload. The editor should attach cleanly on the next page load.

If you run the snippet in consent mode and the visiting browser hasn't opted in, the snippet stays inactive — and so does the editor. To author variations on a consent-gated site, either accept the consent banner in the editor browser, or temporarily set the snippet to always run for the staging environment you author against.

Anti-flicker interactions

Anti-flicker holds the page hidden until the snippet finishes applying changes, then reveals it. In rare cases the editor's overlay can race with the anti-flicker reveal. If you see the editor panel attach but the page beneath stays blank, refresh the tab; on the second load, anti-flicker uses cached selectors and the race is gone. See anti-flicker behaviour for the full lifecycle.

When in doubt, capture a HAR
If you have a tricky issue we can't reproduce, capture a HAR file (Chrome dev tools → Network → right-click → Save all as HAR) and attach it to your support request. The HAR shows every request the snippet and editor made and is the fastest path to a fix.