Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I mark a parameter as containing a DOM node in JSDoc?

I want to indicate that a parameter should be a DOM node, but I can't seem to find any information about how to indicate that with JSDoc. I could just use {Object}, but that is rather ugly. I would much rather have something like {Node} or {DOMNode}, but I can't find any examples to point me in that direction.

So, how do I mark a parameter as expecting a DOM node?

like image 521
cdeszaq Avatar asked Jan 31 '14 20:01

cdeszaq


People also ask

What is the JSDoc keyword to specify an argument to a function?

The @param tag provides the name, type, and description of a function parameter. The @param tag requires you to specify the name of the parameter you are documenting.

How do I add a node to a DOM?

Inserting Nodes into the DOM The methods appendChild() and insertBefore() are used to add items to the beginning, middle, or end of a parent element, and replaceChild() is used to replace an old node with a new node.

What are considered as nodes in DOM?

Nodes are in the DOM aka Document Object model. In the DOM, all parts of the document, such as elements, attributes, text, etc. are organized in a hierarchical tree-like structure; consisting of parents and children. These individual parts of the document are known as nodes.

How do you write comments in JSDoc?

JSDoc comments should generally be placed immediately before the code being documented. Each comment must start with a /** sequence in order to be recognized by the JSDoc parser. Comments beginning with /* , /*** , or more than 3 stars will be ignored.


2 Answers

From jsdoc.app for the @type annotation:

A type expression can include the JSDoc namepath to a symbol (for example, myNamespace.MyClass); a built-in JavaScript type (for example, string); or a combination of these. You can use any Google Closure Compiler type expression, as well as several other formats that are specific to JSDoc.

[...]

Each type is specified by providing a type expression, using one of the formats described below. Where appropriate, JSDoc will automatically create links to the documentation for other symbols. For example, @type {MyClass} will link to the MyClass documentation if that symbol has been documented.

So you can link to symbols. HTMLElement (and inheriting objects like HTMLImageElement) are symbols. Therefore, if you follow the spec, you should be allowed to do:

@type {HTMLElement} 

to indicate that the type of something is an HTMLElement (i.e. a DOM node).

My guess as to why this isn't explicitly documented is because the DOM node objects aren't JavaScript built-ins (e.g. String or Number). They are added by the client browser, so they are technically like any other symbol that you and I could make (being implemented with native browser code aside), as far as the JS language spec is concerned.

While we haven't gotten to the stage of actually compiling our documentation (that's a separate story), which would confirm if the above is truly accepted by JSDoc, this is how we interpret and follow this particular concept where I work, and our standard IDE (IntelliJ) accepts it.

like image 75
ajp15243 Avatar answered Sep 19 '22 07:09

ajp15243


If you want something the user can click on, and possibly follow a link to documentation, you can use @external:

/**  * A node in the DOM tree.  *  * @external Node  * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Node Node}  */  /**  * @param {external:Node} node  */ function foo(node) { } 

I don't bother with this and just mark such parameters with {Node}. All my code is in modules so the types that I define all begin with module:. So even if I had a class named Node, it would appear as module:foo~Node if it is defined in foo.

like image 21
Louis Avatar answered Sep 21 '22 07:09

Louis