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

feat(lint): add html option for useSelfClosingElements #3697

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

abidjappie
Copy link
Contributor

@abidjappie abidjappie commented Aug 22, 2024

Summary

Fix #3364

This PR implements the html option provided by Eslint Stylistic jsx-self-closing-comp.

By setting html to false, it will not enforce this rule on html elements.

Implementation

It checks whether the JsxOpeningElement contains a JsxName i.e. it is not a JsxReferenceIdentifier etc. and assumes that it is a valid html element implicitly. If this assumption does not hold, we may need an alternative implementation.

Limitations

This does not cover the void element case - i.e. it will not automatically lint the void element correctly. It simply disables the rule.

Test Plan

Added the validHtml and invalidHtml test cases.

@github-actions github-actions bot added A-Linter Area: linter L-JavaScript Language: JavaScript and super languages labels Aug 22, 2024
@abidjappie abidjappie marked this pull request as draft August 22, 2024 09:59
@abidjappie abidjappie changed the title feat: implement the html option for useSelfClosingElements as provide… feat(lint): implement the html option for useSelfClosingElements Aug 22, 2024
@abidjappie abidjappie changed the title feat(lint): implement the html option for useSelfClosingElements feat(lint): add the html option for useSelfClosingElements Aug 22, 2024
@abidjappie abidjappie changed the title feat(lint): add the html option for useSelfClosingElements feat(lint): add html option for useSelfClosingElements Aug 22, 2024
Copy link

codspeed-hq bot commented Aug 22, 2024

CodSpeed Performance Report

Merging #3697 will not alter performance

Comparing abidjappie:feat/style-use-self-closing-elements-html-option (6961fdc) with main (14c7d97)

Summary

✅ 99 untouched benchmarks

@abidjappie abidjappie marked this pull request as ready for review August 22, 2024 10:38
Copy link
Member

@ematipico ematipico left a comment

Choose a reason for hiding this comment

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

Thank you for the contribution.

A couple of important things should be addressed:

  • Documentation; I left various tips
  • Changelog line for CHANGELOG.md

/// {
/// "//":"...",
/// "options": {
/// "html": true
Copy link
Member

Choose a reason for hiding this comment

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

IMHO, the name html is not descriptive enough. A name should be explanatory enough so users can understand what it does just by reading it.

I think we should name it checkHtmlElements, what do you think?

Regarding the structure of the docs, it should be like this:

### Options

#### `nameOfTheOoption`

Default: `true`

<Explanation of the option> (e.g. This option allows to control whether this rule should check HTML elements or not)

<Explanation of an example> (e.g. In the following example, when the option is set to `false`, this happens)

```json
{
	"//": "example of the configuration"
}
```

```jsx,ignore
// example of code that will pass, use the `ignore` directive in the code block, so the codegen won't execute the code
<img src="something.png" >
```

#[derive(Clone, Debug, Deserialize, Deserializable, Eq, PartialEq, Serialize)]
#[cfg_attr(feature = "schemars", derive(JsonSchema))]
pub struct UseSelfClosingElementsOptions {
pub html: bool,
Copy link
Member

Choose a reason for hiding this comment

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

The options must be documented. The documentation will be part of the configuration JSON schema, this means that users will be able to see the description when their IDE will autocomplete the option.

@ematipico
Copy link
Member

@abidjappie, are you still interested in bringing this feature to the finish line?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
A-Linter Area: linter L-JavaScript Language: JavaScript and super languages
Projects
None yet
Development

Successfully merging this pull request may close these issues.

💅 lint/style/useSelfClosingElements false positive error
2 participants