How To Use JSDOC3 To Document Enum Constants

Question

We're using JSDOC to document our client-facing SDK and we're having difficult getting it to recognize our 'enums' (i.e. constants). Which tags should we use to get JSDOC to pick it up in the documentation? Here's a sample:

/**
* @module Enum
*/
export namespace {

    /**
    * @enum WidgetType {string}
    */
    Enum.WidgetType = {
        /** Dashboard */
        Dashboard: 'dashboard',
        /** Form */
        Form: 'entityeditform',
        /** Report */
        Report: 'report'
    };
}

Here's how the 'enums' are used in code:

app.widget({ id: 'account_entityform', type: Enum.WidgetType.Form }).add();

How can we document this with JSDOC?

Murdock

Answer 1

After reviewing this article on StackOverflow I was able to get this working using the following:

    /**
    * @typedef FieldType
    * @property {string} Text "text"
    * @property {string} Date "date"
    * @property {string} DateTime "datetime"
    * @property {string} Number "number"
    * @property {string} Currency "currency"
    * @property {string} CheckBox "checkbox"
    * @property {string} ComboBox "combobox"
    * @property {string} Dropdownlist "dropdownlist"
    * @property {string} Label "label"
    * @property {string} TextArea "textarea"
    * @property {string} JsonEditor "jsoneditor"
    * @property {string} NoteEditor "noteeditor"
    * @property {string} ScriptEditor "scripteditor"
    * @property {string} SqlEditor "sqleditor"
    */

Murdock

it is a bit unclear, as your answer does not correspond to the code snippet in the original question – Cloaca

@ASA2 I'm currently facing the same problem; however, I didn't get your example. Could you elaborate a little and provide a full example? That would be very kind. – Stepfather

Answer 2

I see that there are comments to this old post asking for more clarification. I just figured it out from the above and can share, as an example, what I came up with. People landing on this page searching for the same thing might find this useful.

/**
 * The color of a piece or square.
 * @readonly
 * @enum {number}
 * @property {number} WHITE color for a white square or piece.
 * @property {number} BLACK color for a black square or piece.
 */
export const Color = { WHITE: 0, BLACK: 1 }

/** 
 * Each member is an enumeration of direction offsets used to index into the 
 * lists of horzontal, vertical, and diagonal squares radiating from a
 * given Square object. Only useful internally for initialization or externally
 * for test.
 * @package
 * @type {object}
 * @readonly
 * @property {enum} Cross an enumeration of vert and horiz directions.
 * @property {number} Cross.NORTH north
 * @property {number} Cross.EAST  east
 * @property {number} Cross.SOUTH south
 * @property {number} Cross.WEST  west
 * @property {enum} Diagonal an enumeration of diagonal directions.
 * @property {number} Diagonal.NORTHEAST northeast
 * @property {number} Diagonal.SOUTHEAST southeast
 * @property {number} Diagonal.SOUTHWEST southwest
 * @property {number} Diagonal.NORTHWEST northwest
 */
const Direction = {
    Cross: { 
        NORTH: 0, EAST: 1, SOUTH: 2, WEST: 3 
    },
    Diagonal: { 
        NORTHEAST: 0, SOUTHEAST: 1, SOUTHWEST: 2, NORTHWEST: 3 
    },
}

Cystic

Readonly does not work like that, you have to append it to each property inside the object unfortunately. – Livingstone

I noticed some inconsistent support for the above format among the JS doc oriented tools. So it may work for some and not for others @Livingstone – Cystic