rsnext/packages/eslint-plugin-next/lib/rules/inline-script-id.js
stefanprobst da4203d032
Add eslint rule for id attribute on inline next/script (#27853)
This adds a new ESLint rule to `eslint-plugin-next` to check that `next/script` components with inline content have the required `id` attribute.

Also adjusted the code example for inline scripts in the `next/script` docs, which were actually missing an `id` attribute.
And also updated the `next/scripts` integration test to also have the required `id` attribute.

Unsure about the required heading levels in the errors .md document (other examples have h1 and h4??)

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [x] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [x] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes
2021-08-19 20:08:04 +00:00

48 lines
1.3 KiB
JavaScript

module.exports = {
meta: {
docs: {
description:
'next/script components with inline content must specify an `id` attribute.',
recommended: true,
},
},
create: function (context) {
let nextScriptImportName = null
return {
ImportDeclaration(node) {
if (node.source.value === 'next/script') {
nextScriptImportName = node.specifiers[0].local.name
}
},
JSXElement(node) {
if (nextScriptImportName == null) return
if (
node.openingElement &&
node.openingElement.name &&
node.openingElement.name.name !== nextScriptImportName
) {
return
}
const attributes = node.openingElement.attributes
if (
node.children.length > 0 ||
attributes.some(
(attribute) => attribute.name.name === 'dangerouslySetInnerHTML'
)
) {
if (!attributes.some((attribute) => attribute.name.name === 'id')) {
context.report({
node,
message:
'next/script components with inline content must specify an `id` attribute. See: https://nextjs.org/docs/messages/inline-script-id',
})
}
}
},
}
},
}