Unexpected message received by the iframe: [object MessageEvent]. Expected setup_port

[adrianocr]

Using nuxt with the @nuxt/prismic plugin. The toolbar works perfectly fine but the console has the error message Unexpected message received by the iframe: [object MessageEvent]. Expected setup_port

[timtyrrell]

I am getting it in a standard nodejs project recently, no nuxt.

[scerelli]

same, gatsby project

[dangaparker]

same, next.js

[timtyrrell]

This is seriously annoying, can someone look into this?

[yousefamar]

Happens for Vue too. Seems like this has been an issue for quite some time now. Devs, do you need more info to reproduce this or something?

[yousefamar]

Just some extra info — I thought this was the cause of the prismic toolbar not working outright, but it doesn't seem so. I've managed to get the preview/toolbar to work by disabling a browser extension that blocks tracking. This was based on this article which lead me to disable any extension that may interfere with cookies. If the toolbar isn't working for you, you may have similar with that article although the error persists.

[agnelnieves]

Having the same issue on a few of my prismic nuxt projects. I thought it was me lol, spent the night trying to find what was the issue on the debugger 😭

[hades200082]

Same issue on NextJS

[juliandreas]

This issue now affects the lighthouse score..

[jeroenslor]

Same, NextJS

[AdamDiament]

Same, next JS 10.2

[lihbr]

Hey,

First of all, I'm really sorry for the lack of reaction from our side, thanks for pinging this issue again.

So far we tried to reproduce the above on Chrome latest (91.0.4472.77) without success for now.

Based on @yousefamar's https://github.com/prismicio/prismic-toolbar/issues/60#issuecomment-792016721 we also tried to reproduce with a variety of adblockers enabled (AdBlock, AdBLock Plus, and uBlock Origin), without success again.

Moving forward, we'll keep investigating this issue, our focus being on identifying its cause for now. Looking at the comments it doesn't look like it's due to a specific framework being used.

If you're able to reproduce the issue, you can greatly help us by providing as much of the following information:

- OS: 
- Browser & Version: 
- Prismic toolbar script link you registered (if you know it): 
- Are you able to reproduce on a guest session? (no extensions enabled, different from incognito mode): 
- If `no`, list of extensions installed and enabled: 
- Are you able to reproduce on a production website? (not `localhost`): 
- If `yes`, sharing its link can be helpful: 
- Any other information you'd like to also add: 

I'm looking forward to having this issue resolved!

[hades200082]

@lihbr

I see this error on my live site at https://leeconlin.co.uk/ using the latest Firefox and latest Google Chrome, both on Windows 10.

I have reproduced it using incognito windows in both browsers with all extensions disabled.

The error only seems to show up when I also have a logged-in session on Prismic.

[kzkr]

Same, NuxtJS

[lihbr]

Hey, giving you some updates!

I checked back then the website of @hades200082 without success. I tried to check again today but looks like they removed the toolbar script from it (which makes sense).

I moved on to testing things on my side using my demo website: https://sms-hoy.netlify.app

On Windows 10 with Chrome latest using a guest session:

• Not logged in to Prismic: no error;
• Logged in to Prismic: no error.

I repeated the same test on MacOS using Safari this time:

• Not logged in to Prismic: no error;
• Logged in to Prismic: no error.

As of writing this, my guess would be that maybe some configurations related to cookie settings on the browser itself may interfere with the toolbar, yet to find which settings though.

This still needs more investigation. Anyone willing to provide additional information following my previous post will greatly help!

[juliandreas]

@lihbr I tried turning off all my Chrome extensions and the error disappeared. The extension that was complaining was "Dashlane - Password manager".

This error is only on Prismic sites though.

[lihbr]

Awesome @juliandreas! We finally managed to reproduce.

Looks like indeed there's something wrong happening when Dashlane's extension is running at the same time.

I tried disabling it for "this website" inside the extension widget and the error is gone. I have to admit it's not ideal but at least Dashlane keeps working on other websites this way.

We'll try to investigate from that point what's exactly causing this issue when the extension is running.

[aaronransley]

Hi there,

Wanted to pop in here and mention that this issue is occurring even with a completely vanilla Chrome, Edge, or Firefox profile. Even with no extensions loaded (and having never used Dashlane myself), I am tracking a number of Uncaught Error: Unexpected message received by the iframe: [object MessageEvent]. Expected setup_port errors each time I load a page that is using the Prismic SDK.

Using Nuxt, if it's helpful.

[bde-maze]

Hello there,

I found this issue happening with the MetaMask Chrome extension as well.(https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en)

Once deactivated, the log disappeared.

[lihbr]

Thanks @bde-maze!

Indeed, I think it makes sense for a security/privacy-oriented extension to tamper your cookies which the toolbar relies on. We are still investigating the source of this issue.

[lihbr]

We managed to pinpoint the issue, looks like some extensions like to chat with every iframes :)

Should land pretty soon~

[bde-maze]

We managed to pinpoint the issue, looks like some extensions like to chat with every iframes :)

Should land pretty soon~

Yeah that's great news, thank you for the follow up !

jaja that's convenient :)