Adding jsdoc support to js-ts-mode

Adding jsdoc support to js-ts-mode

[Damien Cassou]

[-- Attachment #1: Type: text/plain, Size: 2335 bytes --]

Hi,

Currently, jsdoc comments are not recognized in js-ts-mode (see
before.png screenshot attached). I'm trying to fix that (see current
status in after.png).

As you can see in the after.png screenshot, there is no face applied to
the comment markup "/*" and "*". I would like to see
`font-lock-comment-face` applied. I haven't written any code to do that
because I don't know how to apply a face to characters that are not
treesit nodes. Can someone please help?

The code to get after.png is below. If you have any feedback, that would
be greatly appreciated. When everything is fine, I will submit a patch.

Please make sure I'm on CC when replying as I'm not subscribed to the
mailing list.

  (defun js-ts-language-at-point (point)
        "Return the language at POINT."
        (let ((node (treesit-node-at point 'javascript)))
          (if (and (treesit-ready-p 'jsdoc)
                   (equal (treesit-node-type node) "comment")
                   (string-match-p
                    (rx bos "/**")
                    (treesit-node-text node)))
              'jsdoc
            'javascript)))


To be added to js-ts-mode body:

  (setq treesit-range-settings
        (treesit-range-rules
         :embed 'jsdoc
         :host 'javascript
         `(((comment) @capture (:match ,(rx bos "/**") @capture)))))

  (setq-local treesit-language-at-point-function #js-ts-language-at-point)

Some new rules for `treesit-font-lock-settings':

  (treesit-font-lock-rules
              :language 'jsdoc
              :override t
              :feature 'keyword
              '((tag_name) @font-lock-keyword-face)

              :language 'jsdoc
              :override t
              :feature 'bracket
              '((["{" "}"]) @font-lock-bracket-face)

              :language 'jsdoc
              :override t
              :feature 'property
              '((type) @font-lock-variable-use-face)

              :language 'jsdoc
              :override t
              :feature 'definition
              '((identifier) @font-lock-variable-name-face)

              :language 'jsdoc
              :override t
              :feature 'comment
              '((description) @font-lock-comment-face))

Best

-- 
Damien Cassou

"Success is the ability to go from one failure to another without
losing enthusiasm." --Winston Churchill

[-- Attachment #2: after.png --]
[-- Type: image/png, Size: 23654 bytes --]

[-- Attachment #3: before.png --]
[-- Type: image/png, Size: 22739 bytes --]

Re: Adding jsdoc support to js-ts-mode

[Dmitry Gutov]

Hi Damien,

On 07/06/2024 10:55, Damien Cassou wrote:
> Currently, jsdoc comments are not recognized in js-ts-mode (see
> before.png screenshot attached). I'm trying to fix that (see current
> status in after.png).

I guess you're using the jsdoc tree-sitter grammar in addition to Lisp 
code. The alternative would be pure-regexp matching, but this might be 
easier indeed.

> As you can see in the after.png screenshot, there is no face applied to
> the comment markup "/*" and "*". I would like to see
> `font-lock-comment-face` applied. I haven't written any code to do that
> because I don't know how to apply a face to characters that are not
> treesit nodes. Can someone please help?

You could try adding a custom rule which applies highlights to specific 
ranges. The function to call is treesit-fontify-with-override.

See its usage examples in the tree - most of them still deal with nodes, 
but you just need to pass the character positions, which can be 
calculated in different ways.

> The code to get after.png is below. If you have any feedback, that would
> be greatly appreciated. When everything is fine, I will submit a patch.
> 
> Please make sure I'm on CC when replying as I'm not subscribed to the
> mailing list.
> 
>    (defun js-ts-language-at-point (point)
>          "Return the language at POINT."
>          (let ((node (treesit-node-at point 'javascript)))
>            (if (and (treesit-ready-p 'jsdoc)
>                     (equal (treesit-node-type node) "comment")
>                     (string-match-p
>                      (rx bos "/**")
>                      (treesit-node-text node)))
>                'jsdoc
>              'javascript)))
> 
> 
> To be added to js-ts-mode body:
> 
>    (setq treesit-range-settings
>          (treesit-range-rules
>           :embed 'jsdoc
>           :host 'javascript
>           `(((comment) @capture (:match ,(rx bos "/**") @capture)))))

Nice.

>    (setq-local treesit-language-at-point-function #js-ts-language-at-point)

Seems like this needs ' after #.

Re: Adding jsdoc support to js-ts-mode

[Damien Cassou]

Hi Dmitry,

Dmitry Gutov <dmitry@gutov.dev> writes:
> You could try adding a custom rule which applies highlights to specific 
> ranges. The function to call is treesit-fontify-with-override.

I've just opened bug#71550 with a patch to add jsdoc support to
`js-ts-mode'. It seems like using `treesit-fontify-with-override' wasn't
necessary after all in the master branch.

>>    (setq-local treesit-language-at-point-function #js-ts-language-at-point)
> Seems like this needs ' after #.

Indeed, thank you!

Thank you for your help

-- 
Damien Cassou

"Success is the ability to go from one failure to another without
losing enthusiasm." --Winston Churchill

Re: Adding jsdoc support to js-ts-mode

[Dmitry Gutov]

On 14/06/2024 15:39, Damien Cassou wrote:
> Dmitry Gutov<dmitry@gutov.dev>  writes:
>> You could try adding a custom rule which applies highlights to specific
>> ranges. The function to call is treesit-fontify-with-override.
> I've just opened bug#71550 with a patch to add jsdoc support to
> `js-ts-mode'. It seems like using `treesit-fontify-with-override' wasn't
> necessary after all in the master branch.

Makes sense - if the grammar parses those regions into individual nodes, 
it's best to use the common highlighting dsl, of course.

I'll check it out a bit later, thank you, if nobody beats me to it.