vuejs/devtools-v6 · warning

[Vue Devtools] Failed to send message to parent window

Error message

[Vue Devtools] Failed to send message to parent window

What it means

When accessing `window.parent.__VUE_DEVTOOLS_GLOBAL_HOOK__` itself throws (most commonly a cross-origin parent, where the property access violates the same-origin policy), sendToParent catches the exception and logs this warning with the error. The message to the parent is lost. Like [2], it is a logged warning, not a thrown error.

Solutions

  1. Serve the app from the same origin as the parent page, or inject the devtools hook script into the parent document so no cross-origin access is needed.
  2. Use a postMessage-based bridge instead of direct parent-window hook access for cross-origin embedding.
  3. Confirm the iframe isn't sandboxed in a way that blocks parent access; adjust sandbox attributes if you control the host.
  4. Ignore the warning if devtools integration inside embedded cross-origin frames is not required.
Defensive patterns

Strategy: try-catch

Validate before calling

function canAccessParent() {
  try { void window.parent.location.href; return true } catch { return false }
}

Try / catch

try {
  sendToParent(fn)
} catch (e) {
  console.warn('[Vue Devtools] Failed to send message to parent window', e)
  // fall back to local hook or postMessage channel
}

Prevention

When it happens

Trigger: Any sendToParent call while the app runs in a cross-origin iframe: evaluating `window.parent.__VUE_DEVTOOLS_GLOBAL_HOOK__` throws a SecurityError, which lands in this catch block. Also any other unexpected exception raised during parent-window access.

Common situations: Vue app embedded in a third-party cross-origin iframe (ad frames, hosted previews, CodeSandbox/StackBlitz style embeds); browser privacy extensions blocking cross-origin access; parent page on a different domain than the app.

Related errors


AI-assisted analysis of vuejs/devtools-v6@dd2ab5d427 (2026-08-31). Data as JSON: /api/errors/c5502e42caaa6b15. Report an issue: GitHub.

Appendix: source

Thrown at packages/app-backend-core/src/hook.ts:82

    }
    return
  }

  let hook

  if (isIframe) {
    const sendToParent = (cb) => {
      try {
        const hook = (window.parent as any).__VUE_DEVTOOLS_GLOBAL_HOOK__
        if (hook) {
          return cb(hook)
        }
        else {
          console.warn('[Vue Devtools] No hook in parent window')
        }
      }
      catch (e) {
        console.warn('[Vue Devtools] Failed to send message to parent window', e)
      }
    }

    hook = {
      devtoolsVersion,
      // eslint-disable-next-line accessor-pairs
      set Vue(value) {
        sendToParent((hook) => {
          hook.Vue = value
        })
      },

      // eslint-disable-next-line accessor-pairs
      set enabled(value) {
        sendToParent((hook) => {
          hook.enabled = value
        })
      },

View on GitHub (pinned to dd2ab5d427)