Develop Reference

JSON Parse error: Unrecognized token '!' - error caught by Sentry

The error in the title is caught by Sentry (an error tracking tool). Below is a screenshot from Sentry - showing the stack trace.
Note: the script /en_US/iab.autofill.payment.js where handleMessage is located is loaded from Facebook (link here), and I couldn't find this script in the javascript bundle, nor anything related to it. I assume it's loaded by a 3rd party script - I'm using Google Tag Manager (which is also loading Facebook Pixel), Segment (loading Hotjar and Mixpanel), and Snapchat. The error started to appear without any changes in these scripts or the services that they're sending data to.
Note 2: It seems that the error is triggered quite often, about 10-15% of the time. I tried to reproduce it but given that it's a handled error, it doesn't show in the dev console.
Any direction on where to look would be much appreciated.

I'm seeing this a lot, and it seems to be coming 100% from users using Facebook browser on iOS (I guess this is the browser you see when you're using the Facebook app).
I tried to debug this with a snippet:
<script>
window.addEventListener('message', function (e) {
console.log(e);
JSON.parse(e.data);
console.log('foo');
}, false);
</script>
This is from the library you linked. Assuming that e.data is JSON string (not e.g. an object?), without any safeguard seems to be breaking things.
The second console.log doesn't fire, so I think this is causing some unexpected behaviours in my case (buttons not reacting to clicks with js listeners etc)
I don't know if there is a workaround or a way to protect from this in Facebook embedded browser (I guess it's loaded there)
Looking forward to hear more info

i have meet that too, its because the one script facebook inject in. will postMessage(Object), but the another script will listen the message and try to JSON.parse an object ,so it will came out a error. u can use 'vconsole' lib, and add a window.addEventListener('message',(e)=>{console.log(e.data)}) and u can see that

Apparently, the issue went away after a couple of weeks without changing anything on my side.

Finding a strange Javascript function 'window.ueLogError' in a PhantomJS error message

I'm working on a project that involves retrieving multiple websites with PhantomJS and when I try to load Amazon.com, PhantomJS crashes while trying to evaluate this function with the error:
TypeError: 'undefined' is not a function (evaluating 'window.ueLogError')
The weird thing is that I can't seem to find any documentation or explanation of any kind for window.ueLogError. A google search gives a handful of websites with scripts that contain it, but it doesn't seem to be a part of any documentation I can find. Does anyone know anything about ueLogError?

The window object is the global sink in the browser. Every variable that you define globally (e.g. jQuery's $) is a property in window. ueLogError is not some kind of standardized JavaScript function. It is most likely some function for an advertisement script.
Not all resources that a page requests as part of the page load are actually successfully loaded. Some requests fail due to SSL problems. Some requests fail, because the user agent string is not supported. Some requests fail because of unknown reasons.
You can register to the onConsoleMessage, onError, onResourceError, onResourceTimeout events (Example) to see whether there are errors. Usually you will find that some JavaScript file wasn't loaded which would have contained ueLogError which another script depends on.

Random 404 from localhost

I'm running a local server in python
python -c $'import SimpleHTTPServer;\nmap = SimpleHTTPServer.SimpleHTTPRequestHandler.extensions_map;\nmap[""] = "text/plain";\nfor key, value in map.items():\n\tmap[key] = value + ";charset=UTF-8";\nSimpleHTTPServer.test();' "$port"
EDIT: This is the readable version of the command string passed to python -c, so in pseudocode the code block above could be resumed like this: python -c $'command' "$port" where
the command part is:
import SimpleHTTPServer
map = SimpleHTTPServer.SimpleHTTPRequestHandler.extensions_map
map[""] = "text/plain"
for key, value in map.items():
map[key] = value + ";charset=UTF-8"
SimpleHTTPServer.test()
and I get (seemingly) random 404 errors that prevents my js to execute correctly.
More specifically I am serving a static html page and its linked javascript files.
Chrome tells me net::ERR_ADDRESS_UNREACHABLE and sometimes net::ERR_CONNECTION_REFUSED on this script tag on the index.html page.
<script type="text/javascript" src="http://localhost:8000/lib/fonts.js"></script>
I have 3 weird behavior I don't understand:
if I inspect the terminal log where the python server is running I don't have any 404 error. In fact it says that the file was correctly served (200).
if I go to chrome's Network panel it tells me: Failed to load response data but if I 'open link on a new tab' I can actually see the file!
If I load the file http://localhost:8000/lib/fonts.js on another tab and I refresh many times I never get errors.
sometimes I don't get any 404 errors but my js does not work at all (no js errors)
So who is causing the problem? Chrome, Python or some async behavior in my js?
I suspect that the js files are not loaded in order so other js scripts could not find and use them..
EDIT2:
If I switch server, for example using the built-in php server:
php -S localhost:8000
I won't get the errors

Ok this seems was caused by two different issues:
I've got rid of any async attributes on the <script> nodes. Especially it seems that loading jquery from google with the async attributes was causing most of the problems. Most probably the order of the scripts was not preserved but I've never got any error about jquery being undefined, I was getting an error on the missing script /lib/fonts.js weird..
Even tough removing async made things more reliable, more or less once every 10 page refresh I still got errors of the type net::ERR_ADDRESS_UNREACHABLE or net::ERR_CONNECTION_REFUSED on different external resources, sometimes on a js file, sometimes on a css file. Changing the python server with the php built-in server seems removed the remaining random errors.
So php -S localhost:8000 is more reliable (in my case) than the python counterpart.
NOTE: Even tough I've solved the problem I still don't know exactly what was causing the errors so if someone else has a better answer than this he's very welcome to post. I will leave the answer unaccepted for a while.

Javascript "Object Required" Error

I'm working at an organization that only uses IE 8 (Windows 7). Every user gets a policy that includes a predefined set of settings. I have a problem with a javascript code only occurring on 2 machines (these two machines are from the same department).
The line of code is:
if (mgr[k] == SystemUser().substr(1, SystemUser.length))
The error I get is "Object Required". I've also written a code to display a message of each value and found that the error is regarding the function SystemUser().
I need an idea to what might cause this error to show on those 2 machines. Is there a definition in the internet options that will block this function? Do I need to install something for it to be supported?
I'm inserting the SystemUser() code
function SystemUser(){
WShShell = new ActiveXObject("WScript.Network");
return WshShell.UserName;
}

Thanks to the comments, I realized that the problem was in accessing the function SystemUser(). The function was written in an external js file. Both users, using these machines, did not have permissions to read the js file.
Granting them read permission to the external script solved the problem.

Unusual javascript HTTP caching / undefined issues

Ok. I have never seen anything like this before and I am quite confused... On a website I am working on, there are two JavaScript includes. (Well, many more, but the problem occurs with only two). We'll call these A.js and B.js.
A.js defines a JavaScript singleton A. Likewise B.js defines a JavaScript singleton B. The B class depends on methods from A.
I have almost all my code wrapped up in try { ... } catch { ... } blocks, and on error, the system generates an AJAX request to email me the details of the error.
On one system here in my office (Firefox 3.0 for Mac) I am seeing the strangest behavior. Once in a while, maybe once every hour or two, but with no specific pattern, I get an error email from class B: "ReferenceError: A is undefined."
I have no idea why/how A would be undefined sometimes. When I look in the apache logs, during the times I receive the error, the client is requesting /A.js, before requesting /B.js, and the server is responding with a 304 (Not Modified)
I somehow suspect the issue is that the file has expired from the client cache however the server doesnt send the file thus it is never executed and A is undefined. But that's just a guess and I don't understand why that would happen. And if I am guessing right, how do I fix it???
If it matters, mod_disk_cache was enabled on the server, and I have disabled it to see if that was causing the problem. If so, maybe this belongs on ServerFault...
Any suggestions very welcome!!

If you have the Webdevelopers toolbar installed in Firefox, activate "Disable Cache" it helps a lot on debugging.

start calling the first js function after! the page has loaded, do this by <body onload="startmyfunction()"> or similar.