HTML5 canvas intellisense in Visual Studio Code

Question

is there a way to get intellisense for the HTML5 canvas element? In VS Code 0.7.10 when I write in my JS code this:

context = document.getElementById(canvasId).getContext('2d'); 

then when I write

context.  

I do not have any intellisense help for my context.

Thanks.

Answer 1

VS Code can support it!

Just tell VS Code what type is the context. Adding the following code on your variable then the VS Code will know what it is. Sorry that I don't have enough point to post the image. Just click the solution to see how it works.

/** @type {CanvasRenderingContext2D} */

solution

Answer 2

That's currently not supported by VS Code and it is hard to fix. Because JavaScript lacks type annotations, VS Code tries to flow types as good as possible. In your example document.getElementById breaks this flow because from the spec it can return any html element (and we have no further knowledge of the html structure or the value of canvasId).

Something like this, would be more favourable to VS Code:

var canvas = document.createElement('canvas'); canvas.|

Alternative, you could look into using TypeScript because there you use type annotations and type casting.