fregante / fregante/select-dom

Add more eslint rules

Open Beginner friendly
#46 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
133
Forks
9
PR merge metrics
No merged PRs in 30d

Description

Found in https://github.com/refined-github/refined-github/blob/65aab3908a1cce9d6b9de95e3fb3de1060d47649/eslint-rules/restricted-syntax.js

## Prefer selectors as array

```js
'byo/selectors-array-for-complex-strings': ['error', {
selector:
':matches([callee.name=delegate], [callee.name=$], [callee.name=$$], [callee.name=$optional], [callee.name=closestElement], [callee.name=closestElementOptional], [callee.name=observe], [callee.property.name=querySelector], [callee.property.name=querySelectorAll])[arguments.0.value=/,/][arguments.0.value.length>=20]:not([arguments.0.value=/:has|:is|:not/])',
message: 'Instead of a single string, pass an array of selectors and add comments to each selector',
}],
'byo/selectors-string-for-single-array-item': ['error', {
selector:
':matches([callee.name=delegate], [callee.name=$], [callee.name=$$], [callee.name=$optional], [callee.name=closestElement], [callee.name=closestElementOptional], [callee.name=observe], [callee.property.name=querySelector], [callee.property.name=querySelectorAll])[arguments.0.type=ArrayExpression][arguments.0.elements.length=1]:not([arguments.0.value=/:has|:is/])',
message: "If it's a single selector, use a single string instead of an array",
}],

```

## Null/expected guidance

```js
'byo/no-non-null-optional': ['error', {
selector: 'TSNonNullExpression > CallExpression > [name=$optional]',
message: 'Use `$()` instead of non-null `$optional()`. Use it as `import {expectElement as $}`',
}],
'byo/no-non-null-expect-element': ['error', {
selector: 'TSNonNullExpression > CallExpression > [name=$]',
message: 'Unused null expression: !',
}],
'byo/no-non-null-closest': ['error', {
selector: 'TSNonNullExpression > CallExpression > [name=closestElement]',
message: 'Unused null expression: ! — closestElement() already throws when the element is not found',
}],
```

## Use helpers

```js
'byo/prefer-element-exists': ['error', {
message: 'Use `elementExists` for checking if an element exists',
selector: '*[test.type="CallExpression"][test.callee.name="$optional"],'
+ '*[test.type="UnaryExpression"][test.operator="!"][test.argument.type="CallExpression"][test.argument.callee.name="$optional"]',
}],
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with eslint-rules/restricted-syntax.js at the referenced commit and inspect how existing byo rules are registered. Add the listed selector-array, null/expected, and element-existence rules there, then verify that the ESLint configuration recognizes their patterns and messages.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
tooling
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.