A very odd DOMException on Substack 🤔
because of the Metamask extension on Firefox
Short debugging session to get Substack to run properly on my Firefox again.
5th November 2024
For the last two days substack hasn’t been working well with Firefox for me. I had to switch to Safari. The publishing dashboard also gets stuck and looks like today the styling is not working well either.
Also, I can’t mention Substack here. Makes sense I guess.
The following errors stand out to me here.
1. Failed to execute ‘postMessage’ on ‘DOMWindow’: The target origin provided (‘https://substack.com’) does not match the recipient window’s origin (‘https://vibhavstechdiary.substack.com’). vibhavstechdiary.substack.com (the main error)
2.1 Ignoring unsupported entryTypes: longtask. datadog-rum.js:1:52684
Layout was forced before the page was fully loaded. If stylesheets are not yet loaded this may cause a flash of unstyled content. visited-surface-frame
2.2 Ignoring unsupported entryTypes: longtask. datadog-rum.js:1:52684
3. Removing unpermitted intrinsics lockdown-install.js:1:52832
Overview of the issues
While we are at it let’s dive into each of these and understand what might be happening here.
1. Possible CORS issue
Didn’t dive too deep into this but from the surface it looks like a CORS issue. Here `postMessage` allows for cross domain communication, based on what I understand as I skim through this blog.
2. RUM = Real User Monitoring
`longtask` is probably not supported in Firefox, so you might need to use something else there. Maybe some cross browser testing might help here.
3. Unpermitted intrinsics
Looks like Firefox is stopping certain executions here. Might be because of the CSP (Content Security Policy) here.
Troubleshoot Mode in Firefox
While I am at it I want to quickly troubleshoot this issue first. Don’t want to put this whiney blog post out there without doing some work myself, you know.
First we open Firefox in Troubleshoot Mode and restart Firefox.
And as I do that, looks like it’s all fixed now. Wow. I hate this. But, at least we can be sure that it was no. 1 that caused the issue as it is the only error which I can’t see below and the UI looks alright now.
Let’s exit the troubleshoot mode and see if this error occurs again. This means that we will have to just exit Firefox and restart it
After restarting it, Firefox was fine again. I still got the other errors like the one above but the CORS issue disappeared.
This was a one off thing but was really odd for me.
Fiddling with the Firefox browser extensions
One thing that troubleshoot mode does in Firefox is disable the extensions. Earlier I had also disabled the extensions so I had no way of telling if there were any extensions causing some issue.
Then I fiddled around with the extensions for a bit and found something interesting. This error is occurring only when I enable two specific browser extensions together. Metamask and Adblock Plus.
Metamask and Adblock Plus is (not) a match made in heaven (for substack)
Seems like the existence of both of these together is causing issues for my precious substack running in my Firefox. After taking a look around, seems like this kind issue has been seen before in the Metamask-extension. It seems to be an open sourced as well. Nice.
Based on this issue the extension seems to be spamming the parent window and the frames. There was another issue like this but that was about not running the postMessage in the right context. But, looks like for now I am going to turn off Metamask and be happy.
Have you face an issue like this before which wasn’t profitable, but annoying enough for you to look into it ?