[Vuejs]-Sandboxed page in Chrome extension through iframe throwing error when passing messages

0👍

So this problem has been solved. The error was only occurring when setting a vue variable’s value to the event.source on the index.js end window.addEventListener("message", (event) => { ... }). I guess something with how Vue tracks the variables doesn’t mesh with the variable being a window object of the sender. However I realized the sender was the parent to the iframe all along and so I solved my issue by:

  • Not sending the introduction packet that saved the event.source for command sending.
  • And instead sending commands through window.parent.postMessage where before I was using this.vueVariable.postMessage.

I hope this helps anyone who comes across such an issue in the future, the solution was right under my nose the whole time. There are no longer any errors in the extension and communication works both ways with setting working as well.

Leave a comment