Skip to content

chore: use prettier plugin for jsdoc#513

Merged
karfau merged 25 commits into
xmldom:masterfrom
shunkica:prettier-jsdoc
Jul 19, 2023
Merged

chore: use prettier plugin for jsdoc#513
karfau merged 25 commits into
xmldom:masterfrom
shunkica:prettier-jsdoc

Conversation

@shunkica

Copy link
Copy Markdown
Collaborator

This PR includes a commit that adds the prettier-plugin-jsdoc dependency to the project.
The plugin will improve the readability and maintainability of our JSDoc comments and ensure a consistent style across the project.

@shunkica shunkica added dependencies Pull requests that update a dependency file code style labels Jul 15, 2023
@socket-security

socket-security Bot commented Jul 15, 2023

Copy link
Copy Markdown

New dependencies detected. Learn more about Socket for GitHub ↗︎

Packages Version New capabilities Transitives Size Publisher
@homer0/prettier-plugin-jsdoc 6.0.5 None +2 1.86 MB homer0

@karfau karfau left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I'm not sure where those options should go (assume to the top level?), but I would prefer to enable the tsdoc and jsdocPreferCodeFences options.

@karfau

karfau commented Jul 15, 2023

Copy link
Copy Markdown
Member

@shunkica before you invest eny more time into this, I just had a closer look at the plugin from a dependency perspective, and there are some things that make me feel uncomfortable:

That's not a "NO", but some things to consider.

I think I will file a PR over there that moves develeopment dependencies to the devDependencies part of package.json, and If this is landed and/or prettier v3 support is fixed (there is already a PR), I'have no issues with adding it.

Update I misread the dependencies over there, they are correct, it's just quite a heavy outdated tree... so it is just the prettier v3 support I'm worried about

@shunkica

shunkica commented Jul 16, 2023

Copy link
Copy Markdown
Collaborator Author

I have not used this plugin before, but since it is only a dev dependency, has over 40000 weekly downloads, and it did what it is supposed to, I have not given it that much thought.
If you have issues with that plugin, maybe this one would be better as it doesn't have that many dependencies, but it is a much (much) smaller project. @homer0/prettier-plugin-jsdoc

@karfau

karfau commented Jul 16, 2023

Copy link
Copy Markdown
Member

That looks much more reliable and alive, even though there are not as many downloads.
It is also not supporting prettier v3 yet, and v6 dropped node v14 support, but I think prettier v3 also requires node v16 so we can switch the eslint workflow to use node v16 along the way

@homer0

homer0 commented Jul 16, 2023

Copy link
Copy Markdown

@karfau 👋 I just published the support for v3, and I'm planning to drop v16 before end of the year (since it's reaching EOL on October).

@shunkica

shunkica commented Jul 16, 2023

Copy link
Copy Markdown
Collaborator Author

@homer0 I have added @homer0/prettier-plugin-jsdoc v7.0.0 to the project, but when running format this error occurs a bunch of times.

Edit: nevermind, I see now in package.json that prettier v3 is requried for v7


TypeError: Cannot read properties of undefined (reading 'startsWith')
[error]     at printAngular (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:24775:22)
[error]     at printPathNoParens (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:29687:25)
[error]     at Object.genericPrint [as print] (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:29629:23)
[error]     at callPluginPrintFunction (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:8601:26)
[error]     at mainPrintInternal (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:8550:22)
[error]     at mainPrint (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:8537:18)
[error]     at printAstToDoc (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:8529:18)
[error]     at coreFormat (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:8837:20)
[error]     at formatWithCursor2 (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:9021:18)
[error]     at Object.formatWithCursor (/home/ivanclab/DevProjects/external/xmldom/node_modules/prettier/index.js:38183:12)

@karfau

karfau commented Jul 16, 2023

Copy link
Copy Markdown
Member

You might have to also bump prettier and eslint versions at the same time to make it work with v7.

Or try to make it work with v6 first

@shunkica

Copy link
Copy Markdown
Collaborator Author

You might have to also bump prettier and eslint versions at the same time to make it work with v7.

Or try to make it work with v6 first

Yes I figured that out. Do you want to use @homer0/prettier-plugin-jsdoc:6.0.5 and keep prettier version, or use 7.0.0 and bump prettier version?

@karfau

karfau commented Jul 16, 2023

Copy link
Copy Markdown
Member

Let's first make it work with the current prettier version, I can take care of the updates afterwards

Comment thread lib/dom-parser.js
@homer0

homer0 commented Jul 16, 2023 via email

Copy link
Copy Markdown

@shunkica

Copy link
Copy Markdown
Collaborator Author

I’ll take a look tonight (I’m GMT-3), but I tested it with the cli, vscode ext and my e2e suite and didn’t see anything like that. Most of the issues I had were about the code not changing, since Prettier made its api async and I wasn’t awaiting stuff. I’ll let you know how it goes.

Thanks, please note though that this happened with version 6.0.5 I have not tested 7.0.0 since we are still on prettier v2.

@homer0

homer0 commented Jul 17, 2023

Copy link
Copy Markdown

@shunkica 👋

I just took a look and this line was the issue:

/*
 * @property {typeof conventions.assign} [assign=Object.assign || conventions.assign]
 * The method to use instead of `Object.assign` (or if not available `conventions.assign`),
 * which is used to copy values from the options before they are used for parsing.
 */

Adding a parenthesis o r changing the default value of assign fixes the issue when formatting.

I know, it's not great that something like that would break the whole formatting, but that tends to happen when you start mixing a lot of TS functions with JSDoc, like that OR in the default value.

Some stuff may work, like the typeof on the type, and that's mostly magic from the IDE/Editor, but it can break other things, for example: You have the onError property on that same object, but if you check the inferred type, you'll see that the property doesn't have a name:

image

So the reference on onErrorStopParsing doesn't properly link there. That's because that TS syntax don't work on all context; you need to change the type to this in order to make it properly work:

/*
 * @property {(level:ErrorLevel, message:string, context: DOMHandler) => void} [onError]
 */
image

My recommendation, regardless of the formatting plugin you end up choosing, would be to always check with the IDE/Editor to make sure the inferred type make sense, and to be very careful with the default values, because I believe the editors will only recognize the brackets (making the param/property optional) and ignore the default value, so it will fallback to standard JSDoc, which doesn't accept very complex types.

I hope that helps :)

@karfau

karfau commented Jul 17, 2023

Copy link
Copy Markdown
Member

Thx a lot, if adding the default value this way is not reliable we have to do it differently.
@shunkica if you are not able to get it working let me know and I will have a look

@shunkica

Copy link
Copy Markdown
Collaborator Author

There is also some kind of conflict between eslint and prettier now, because they produce different versions of the jsdoc. After running prettier format, eslint complains about a bunch of stuff (spaces and such)

@karfau

karfau commented Jul 17, 2023

Copy link
Copy Markdown
Member

Since it is the eslint prettier/prettier rule that is complaining, I will take care of it by separating eslint and prettier.
From my experience in other projects this is what most people do now anyways, also for eslint performance problems when using it to run prettier.

@karfau karfau changed the title Add prettier-plugin-jsdoc chore: add prettier-plugin-jsdoc Jul 17, 2023
@shunkica

Copy link
Copy Markdown
Collaborator Author

It turns out the column option was the one causing a bit of a hiccup. I've decided to turn it off for now, as it wasn't really meshing with the overall aesthetic. Hope that's alright!

@karfau karfau left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I didn't went through all of the changes, sicne there are already quite some comments/questions.

Feel free to ignore the "content corrections" if you think they are in the way of getting the formatting right, we can also apply them later.

Thx for investing the time, I hope we can find a way to resolve all the open questions and can come up with a config that provides consistency without getting in our way.

Comment thread lib/conventions.js
Comment thread lib/conventions.js Outdated
Comment thread lib/conventions.js Outdated
Comment thread lib/conventions.js Outdated
Comment thread lib/conventions.js Outdated
Comment thread lib/dom-parser.js Outdated
Comment thread lib/dom-parser.js Outdated
Comment thread lib/entities.js Outdated
Comment thread lib/grammar.js Outdated
Comment thread lib/sax.js Outdated
This reverts commit 3422cf2.
Co-authored-by: Christian Bewernitz <[email protected]>
@shunkica

Copy link
Copy Markdown
Collaborator Author

@karfau is there a reason yml files are used for config? Would you mind a switch to json? ( for prettier and eslint)

@karfau

karfau commented Jul 18, 2023

Copy link
Copy Markdown
Member

@karfau is there a reason yml files are used for config? Would you mind a switch to json? ( for prettier and eslint)

I'm not aware of any specific reason other than it being the default documented format?

@shunkica

Copy link
Copy Markdown
Collaborator Author

@karfau is there a reason yml files are used for config? Would you mind a switch to json? ( for prettier and eslint)

I'm not aware of any specific reason other than it being the default documented format?

Its one of the documented formats. I wouldn't say it is default.
I just find JSON easier to work with than some indentation based markup.
In any case It's not a big issue for me.

@karfau karfau left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

@shunkica I'm fine with the current state.

I configured the jsdocPrintWidth to 95, which is of course an arbitrary number, but I tried different values and this one looked best for the existing content as far as I could judge it.
(I did invest some time into formatting before this new mechanism, so even if it was not totally consistent it was also not without a any consideration.)

Adn I think I would prefer changing the config format in the next PR if you don't mind.

Let me know if there is anything you want ot add to this PR.

@shunkica

Copy link
Copy Markdown
Collaborator Author

@shunkica I'm fine with the current state.

I configured the jsdocPrintWidth to 95, which is of course an arbitrary number, but I tried different values and this one looked best for the existing content as far as I could judge it. (I did invest some time into formatting before this new mechanism, so even if it was not totally consistent it was also not without a any consideration.)

Adn I think I would prefer changing the config format in the next PR if you don't mind.

Let me know if there is anything you want ot add to this PR.

I stopped working yesterday because the IDE was was hammering my cpu to 250% yesterday and became unusable. I suspected the culprit was eslint/prettier but couldn't be bothered to investigate further at the time.

@homer0

homer0 commented Jul 19, 2023

Copy link
Copy Markdown

@shunkica I'm fine with the current state.

I configured the jsdocPrintWidth to 95, which is of course an arbitrary number, but I tried different values and this one looked best for the existing content as far as I could judge it. (I did invest some time into formatting before this new mechanism, so even if it was not totally consistent it was also not without a any consideration.)

Adn I think I would prefer changing the config format in the next PR if you don't mind.

Let me know if there is anything you want ot add to this PR.

I stopped working yesterday because the IDE was was hammering my cpu to 250% yesterday and became unusable. I suspected the culprit was eslint/prettier but couldn't be bothered to investigate further at the time.

If you are using vscode: whenever you change Prettier/ESLint configs, or install/update dependencies, do a "reload window"; Linting tooling usually becomes buggy because it already had stuff in memory.

And just in case, no idea if you are doing it but, don't try to run eslint --fix with Prettier. ESLint is REALLY slow compared to Prettier, added to how fast you can be coding… it creates some fun race conditions :P.

@shunkica

Copy link
Copy Markdown
Collaborator Author

If you are using vscode: whenever you change Prettier/ESLint configs, or install/update dependencies, do a "reload window"; Linting tooling usually becomes buggy because it already had stuff in memory.

And just in case, no idea if you are doing it but, don't try to run eslint --fix with Prettier. ESLint is REALLY slow compared to Prettier, added to how fast you can be coding… it creates some fun race conditions :P.

I am actually using WebStorm, but I didn't have time to figure out what was going on.

@karfau

karfau commented Jul 19, 2023

Copy link
Copy Markdown
Member

@shunkica let me know if you are still observing this slowness after a fresh computer/IDE start.

If yes, I will wait for you to figure out what is going on.

From the npm scripts we don't do eslint --fix, but I guess it is possible to invoke it from the IDE.

I think it is time to apply prettier to staged files in a pre-commit hook asap, to avoid running into formatting issues in the github actions. But this should be a separate PR.

Thx a lot @homer0 for all the support and for building and maintaining the plugin.

@shunkica

Copy link
Copy Markdown
Collaborator Author

I can not reproduce the problems I had yesterday.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

code style dependencies Pull requests that update a dependency file

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants