Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add ast-spec, type-utils docs with docusaurus-plugin-typedoc #9293

Merged

Conversation

JoshuaKGoldberg
Copy link
Member

@JoshuaKGoldberg JoshuaKGoldberg commented Jun 6, 2024

PR Checklist

Overview

Sets up https://typedoc-plugin-markdown.org/plugins/docusaurus to auto-generate TypeDoc docs from packages/type-utils/src/index.ts into docs/package/type-utils/api.

💖

@typescript-eslint
Copy link
Contributor

Thanks for the PR, @JoshuaKGoldberg!

typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community.

The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately.

Thanks again!


🙏 Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint.

Copy link

netlify bot commented Jun 6, 2024

Deploy Preview for typescript-eslint ready!

Name Link
🔨 Latest commit e73bc3f
🔍 Latest deploy log https://app.netlify.com/sites/typescript-eslint/deploys/66a795a5d6b3e50008e99508
😎 Deploy Preview https://deploy-preview-9293--typescript-eslint.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 98 (🔴 down 1 from production)
Accessibility: 100 (no change from production)
Best Practices: 92 (no change from production)
SEO: 90 (no change from production)
PWA: 80 (no change from production)
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

@JoshuaKGoldberg JoshuaKGoldberg changed the title docs: add type-utils docs with docusaurus-plugin-typedoc docs: add ast-spec, type-utils, utils docs with docusaurus-plugin-typedoc Jun 7, 2024
* TS-prefixed nodes
*/

// TS_prefixed nodes
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The /** ... */ JSDoc style comment was getting picked up as a comment on specifically TSAbstractAccessorProperty.

Screenshot of "TS-prefixed-nodes" as a TypeDoc-rendered comment on TSAbstractAccessorProperty

@@ -8,14 +8,14 @@ export interface TSEnumDeclaration extends BaseNode {
/**
* Whether this is a `const` enum.
* ```
* const enum Foo {...}
* const enum Foo {}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Invalid TS syntax in ```s -with or without @example or the `ts` block- causes a parse error in the generated `index.md`:

Error: MDX compilation failed for file "/Users/josh/repos/typescript-eslint/docs/packages/ast-spec/generated/index.md"
Cause: Could not parse expression with acorn
Details:
{
  "cause": {
    "pos": 65758,
    "loc": {
      "line": 2505,
      "column": 102
    },
    "raisedAt": 3
  },
  "column": 103,
  "message": "Could not parse expression with acorn",
  "line": 2505,
  "name": "2505:103",
  "place": {
    "line": 2505,
    "column": 103,
    "offset": 65758
  },
  "reason": "Could not parse expression with acorn",
  "ruleId": "acorn",
  "source": "micromark-extension-mdx-expression",
  "url": "https://github.com/micromark/micromark-extension-mdx-expression/tree/main/packages/micromark-extension-mdx-expression#could-not-parse-expression-with-acorn"
}

The Markdown in question:

#### Properties

| Property | Type | Description | Overrides |
| :------ | :------ | :------ | :------ |
| `const` | `boolean` | <p>Whether this is a `const` enum.</p><p>**Example**</p><code>const enum Foo {...}</code> | - |
| `declare` | `boolean` | <p>Whether this is a `declare`d enum.</p><p>**Example**</p><code>declare enum Foo {...}</code> | - |
| `id` | [`Identifier`](index.md#identifier) | The enum name. | - |
| `members` | [`TSEnumMember`](index.md#tsenummember)[] | The enum members. | - |
| `type` | `TSEnumDeclaration` | - | [`BaseNode`](index.md#basenode).`type` |

***

...where the issue is on the <code> in the first tbody row.

*/
loc: SourceLocation;

/**
* @see {Range}
*/
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These @sees just restate the type. No useful info added.

* export * from 'mod' assert { type: 'json' };
* @example
* ```ts
* export * from 'mod' assert \{ type: 'json' \};
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Without these \s, Acorn give a parse error on the generated index.md:

Error: MDX compilation failed for file "/Users/josh/repos/typescript-eslint/docs/packages/ast-spec/generated/index.md"
Cause: Could not parse expression with acorn
Details:
{
  "cause": {
    "pos": 26627,
    "loc": {
      "line": 871,
      "column": 174
    }
  },
  "column": 175,
  "message": "Could not parse expression with acorn",
  "line": 871,
  "name": "871:175",
  "place": {
    "line": 871,
    "column": 175,
    "offset": 26627
  },
  "reason": "Could not parse expression with acorn",
  "ruleId": "acorn",
  "source": "micromark-extension-mdx-expression",
  "url": "https://github.com/micromark/micromark-extension-mdx-expression/tree/main/packages/micromark-extension-mdx-expression#could-not-parse-expression-with-acorn"
}

The Markdown in question:

#### Properties

| Property | Type | Description | Overrides |
| :------ | :------ | :------ | :------ |
| ~~`assertions`~~ | [`ImportAttribute`](index.md#importattribute)[] | <p>The assertions declared for the export.</p><p>**Example**</p><code>export * from 'mod' assert { type: 'json' };</code><p>**Deprecated**</p><p>-- Replaced with `attributes`.</p> | - |
| `attributes` | [`ImportAttribute`](index.md#importattribute)[] | <p>The attributes declared for the export.</p><p>**Example**</p><code>export * from 'mod' assert { type: 'json' };</code> | - |
| `exportKind` | `ExportAndImportKind` | The kind of the export. | - |
| `exported` | `null` \| [`Identifier`](index.md#identifier) | The name for the exported items. `null` if no name is assigned. | - |
| `source` | [`StringLiteral`](index.md#stringliteral) | The source module being exported from. | - |
| `type` | `ExportAllDeclaration` | - | [`BaseNode`](index.md#basenode).`type` |

***

...where the issue is on the <code> in the first tbody row.

@@ -11,7 +11,8 @@ export interface LetOrConstOrVarDeclaration extends BaseNode {
/**
* The variables declared by this declaration.
* Note that there may be 0 declarations (i.e. `const;`).
* ```
* @example
* ```ts
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried to make sure all ```s had a language and were in a proper @example, so they'd play nicely with docs generation. But multiline ones expose a bug in the markdown table output 🫤:

Screenshot of the LetOrConstVariableDeclaration where only the first line of the example code blocks are actual markdown codeblocks

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Resolved by splitting into individual @examples. 🤷

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some of them are still a little messy... but I don't know the right way to get around this. 😬 putting in review.

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as ready for review June 22, 2024 20:16
Copy link
Member

@bradzacher bradzacher left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://deploy-preview-9293--typescript-eslint.netlify.app/packages/utils/generated/namespaces/ASTUtils/

Bug: This page loses the sidebar (and is not listed in the sidebar at all).


screenshot of TOC

Question: can we change the TOC so that we show one fewer level of headings on these pages? It's pretty low value showing the Parameters, Returns etc headings in the TOC -- i'd say it's even just noisy / confusing.

@JoshuaKGoldberg
Copy link
Member Author

Yeah @bradzacher that makes sense. I was excited about getting the utils package in there but it's a bit more complicated and I think we'll need to look more critically at its docs.

The presence of multiple / nested namespaces makes the doc gen trickier. I tried much of https://typedoc-plugin-markdown.org/docs/options/file-options but couldn't figure out how to collapse it all into one page.

For now, I just removed utils from the array of generated package docs.

@JoshuaKGoldberg JoshuaKGoldberg changed the title docs: add ast-spec, type-utils, utils docs with docusaurus-plugin-typedoc docs: add ast-spec, type-utils docs with docusaurus-plugin-typedoc Jun 25, 2024
* declare const x = 1;
* ```
*/
declare: boolean;
/**
* The keyword used to declare the variable(s)
* ```
* @example
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same here: not sure why we want to split them up (and I think there's a stray ``` above)

Copy link

codecov bot commented Jul 20, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 88.45%. Comparing base (6b92aa5) to head (e73bc3f).

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #9293   +/-   ##
=======================================
  Coverage   88.45%   88.45%           
=======================================
  Files         422      422           
  Lines       14695    14695           
  Branches     4298     4298           
=======================================
  Hits        12998    12998           
  Misses       1372     1372           
  Partials      325      325           
Flag Coverage Δ
unittest 88.45% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files Coverage Δ
...eslint-plugin/src/rules/consistent-type-imports.ts 94.77% <ø> (ø)
packages/utils/src/ts-eslint/RuleTester.ts 50.00% <ø> (ø)
packages/utils/src/ts-eslint/SourceCode.ts 50.00% <ø> (ø)

@JoshuaKGoldberg
Copy link
Member Author

Merging after talking privately & confirming that:

  • The docs here are so big that it's super hard to actually review
  • This is generally good to go otherwise

@JoshuaKGoldberg JoshuaKGoldberg merged commit 9927a29 into typescript-eslint:main Jul 29, 2024
60 checks passed
@JoshuaKGoldberg JoshuaKGoldberg deleted the docusaurus-plugin-typedoc branch July 29, 2024 15:58
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 7, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Docs: Add generated documentation on packages exports to the site Documentation for AST node types
3 participants