Cryptic Script Error. reported in Javascript in Chrome and Firefox
The "Script error." happens in Firefox, Safari, and Chrome when an exception violates the browser's same-origin policy - i.e. when the error occurs in a script that's hosted on a domain other than the domain of the current page.
This behavior is intentional, to prevent scripts from leaking information to external domains. For an example of why this is necessary, imagine accidentally visiting evilsite.com
, that serves up a page with <script src="yourbank.com/index.html">
. (yes, we're pointing that script tag at html, not JS). This will result in a script error, but the error is interesting because it can tell us if you're logged in or not. If you're logged in, the error might be 'Welcome Fred...' is undefined
, whereas if you're not it might be 'Please Login ...' is undefined
. Something along those lines.
If evilsite.com does this for the top 20 or so bank institutions, they'd have a pretty good idea of which banking sites you visit, and could provide a much more targeted phishing page. (This is just one example, of course. But it illustrates why browsers shouldn't allow any data to cross domain boundaries.)
I've tested this in the latest versions of Safari, Chrome, and Firefox - they all do this. IE9 does not - it treats x-origin exceptions the same as same-origin ones. (And Opera doesn't support onerror.)
From the horses mouth: WebKit source that checks origin when passing exceptions to onerror(). And the Firefox source that checks.
UPDATE (10/21/11): The Firefox bug that tracks this issue includes a link to the blog post that inspired this behavior.
UPDATE (12/2/14): You can now enable full cross-domain error reporting on some browsers by specifying a crossorigin
attribute on script tags and having the server send the appropriate CORS HTTP response headers.
My scripts doesn't work on Mozilla Firefox but does on Chrome
Use the window.pageYOffset
instead of document.body.scrollTop
:
if(window.pageYOffset >= 150)
More detail on the issue here : document.body.scrollTop Firefox returns 0 : ONLY JS
response from await browser.tabs.sendMessage is set in chrome, but not in firefox
I guess for the tests in firefox you do the reload of the background script (F5 or the specific button in devtools)
Just as you have coded the background you have little hope of getting an answer because every time you reload the background you break the wire with all content scripts injected into the page(s).
Move the browser check inside the "SendMessageToFront" function. Move the "SendMessageToFront" function (async is not needed) to the main thread and run that function in the main thread.
/*async*/ function SendMessageToFront(message) {
if (typeof browser === "undefined")
var browser = chrome;
let resolve;
const promise = new Promise(r => resolve = r);
browser.tabs.query({}, async function(tabs) {
for (let index = 0; index < tabs.length; index++) {
const tab = tabs[index];
if (tab.url) {
let url = new URL(tab.url);
if (url.hostname.includes("tragetdomain.com")) {
var startTime = performance.now()
let response = await browser.tabs.sendMessage(tab.id, {'message': message});
var endTime = performance.now()
console.log(`Call to doSomething took ${endTime - startTime} milliseconds`) // this takes 0ms
console.log("got response");
console.log(response); // this is undefined
console.log(browser.runtime.lastError); // this is empty
resolve(response);
break
}
}
}
});
return promise
}
(async _ => {
await SendMessageToFront()
})();
in this way you will get an error message as soon as the background is ready which tells you that the content script on the other side does not exists or it's not ready yet, but now, when the content script will be ready, you should just re-launch the function from the background script devtools
(async _ => {
await SendMessageToFront()
})();
this time you will get the correct answer {a: 1}
Related Topics
Check If Point Is Inside a Polygon
Overriding a JavaScript Function While Referencing the Original
Change Form Values After Submit Button Pressed
".Addeventlistener Is Not a Function" Why Does This Error Occur
Dynamically Populating Drop Down List from Selection of Another Drop Down Value
Increment a Number in a String in with Regex
Html5/JavaScript - Dataurl to Blob & Blob to Dataurl
Saving and Loading an Image from Localstorage
What Are Passive Event Listeners
Reactjs Async Rendering of Components
How to Check If Page Exists Using JavaScript
Handling Multiple Catches in Promise Chain
Why Does a Form with One Text Input Submit on Enter While One with Two Text Inputs Does Not
Using JavaScript to Change Website Language