`getJSDocTags` detects decorators inside code blocks as JSDoc tags

[JeanMeche]

🔎 Search Terms

• jsdoc
• getJSDocTags
• decorators

🕗 Version & Regression Information

This is faulty behavior

⏯ Playground Link

https://stackblitz.com/edit/gettextofjsdoccomment-d88fzj?file=main.ts,package.json

💻 Code

import ts from 'typescript';

const filename = 'example.ts';
const code = `
/** 
 * 
 * @usageNotes
 *
 * Use \`afterNextRender\` to read or write the DOM once,
 * for example to initialize a non-Angular library.
 *
 * ### Example
 * \`\`\`ts
 * @Component({
 *   selector: 'my-chart-cmp',
 *   template: \`<div #chart>{{ ... }}</div>\`,
 * })
 * export class MyChartCmp {
 *   @ViewChild('chart') chartRef: ElementRef;
 *   chart: MyChart|null;
 *
 *   constructor() {
 * 
 *   }
 * }
 * \`\`\`
 */
class Foo  {};
`;

const sourceFile = ts.createSourceFile(
  filename,
  code,
  ts.ScriptTarget.ESNext,
  true
);

const visitNode = (node: ts.Node) => {
  ts.forEachChild(node, visitNode);
  const tags = ts.getJSDocTags(node);
  if (tags.length) {
    tags.forEach((tag) => {
      const comment = tag.comment!.slice(1) as any;

      console.log(
        '> ',
        tag.tagName.getText(),
        ' | ',
        ts.getTextOfJSDocComment(comment)
      );
    });
  }
};

ts.forEachChild(sourceFile, visitNode);

🙁 Actual behavior

We get 2 distinct tags:

>  usageNotes  |  se `afterNextRender` to read or write the DOM once,
for example to initialize a non-Angular library.

### Example
```ts
>  Component  |  {
selector: 'my-chart-cmp',
template: `<div #chart>{{ ... }}</div>`,
})
export class MyChartCmp {
>  ViewChild  |  'chart') chartRef: ElementRef;
chart: MyChart|null;

constructor() {

}
}

🙂 Expected behavior

Only one tag should be extracted : usagenotes

Additional information about the issue

No response

[RyanCavanaugh]

We don't have markdown parsing or code block detection features in JS Doc at the moment