AST for HTML

• HTMLToken
• HTMLNode
• HTMLDocument
• HTMLDocumentFragment
• HTMLDocumentType
• HTMLComment
• HTMLText
• HTMLElement
• HTMLStartTag
• HTMLAttribute
• HTMLEndTag

You can use the type definition of this AST:

export function create(context) {
    const microTemplateService = sourceCode.parserServices.getMicroTemplateService()
    return {
        "Program:exit"() {
            microTemplateService.traverseDocumentNodes({
                HTMLElement(node: HTMLElement): void {
                    // ...
                },
                HTMLText(node: HTMLText): void {
                    // ...
                },
                HTMLComment(node: HTMLComment): void {
                    // ...
                },
            })
        },
    }
}

See details: https://github.com/ota-meshi/eslint-plugin-lodash-template/blob/master/lib/ast/html-nodes.js

HTMLToken

extend interface HTMLToken {
    range: [ number ],
    htmlValue: string,
    value: string,
}

• The range property is an array which has 2 integers. The 1st integer is the offset of the start location of the node. The 2nd integer is the offset of the end location of the node.

HTMLNode

extend interface HTMLNode {
    range: [ number ]
}

• The range property is an array which has 2 integers. The 1st integer is the offset of the start location of the node. The 2nd integer is the offset of the end location of the node.

HTMLDocument

interface HTMLDocument <: HTMLNode {
    type: "HTMLDocument",
    children: [ HTMLElement | HTMLText | HTMLComment ]
}

• This is a HTML Document.

HTMLDocumentFragment

interface HTMLDocumentFragment <: HTMLNode  {
    type: "HTMLDocumentFragment",
    children: [ HTMLElement | HTMLText | HTMLComment ]
}

• This is a HTML DocumentFragment.

HTMLDocumentType

interface HTMLDocumentType <: HTMLNode  {
    type: "HTMLDocumentType",
    name: string,
    publicId: string,
    systemId: string
}

• This is a HTML Document Type.

HTMLComment

interface HTMLComment <: HTMLNode  {
    type: "HTMLComment",
    value: string,
    commentOpen: HTMLToken | null,
    commentClose: HTMLToken | null,
}

• This is a HTML comment node.

HTMLText

interface HTMLText <: HTMLNode  {
    type: "HTMLText",
    value: string
}

• This is a HTML text node.

HTMLElement

interface HTMLElement <: HTMLNode  {
    type: "HTMLElement",
    name: string,
    children: [ HTMLElement | HTMLText | HTMLComment ]
    startTag: HTMLStartTag | null,
    endTag: HTMLEndTag | null
}

• This is a HTML element node.

HTMLStartTag

interface HTMLStartTag <: HTMLNode  {
    type: "HTMLStartTag",
    attributes: [ HTMLAttribute ],
    tagOpen: HTMLToken,
    tagClose: HTMLToken,
    selfClosing: boolean,
    ignoredAttributes: [ HTMLAttribute ],
}

• This is a HTML element start tag.

HTMLAttribute

interface HTMLAttribute <: HTMLNode  {
    type: "HTMLAttribute",
    key: string,
    vakue: string,
    keyToken: HTMLToken,
    eqToken: HTMLToken | null,
    valueToken: HTMLToken | null,
}

• This is a HTML attribute.

HTMLEndTag

interface HTMLEndTag <: HTMLNode  {
    type: "HTMLEndTag",
    tagOpen: HTMLToken,
    tagClose: HTMLToken,
}

• This is a HTML element end tag.