Stack traces getting swallowed when developing VS Code Extensions - javascript

When my extension encounters an error, I'll often get a notification in the host environment saying that it encountered an error, but nothing gets printed to the debug console in the workspace of my extension. If I know the bug must be occurring in a given function, I can wrap all that function's code in a try-catch and then simply console.log the error in the catch statement. But that's a frustrating way to debug.
I'm pretty certain this is resulting from uncaught errors in promises, but I don't want to have to manually try catching ever one.
Any ideas on how to make sure I always get a stack trace?

Related

JavaScript errors does not show in the console

I'm developing a js game and I debug it using Chrome DevTools.
Recently I noticed that some errors are not reported to the console even though they freeze the code execution.
The only way I can debug those errors is running row by row until I see the error while hovering over the problematic variable. (for ex. trying to read a property of an 'undefined' variable (TypeError))
If it matters I use 'use strict' as well.
Update: I noticed that if I check 'Pause on caught exceptions' the code will stop on the error. What can cause such error to be caught without using a trycatch around it?
Thank you

PDF.js HTA, promise being rejected

I'm trying to develop an HTA for extracting and processing the data from PDF files for a number of people in a large office. I've been looking into using the PDF.js package for this, but I've not been able to get it working.
I've forked the project and created an HTA version of the helloworld example with the compatibility.js file included. I can get an HTML version of this working on Firefox and IE11 through a gulp server, but the HTA doesn't give any output - no text, no error messages.
After peppering the source files with alert() statements, I've discovered that the original hello.js file is missing promise reject function, and that this fires when added, but here where my I meet the limits of my knowledge. I don't really know an awful lot about promises, so I don't understand why this one fails. Is this solvable or does it mean that the package simply won't run in an HTA?
EDIT:
I've been looking more into this and the failure doesn't make sense.
Tracing the logic through, the hello.js file calls the function api.getDocument from api.js. Following this back, there is only one return statement and the alert statement just before this line is running. However the fulfilled function is not triggering.
From my very limited understanding, the failure clause on a promise will be triggered from a throw() statement within the asynchronous operation. If that is the case then I would expect that operation to immediately cease and the reject function to trigger, but why would the line immediately before the return statement still run?
I did pursue one theory that this line from api.js was the one throwing the error:
}).catch(task._capability.reject);
To check this, I added an alert statement to the reject() function statement in util.js, but it did not trigger, so I can't tell where the error is coming from.
Is anyone able to give me any additional pointers to help me trace this down?
Solved!
By changing the compatibility setting to IE10 instead of IE9 (which I didn't know I could do) I got a more useful error in the right place. Looking more into this, this issue appears to be a duplicate of this one:
Access denied in IE 10 and 11 when ajax target is localhost

How can I get line numbers from require.js errors?

This has been bothering me for a while but I haven't been able to find a solution. When I have an error in one of my scripts, such as a syntax error, Chrome's console does not give me a very useful error message.
For example, in a simple script called example.js I am calling a function called whatever() which does not exist:
define(function(require){
'use strict';
whatever();
});
My console error in Chrome states:
ReferenceError: whatever is not defined(…) require.js:901
I expect the ReferenceError but line 901 of require.js is just some code responsible for throwing errors. Furthermore, the stack trace doesn't show anything useful; it also only references lines in require.js. I noticed that Firefox's inspector does show the actual location of the problem in the stack trace, which is helpful but I prefer to develop in Chrome.
Is there a way to make console errors point to the line number and file where the problem actually is? I would rather see:
ReferenceError: whatever is not defined(…) example.js:4
I've seen this question and others like it that sound similar but I haven't found any that apply to this exact situation, or code that works with requirejs to fix this issue. Maybe I can modify requirejs.onError somehow?
Did you try to append
//# sourceURL=example.js
at the end of your evaluated script? Debuggers will understand that code as originating from example.js file rather then from the script it was evaluated in.
You sure that Require.JS does not support it out of the box? I posted on GitHub my own "Javascript DNA" asynchronous loader/dependency resolver that does it automatically and it was very easy so I guess require.js will have something similar already...

Debugging Ember JS -- Identifying line in code that causes an error

So I'm getting the following error:
Uncaught Error: Assertion Failed: The key provided to get must be a string, you passed undefined
Should be easy enough to fix, if there was any indication of the line in my code that causes that error.
Using the chrome console, I click on ember.debug.js:6254 next to the error, which just shows me the ember code that throws the error. I can expand the error, but I just get a bunch of functions that can't be clicked on and no indication where they come from.
Can someone please help me figure out how to identify the line in my Ember code that is causing the error.
I've gotten this error before. It happens when you call get() in any of its forms (Ember.get() or this.get() or get(this)) without a string as the name of the property you want to retrieve.
You should be able to find the source of the error by auditing your application for wherever you call get() and making sure you pass the property name as a string. E.g., Ember.get('model.someProp') or this.get('someProp') or get(this, 'someProp').
This should be a comment but I can't, so here goes:
Iam new to Ember and have been spending quite a long time debugging. Remember that long stack of function calls that chrome's console shows.
Look for anything other than ember.debug.js...especially those marked (anonymous function) and files with names vendor.js or app-name.js
Usually in software development when debugging your best friends are going to be console.log() or alert() (in the case of JavaScript). Usually you have to figure out if your getting what ever is that you passing to your function by consolelog everything until you find your bug. Ember sometimes will not tell you what is exactly the error because does not know where exactly is coming from.
...computers are annoying but we love them....
here are some articles from Mozilla developer and Google on how to debug JavaScript.
I had a NULL value in my database which I wasn't accounting for in my app. In my case, it shouldn't have been NULL in the first place, so after giving the record a value in my database the problem disappeared.
I agree the error message is not very helpful.

How to get Chrome debugger to break or error when working on undefined variables

My Javascript code (hundreds of lines) hangs Chrome and when I debug the issue I find out that a variable was undefined. I don't get errors in the console. So this is making my debugging more time consuming because there are no errors or exceptions or anything that tells me where the issue is.
I don't want to add debugging code. Is there a way to make the debugger put out an error, break in the debugger or give an exception or show anything useful for the developer when hitting an undefined variable during runtime? It doesn't have to be for Chrome only.
You can break into the DevTools debugger when a JavaScript error occurs using the Pause on JavaScript Exceptions feature. It has two active modes; pause on all exceptions, and pause on uncaught exceptions.
Based on the description of your experience, the application you are working on may have errors that are caught but not re-thrown or logged. Using the "Pause on All Exceptions" (blue colored pause icon), will help in this scenario.
Note: some libraries, like jQuery, catch exceptions and do not re-throw them. If you have this experience, you may need to advance past these exceptions or set the "Pause on All Exceptions" feature after all dependencies have loaded.
window.onerror = function() { debugger; }

Categories