runem / web-component-analyzer

CLI that analyzes web components and emits documentation
https://runem.github.io/web-component-analyzer
MIT License
501 stars 61 forks source link

Boolean attributes #199

Open FluorescentHallucinogen opened 3 years ago

FluorescentHallucinogen commented 3 years ago

I'm writing a vanilla native web component, not using TypeScript and any web component libraries like LitElement, etc.

My web component has a supported property and a corresponding HTML element attribute with the same name:

/**
 * @attribute supported
 * @property supported
 * @type {?boolean}
 * @readonly
 */
this.supported;

Is this JSDoc annotation correct?

Does web-component-analyzer support @readonly?

I need that @type and @readonly will be applied to both the property and the attribute, not to only the property.

Technically, HTML element attributes are always strings (complex data like arrays and objects should be serialized as JSON strings). But as an author, I know the original type. What type should I declare for attributes in JSDoc (actual or original)?

Moreover, since my attribute is boolean, if the corresponding property is true, the attribute is present in the HTML markup:

<my-component supported><my-component>

but does the supported attribute has a value in this case? If so, which one? What type is it?

If the corresponding property is false, the attribute is just missing in the HTML markup:

<my-component><my-component>

but does the supported attribute has a value in this case? If so, which one? What type is it?

FluorescentHallucinogen commented 3 years ago

@runem @bennypowers @daKmoR @justinfagnani @thepassle @robdodson @adriengibrat PTAL.

bennypowers commented 3 years ago

IIRC

/**
 * @attr {Boolean} supported
 */

https://github.com/runem/web-component-analyzer#-how-to-document-your-components-using-jsdoc

web-padawan commented 3 years ago

First of all, I don't think it's a good idea to tag so much of people (mostly unrelated to this project) during the weekend 🙁

When in doubt, please check with the tests, this project has a bunch of those including this one:

https://github.com/runem/web-component-analyzer/blob/bd0cff338b12a61a1de26d30618eae73ff3228d1/test/flavors/jsdoc/member-test.ts#L83-L89