Idea: Code Completion for JavaScript

In 2012, Kate had a GSoC project with the aim of adding a Scripting IDE plugin. The idea was to make it easy to write Kate Part scripts (command line scripts, indenters), that should include rudimentary code completion and a gui to manage available scripts. As detailed in the blog post, a rudimentary list that showed all available scripts is available. However, due to changes in Kate Part’s scripting framework (e.g. changes in the folder structure, require() function to load libraries), the plugin in its current form is not applicable anymore. Still, the idea of having a better JavaScript support is valid.

So this blog post is about some ideas how we can add possibly really cool JavaScript support to Kate as a plugin. This plugin should provide the following features:

  1. provide code completion
  2. support for loading additional modules (jQuery, Node.js, Prototype, Kate Scripting API, …)
  3. specialized support for Kate Part scripting
  4. outline in terms of a function and prototype browser

JavaScript Code Completion

Providing code completion to JavaScript requires a parser so we have an abstract syntax tree (AST) of the current file. This parser needs to be error-tolerant, since during the process of programming, the source code often violates the syntax. Searching the Web, relatively few information about such a parser exists. But one tiny parser shines: Esprima (source code, more info), written by KDE’s “very own” Ariya :-)

Esprima is a JavaScript parser written in JavaScript. It is (to some degree) error-tolerant and returns an AST as shown in the parse demo. The AST is returned in simple JSON syntax, meaning it can be easily parsed with either the JavaScript JSON functions or JSON in Qt5 (JSON for Qt4). Along the error-tolerant mode, the AST returned by Esprima also contains comments and line/column information, if desired.

Interestingly, the idea of using Esprima for code completion arose about a year ago, and meanwhile there are several projects that successfully use the Esprima AST: Eclipse Orion, a web-based IDE, uses Esprima for code completion and for the outline view (sources). The source code for the code completion is available in the orion client git module: lib, code completion (content assist), unit tests.

So What Next?

As it seems the code is all there, the next step would be to start a small standalone project and write a proof of concept to check whether this approach is feasible. I’d suggest to use Qt’s JavaScript interpreter (QtScript in Qt4, QJS in Qt5). In the long run, the goal would be to have code completion and possibly an outline view. If this works, more functionality like support for Kate Scripting could be added. So there is a lot to play around with.

If you are interested, just start working on it. It might be a good GSoC project (although we’d require a quite skilled developer here) :-P Thoughts? Comments?

See also