google-apps-scriptidejsdoc

How to type hint Google Types in Google Scripts?


I am trying to typehint a bunch of javascript in Google Script, and I have gotten as far as trying this:

/**
 *  Get (named) range given by name
 *
 *  @param {String} name 
 *  @return {Range}
 *
 */
function getRange(name) {
  return SpreadsheetApp.getActiveSpreadsheet().getRangeByName(name);
}

Which displays well and gives the same typehint as the builtin getRangeByName, however it does not actually work, i.e. the auto-complete script editor does not autocomplete when I type something like getRange("hello").get", like it should. Should I be name spacing the Range or am I doing something else wrong?


Solution

  • Tl;Dr: As of April 3, 2025 it's possible to use the JSDoc tags @param, @type, @typedef and @property to add type hints for function parameters and variables.

    Example: Parameters / @param JSDoc tag

    /**
     * @param {SpreadsheetApp.Sheet} sheet
     */
    function doSomething(sheet){
       s
    
    }
    

    When typing s inside the doSomething function block, the autocomplete will open, showing a wrench tool icon on the left of sheet and (parameter): SpreadsheetApp.Sheet on the right as shown below

    type hint snapshot - parameter

    Example: Variables / @type JSDoc tag

    When typing s after the variable declaration the autocomplete will open, showing a wrench tool icon on the left of sheet and const sheet: SpreadsheetApp.Sheet on the right as shown below

    type hint snapshot - variable

    Example: Custom type / @typedef and @property JSDoc tag

    /**
     * On edit event object
     * 
     * @typedef {Object} OnEditEvent
     * @property {SpreadsheetApp.Spreadsheet} e.source
     */
    
    /**
     * @param {OnEditEvent} e
     */
    function doSomething(e) {
    
      const sheet = e.
    
    }
    

    When typing e. inside doSomething function code block the autocomplete will open, showing a cube icon on the left of sheet and property source: SpreadsheetApp.Spreads... on the right as shown below

    Example Custom Class

    /**
     * My Custom Class
     */
    class MyClass {
      constructor(){
    
      }
    
      myMethod() {
    
      }
    }
    
    
    function doSomething(){
      const a = new MyClass();
      a.
    
    }
    

    When typing the variable name holding the class instance, followed by a dot, the autocomplete will open, showing a three icon on the left of the class name and (method) followed by the class dot method name on the right as shown below

    enter image description here


    As of October 27th, 2020, the Google Apps Script IDE didn't use local JSDOC to extend the autocomplete feature. Options:

    1. Create a Goole Apps Script library and attach it to your project
    2. Use another IDE

    Regarding using another IDE at this time there is a tool called CLASP that helps to download/upload script which make it possible to use other IDEs.

    Resources

    Related

    Other related