JSUtils modification to handle es6 constructs (#13635)

swmitra · saurabh95 · commit 92819092bd54 · 2017-08-28T10:31:42.000+05:30
* JSUtils modification to handle es6 constructs

* Addressed review comments and added es6 test cases

* Address Code review comments and add support for ArrowFunctionExpressions with new test case

* Update comments

* Refactor to remove extra variables
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -140,6 +140,14 @@ module.exports = function (grunt) {
                         src: [
                             'less/dist/less.min.js'
                         ]
+                    },
+                    {
+                        expand: true,
+                        dest: 'src/thirdparty/acorn',
+                        cwd: 'src/node_modules/acorn',
+                        src: [
+                            'dist/{,*/}*'
+                        ]
                     }
                 ]
             }
diff --git a/src/extensions/default/QuickOpenJavaScript/main.js b/src/extensions/default/QuickOpenJavaScript/main.js
@@ -65,9 +65,7 @@ define(function (require, exports, module) {
         var lines = docText.split("\n");
         var functions = JSUtils.findAllMatchingFunctionsInText(docText, "*");
         functions.forEach(function (funcEntry) {
-            var chFrom = lines[funcEntry.lineStart].indexOf(funcEntry.name);
-            var chTo = chFrom + funcEntry.name.length;
-            functionList.push(new FileLocation(null, funcEntry.lineStart, chFrom, chTo, funcEntry.name));
+            functionList.push(new FileLocation(null, funcEntry.nameLineStart, funcEntry.columnStart, funcEntry.columnEnd, funcEntry.label || funcEntry.name));
         });
         return functionList;
     }
diff --git a/src/language/JSUtils.js b/src/language/JSUtils.js
@@ -21,15 +21,16 @@
  *
  */
 
-/*jslint regexp: true */
-
 /**
  * Set of utilities for simple parsing of JS text.
  */
 define(function (require, exports, module) {
     "use strict";
 
-    var _ = require("thirdparty/lodash");
+    var _          = require("thirdparty/lodash"),
+        Acorn      = require("thirdparty/acorn/dist/acorn"),
+        AcornLoose = require("thirdparty/acorn/dist/acorn_loose"),
+        ASTWalker  = require("thirdparty/acorn/dist/walk");
 
     // Load brackets modules
     var CodeMirror              = require("thirdparty/CodeMirror/lib/codemirror"),
@@ -47,17 +48,6 @@ define(function (require, exports, module) {
      */
     var _changedDocumentTracker = new ChangedDocumentTracker();
 
-    /**
-     * Function matching regular expression. Recognizes the forms:
-     * "function functionName()", "functionName = function()", and
-     * "functionName: function()".
-     *
-     * Note: JavaScript identifier matching is not strictly to spec. This
-     * RegExp matches any sequence of characters that is not whitespace.
-     * @type {RegExp}
-     */
-    var _functionRegExp = /(function\s+([$_A-Za-z\u007F-\uFFFF][$_A-Za-z0-9\u007F-\uFFFF]*)\s*(\([^)]*\)))|(([$_A-Za-z\u007F-\uFFFF][$_A-Za-z0-9\u007F-\uFFFF]*)\s*[:=]\s*function\s*(\([^)]*\)))/g;
-
     /**
      * @private
      * Return an object mapping function name to offset info for all functions in the specified text.
@@ -66,21 +56,112 @@ define(function (require, exports, module) {
      * @return {Object.<string, Array.<{offsetStart: number, offsetEnd: number}>}
      */
     function _findAllFunctionsInText(text) {
-        var results = {},
+        var AST,
+            results = {},
             functionName,
+            resultNode,
+            memberPrefix,
             match;
-
+   
         PerfUtils.markStart(PerfUtils.JSUTILS_REGEXP);
-
-        while ((match = _functionRegExp.exec(text)) !== null) {
-            functionName = (match[2] || match[5]).trim();
-
+        
+        try {
+            AST = Acorn.parse(text, {locations: true});
+        } catch (e) {
+            AST = AcornLoose.parse_dammit(text, {locations: true});
+        }
+        
+        function _addResult(node, offset, prefix) {
+            memberPrefix = prefix ? prefix + " - " : "";
+            resultNode = node.id || node.key || node;
+            functionName = resultNode.name;
             if (!Array.isArray(results[functionName])) {
                 results[functionName] = [];
             }
 
-            results[functionName].push({offsetStart: match.index});
+            results[functionName].push(
+                {
+                    offsetStart: offset || node.start,
+                    label: memberPrefix ? memberPrefix + functionName : null,
+                    location: resultNode.loc
+                }
+            );
         }
+        
+        ASTWalker.simple(AST, {
+            /*
+                function <functionName> () {}
+            */
+            FunctionDeclaration: function (node) {
+                // As acorn_loose marks identifier names with '✖' under erroneous declarations
+                // we should have a check to discard such 'FunctionDeclaration' nodes
+                if (node.id.name !== '✖') {
+                    _addResult(node);
+                }
+            },
+            /*
+                class <className> () {}
+            */
+            ClassDeclaration: function (node) {
+                _addResult(node);
+                ASTWalker.simple(node, {
+                    /*
+                        class <className> () {
+                            <methodName> () {
+                            
+                            }
+                        }
+                    */
+                    MethodDefinition: function (methodNode) {
+                        _addResult(methodNode, methodNode.key.start, node.id.name);
+                    }
+                });
+            },
+            /*
+                var <functionName> = function () {} 
+                
+                or 
+                
+                var <functionName> = () => {}
+            */
+            VariableDeclarator: function (node) {
+                if (node.init && (node.init.type === "FunctionExpression" || node.init.type === "ArrowFunctionExpression")) {
+                    _addResult(node);
+                }
+            },
+            /*
+                SomeFunction.prototype.<functionName> = function () {}
+            */
+            AssignmentExpression: function (node) {
+                if (node.right && node.right.type === "FunctionExpression") {
+                    if (node.left && node.left.type === "MemberExpression" && node.left.property) {
+                        _addResult(node.left.property);
+                    }
+                }
+            },
+            /*
+                {
+                    <functionName>: function() {}
+                }
+            */
+            Property: function (node) {
+                if (node.value && node.value.type === "FunctionExpression") {
+                    if (node.key && node.key.type === "Identifier") {
+                        _addResult(node.key);
+                    }
+                }
+            },
+            /*
+                <functionName>: function() {}
+            */
+            LabeledStatement: function (node) {
+                if (node.body && node.body.type === "FunctionDeclaration") {
+                    if (node.label) {
+                        _addResult(node.label);
+                    }
+                }
+            }
+        });
 
         PerfUtils.addMeasurement(PerfUtils.JSUTILS_REGEXP);
 
@@ -415,8 +496,13 @@ define(function (require, exports, module) {
                     var endOffset = _getFunctionEndOffset(text, funcEntry.offsetStart);
                     result.push({
                         name: functionName,
+                        label: funcEntry.label,
                         lineStart: StringUtils.offsetToLineNum(lines, funcEntry.offsetStart),
-                        lineEnd: StringUtils.offsetToLineNum(lines, endOffset)
+                        lineEnd: StringUtils.offsetToLineNum(lines, endOffset),
+                        nameLineStart: funcEntry.location.start.line - 1,
+                        nameLineEnd: funcEntry.location.end.line - 1,
+                        columnStart: funcEntry.location.start.column,
+                        columnEnd: funcEntry.location.end.column
                     });
                 });
             }
diff --git a/src/npm-shrinkwrap.json b/src/npm-shrinkwrap.json
diff --git a/src/package.json b/src/package.json
@@ -1,6 +1,7 @@
 {
   "name": "brackets-src",
   "dependencies": {
+    "acorn": "5.1.1",
     "codemirror": "5.28.0",
     "less": "2.7.2"
   }
diff --git a/test/spec/JSUtils-test-files/es6-async-arrow.js b/test/spec/JSUtils-test-files/es6-async-arrow.js
@@ -0,0 +1,4 @@
+// Async fn def
+var foo = { async bar() {} };
+// ArrowExpression usage to define function
+var fooAgain = () => {};
diff --git a/test/spec/JSUtils-test-files/es6-classes.js b/test/spec/JSUtils-test-files/es6-classes.js
@@ -0,0 +1,10 @@
+class Shape {
+    constructor (id, x, y) {
+        this.id = id
+        this.move(x, y)
+    }
+    move (x, y) {
+        this.x = x
+        this.y = y
+    }
+}
diff --git a/test/spec/JSUtils-test-files/es6-getter-setter.js b/test/spec/JSUtils-test-files/es6-getter-setter.js
@@ -0,0 +1,11 @@
+class Rectangle {
+    constructor (width, height) {
+        this._width  = width
+        this._height = height
+    }
+    set width  (width)  { this._width = width               }
+    get width  ()       { return this._width                }
+    set height (height) { this._height = height             }
+    get height ()       { return this._height               }
+    get area   ()       { return this._width * this._height }
+}
diff --git a/test/spec/JSUtils-test-files/es6-inheritance.js b/test/spec/JSUtils-test-files/es6-inheritance.js
@@ -0,0 +1,13 @@
+class Rectangle extends Shape {
+    constructor (id, x, y, width, height) {
+        super(id, x, y)
+        this.width  = width
+        this.height = height
+    }
+}
+class Circle extends Shape {
+    constructor (id, x, y, radius) {
+        super(id, x, y)
+        this.radius = radius
+    }
+}
diff --git a/test/spec/JSUtils-test-files/es6-static-methods.js b/test/spec/JSUtils-test-files/es6-static-methods.js
@@ -0,0 +1,5 @@
+class Rectangle extends Shape {
+    static defaultRectangle () {
+        return new Rectangle("default", 0, 0, 100, 100)
+    }
+}
diff --git a/test/spec/JSUtils-test.js b/test/spec/JSUtils-test.js

Original file line number	Diff line number	Diff line change
`@@ -140,6 +140,14 @@ module.exports = function (grunt) {`
`140`	`140`	`src: [`
`141`	`141`	`'less/dist/less.min.js'`
`142`	`142`	`]`
	`143`	`+ },`
	`144`	`+ {`
	`145`	`+ expand: true,`
	`146`	`+ dest: 'src/thirdparty/acorn',`
	`147`	`+ cwd: 'src/node_modules/acorn',`
	`148`	`+ src: [`
	`149`	`+ 'dist/{,/}'`
	`150`	`+ ]`
`143`	`151`	`}`
`144`	`152`	`]`
`145`	`153`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "brackets-src",`
`3`	`3`	`"dependencies": {`
	`4`	`+ "acorn": "5.1.1",`
`4`	`5`	`"codemirror": "5.28.0",`
`5`	`6`	`"less": "2.7.2"`
`6`	`7`	`}`