Facebook like button in site that uses post message spams console - javascript

I have a site that uses a lot of postMessage communication between iframes. Putting a Facebook like button in my site causes my debug console to get spammed with messages like
Received message of type object from [domain], expected a string.
This makes development very difficult. Is there any way to prevent this extra logging from occurring? I am new to using facebooks apis so I'm hoping I'm just missing something simple. They can't possibly assume that no one besides them will ever use postmessage.
Thanks!

Actually, disabling console.log is a horrible answer. What if we want to use console.log, but just want to stop the spamming error message? What is causing it? How do we actually fix it?

Actually that's not an extra logging. It's from the Facebook SDK. Simply you can uglify the sdk for removing all console from the library.
1.Download the sdk. https://connect.facebook.net/en_US/sdk.js
2.Uglify it for removing console logging (production version.)
https://github.com/mishoo/UglifyJS
3.Use it in your site.
Another link which may help you:
http://elijahmanor.com/grunt-away-those-pesky-console-log-statements/

You could simply "unset" the console.log function, by doing something like:
console.log = function(){}
Save it in another variable first, for example:
var originalLog = console.log;
Now when the Facebook API tries to use the log function nothing will happen. If you need to use the log function, just enable it first by setting it back to your saved originalLog variable and unset it when you are done using it. Unhandled errors will still show up in your console, regardless of what you have done to the log function.

In my case this was caused by the FVD Video Downloader extension, so maybe you should disable all browser extensions and see if that solves the issue, then enable them back one by one to find the culprit.

Related

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.

How do I test that Sentry is reporting errors?

I just installed Sentry for a client-side JavaScript app using the standard code snippet they provided. How do I test that it's working properly? I've tried manually throwing an error from my browser console and it didn't appear in Sentry. Is there any documentation on the right way to do this?
Verify (newer)
myUndefinedFunction();
Verifying Your Setup (older)
Sentry.captureException(new Error("This is my fake error message"));
https://docs.sentry.io/platforms/javascript/?platform=browser#verifying-your-setup
May be worth double-checking your setup (or updating) and config too.
The browser console can not be used as it is sandboxed. A simple trick is to attach the code to an HTML element like this:
<h1 onClick="throw new Error('Test')">
My Website
</h1>
And click on the heading afterwards.
This can be done in the browser inspector and so your source code doesn't have to be modified.
One way to generate an error in Sentry is to call a function that is not defined.
Note: This cannot be done in the console - it must be in the code.
Try adding this to your code (taken from the docs):
myUndefinedFunction();
If your code build doesn't allow this due to tests/linting you might be able to use:
window.myUndefinedFunction()
You should then see error in your browser console and in the Sentry dashboard.
Have a read of the Docs for more info.
Raven.captureMessage('Broken!') is a good place to start (also pulled from Sentry docs). If that fails to send, the Raven client isn't being initiated.
If you can't or don't want to use an undefined function to test Sentry is sending errors, you can also use the Debugger in Chrome's DevTools by:
Adding a breakpoint in your code e.g. for a click event handler
Trigger that event e.g. click a button
When the breakpoint hits in the console, set a function/variable that is needed for execution to undefined
Press play/continue in DevTools to then see the Error output
e.g.
1: function onClick() {
2: api.sendSomeEvent();
3: }
Add a breakpoint in the body of the onClick event handler (Line 2), trigger the event. When execution is paused: in your console enter something like api = undefined and hit enter to update the state. Then continue execution (click the play button), where you should see an error (ala api is undefined) that Sentry should then send for you.
Note: this works for any environment, though you may need to be clever with finding your events in minified code ;)

Trying to use nsIPrefBranch to store data on Firefox extension gives NS_ERROR_UNEXPECTED

I'm trying to save a small amount of persistent data in a Firefox extension.
So, I'm trying to use nsIPrefBranch like this:
var db = Components.classes["#mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch);
if(db.getCharPref('epoch')){ ///do something.. }
but it doesn't seem to work and I'm getting this error:
"Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED)
[nsIPrefBranch.getCharPref]"
Can somebody please tell what I'm doing wrong?
There is no preference called "epoch" - that's what this message is telling you. You have to set this preference before you can expect getCharPref() to succeed. Which is why extensions usually wrap calls to nsIPrefBranch into try .. catch blocks - errors are expected.
On a different note: preferences are a shared space (have a look at them under about:config). You should make clear that a preference belongs to your extension and make sure it won't conflict with preferences of other extensions or the browser. In other words, use something like "extensions.myExtension.epoch" rather than "epoch".

console.log doesn't print the message to the firebug console?

I am facing this weird problem. The WebApp I'm debugging right now, is invoking the javascript console.log/console.log/error/debug/etc., the Firebug console however, doesn't print them at all.
This application uses Dojo/Dijit toolkit. Not sure if there is anything special about it
It doesn't appear to be a problem with the Browser, I tried another simple web-page with a console.debug call, and the message appears on the console as expected.
Please advise about what should I look for. I have also tried Chrome/IE.
Thanks in Advance/
console is not write protected, it can be replaced with anything. You could try
alert(console.log.toString());
to find out what console.log really is
Edit:
A better method would be
var originalConsole = console;
// now include your library
// ...
originalConsole.log(console.log);
In Firebug, clicking on the function takes you directly to its definition.
did you try window.console.log()? Maybe you are not in window scope
In case like this do not forget to check if "Logging" is enabled or active at your console of browser.
Just to update this question -:
Ensure that firebug is Enabled - - > On for all Web Pages.
Reload the application.
Then in the firebug panel - - > Console - - > All.
All the console.log messages will appear.

Crm 2011 with no javascript customizations gives onload errors

we are getting the following error in almost all create or edit entity forms. the systems is not customized at all and it works perfectly:
There was an error in the fields customized event.
field:window
event:onload
error:object doesn't support this property or method
after debugging the error I found out that it is happening in FormScript.js.aspx page in the following code block:
var eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,null);
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,eContext)
Mscrm.Form_onload();
Mscrm.Form_onload() is what causing the error to happen.
do you have any idea why is this happening?
It was a server side problem. I don't know exactly why it happens. we also tried to do an installation repair but that didn't solve it. Finally, we installed a fresh CRM 2011 copy on a new server, imported the database and ran Data migration manager. and the error disappeared.
Are you absolutely positive there is no script attached to run on load of any of the entities that are having issues? That particular function should just run any custom script you have on the entity, so I don't see any other cause.
Odd, there is certainly some garbage in there somewhere
function crmForm_window_onload_handler(eventObj,eventArgs){
try{
var eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,null);
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,0,null,eContext)
loadInsideView();
eContext=Mscrm.FormUtility.constructExecutionObject(eventObj,1,null,eContext)
CEI.Initialize();
} catch(e) {
displayError('window', 'onload', e.description);
}
}
Here is one from our system on the account form. I have no idea how this could have happened, but I would check the events for the page (not just the onload). I would also try adding a JavaScript web resource with a generic event to the onload to see if by toggling it on, the system might clean itself up. You may have to call Microsoft or find the issue in your 4.0 and fix it to do another re-install. I feel for you on this one!

Categories

Resources