Is there a way to identify which JS is overwriting window.console? - javascript

I'm trying to troubleshoot a page with lots of JS, including ads, and something is causing window.console to be replaced which suppresses the typical console logging output that I would want to see.
Is there a way to identify which JS is overwriting window.console? Maybe trigger a breakpoint only when typeof(window.console) is modified?

Great question! And I think I can help.
Use Object.defineProperty https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
to recreacte .log property.
Smth like this:
Object.defineProperty(console, "log", {
set: function () { throw 'Hoh!' }
});
console.log = 'abc';

Related

Avoid declaring large object in getDefaultProps prior to an event

The title might not be the best way to describe the problem, but I was wondering if there was a better practice to declaring an object in getDefaultProps?
In my render method I call several keys from from a prop/state that get updated on a click event i.e. this.props.player.name. The problem is that on page load this.props.player is blank and calling .name errors out. I know I can do something like ...
getDefaultProps: function() {
return {
player: {
name: null,
team: null
position: null
}
};
}
but it doesn't feel right. I was hoping there might be something similar to how Ruby does .try() where it won't try to call a method on a undefined prop.
The problem is specifically that this.props.player is undefined, if you define an empty object it will prevent the error from occurring. It's not bad practice to stub out the keys you're anticipating, but setting the default value to {} will be enough to prevent it from throwing.
You can create your data from ImmutableJS. Then you can get any part of your data like this:
this.state.getIn(['player', 'name', ...])
or
this.state.get('player')
This will not throw error even player is not defined or other, it will return undefined (or null) I don't remember
The update and updateIn work the same
see the doc here
I'd like to add this vanilla JS solution too - var x = (user || {}).name;
Source

How do I log everything with sentry/raven-js

I'm working on an existing project, with a lot of webpages. My task is to introduce logging og client script errors, usingsentr/raven-js.
In the docs, it says that i need to wrap the functions that I need to track in try/catch blocks - this is familiar to me, since I usually work in C#. But I don't wat to edit alle pages to wrap ALL javascript functions in try/catch. Is there a way to log ALL errors?
I tried something with window.onError = Raven.process, but I didn't get any logentries.
Can someone show me a what I'm missing? My setup is this:
var options = {
logger: 'my-test-logger',
whitelistUrls: [
/localhost/,
/localhost:2109/
]
};
Raven.config('https://<public-key-removed>#app.getsentry.com/<project-key-removed>', options).install();
window.onerror = Raven.process;
My setup was correct, except for the line:
window.onerror = Raven.process
For some reason I couldn't provoke any error to fire the logging event, but once I managed to simulate a real error, the logging worked just fine. The line:
Raven.config('https://#app.getsentry.com/', options).install();
does catch all errors.
It is important to realize that raven does not capture errors you trigger with the console. You need to put some error generating code directly in the page, or do something like this from the console:
window.setTimeout(function(){ foo() });
Also, i think that doing:
window.onerror = Raven.process
Is unnecessary, Raven already does that for you, in a much more advanced way.
Try the following code to disable logs from raven.js
Raven.config('your dsn', {
autoBreadcrumbs: {
console: false
}
});
Raven will from version 1 log all window.onerror errors by default.
See https://raven-js.readthedocs.org/en/latest/config/index.html#collectwindowerrors

jQuery: How can I get around using an if statement to get rid of "undefined" errors

When using third-party plugins, I typically initialize them in my main application.js file.
Example:
$('.scroll').jScrollPane();
The problem is if a page loads that doesn't have the scroll class, then I get:
TypeError: Result of expression '$('.scroll').jScrollPane' [undefined] is not a function.
So to get around this, I wrap it in:
if ($(".scroll").length){
$('.scroll').jScrollPane();
}
That remedies the problem but just seems like a hack.
Is there a "correct" way to solve this?
If you're getting:
ScrollPane' [undefined] is not a function.
...it wouldn't be because the page doesn't have a .scroll element.
That sort of error occurs when the plugin (or jQuery itself) isn't loaded.
If you're reusing some code on several pages, some of which don't have that plugin, do this instead:
if ( $.fn.jScrollPane ){
$('.scroll').jScrollPane();
}
you can use try/catch blocks...
try
{
$('.scroll').jScrollPane();
}
catch(err)
{
//Handle or ignore errors here
}
Uhh ... no; jQuery doesn't work like that. A call to $("any selector") will always give you back a ready-to-use (but empty) jQuery object. I don't think that's really your problem. Can you describe more about what your page is doing?
if ($('.scroll').jScrollPane()){
$('.scroll').jScrollPane();
}
this error is prob just because an addon failed loading
As a couple others have said, that error is the jScroll's error. If it's because an element doesnt exist jQuery will return an empty array.
Its because the plugin isn't loaded. jScroll is the plugin to change the scrollbars, correct? I've had numerous issues with it. I suggest wrapping it in a
$(window).load(function(){
//Call it here
})
This fixed all the issues i had with it.

Common idiom to avoid IE throw: Error: 'console' is undefined

I've installed firebug and I wrote all these log statements.
I've tested my app in IE and of course I've got "undefined" error.
What's the common idiom to avoid this.
I don't really feel like commenting all the console.log statements in my file nor to mock them.
Well I'm not sure what to do.
i usually make a wrapper function like so:
function log(obj) {
if (window.console && console.log) console.log(obj);
}
or you could do something like this at the beginning of your script file/element:
if (!window.console) {
window.console = {
log: function(obj){ /* define own logging function here, or leave empty */ }
};
}
Paul Irish has a better wrapper for console.log().
http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
This allows multiple arguments, and provides a history (for debugging) in case no console is there or (eg Firebug Lite) the console is created later.

What triggers "Object cannot be created in this context, Code: 9" in Firefox?

We see this occasionally in web apps on Firefox. What triggers it, and how do we prevent it? It seems to happen sporadically and the error message yields no useful information about line locations.
A quick google search yielded this:
http://blowery.org/2008/02/28/object-cannot-be-created-in-this-context-code-9/
...check your code to see if you’re
trying to grab a reference to the
computed style on a null reference.
It appears to be connected with the Dojo framework.
Edit: Ha. Sorry I gave you your own blog as an answer. I guess I don't completely understand what you're asking for. If you want to avoid the error, you could use object checking before running the applicable code.
function isValidObject(someObject)
{
return typeof someObject != null;
}
var obj1 = "Hello World";
if(isValidObject(obj1))
{
//This code will run
}
if(isValidObject(ob2))
{
//This code will not run
}
Hope that's helpful.

Categories

Resources