Add eslint rule for id attribute on inline next/script

[stefanprobst]

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
• Documentation added
• Telemetry added. In case of a feature if it's used or not.
• Errors have helpful link attached, see contributing.md

Documentation / Examples

• Make sure the linting passes

[stefanprobst]

the Script examples+tests recently added in #25147 also don't have an id - should i fix that in this pr as well, or open a separate one?

[housseindjirdeh]

@stefanprobst I think it makes sense to add directly in this PR. But if you would rather submit a separate one, that's fine too :)

Thanks again for all your help!

[ijjk]

Failing test suites

Commit: b219f39

test/integration/config-devtool-dev/test/index.test.js

• devtool set in development mode in next config > should warn and revert when a devtool is set in development mode

Expand output

● devtool set in development mode in next config › should warn and revert when a devtool is set in development mode

thrown: "Exceeded timeout of 30000 ms for a test.
Use jest.setTimeout(newTimeout) to increase the timeout value, if this is a long-running test."

  17 |
  18 | describe('devtool set in development mode in next config', () => {
> 19 |   it('should warn and revert when a devtool is set in development mode', async () => {
     |   ^
  20 |     let stderr = ''
  21 |
  22 |     const appPort = await findPort()

  at integration/config-devtool-dev/test/index.test.js:19:3
  at Object.<anonymous> (integration/config-devtool-dev/test/index.test.js:18:1)

[ijjk]

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
buildDuration	15.4s	15.7s	⚠️ +312ms
buildDurationCached	3.6s	3.9s	⚠️ +294ms
nodeModulesSize	61.4 MB	61.4 MB	⚠️ +2 B

Page Load Tests Overall increase ✓

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
/ failed reqs	0	0	✓
/ total time (seconds)	3.114	2.94	-0.17
/ avg req/sec	802.93	850.3	+47.37
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.933	1.828	-0.1
/error-in-render avg req/sec	1293.22	1367.81	+74.59

Client Bundles (main, webpack, commons)

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
745.HASH.js gzip	179 B	179 B	✓
framework-HASH.js gzip	42.2 kB	42.2 kB	✓
main-HASH.js gzip	23.2 kB	23.2 kB	✓
webpack-HASH.js gzip	1.45 kB	1.45 kB	✓
Overall change	67.1 kB	67.1 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
_app-HASH.js gzip	979 B	979 B	✓
_error-HASH.js gzip	194 B	194 B	✓
amp-HASH.js gzip	312 B	312 B	✓
css-HASH.js gzip	329 B	329 B	✓
dynamic-HASH.js gzip	2.67 kB	2.67 kB	✓
head-HASH.js gzip	351 B	351 B	✓
hooks-HASH.js gzip	918 B	918 B	✓
image-HASH.js gzip	4.14 kB	4.14 kB	✓
index-HASH.js gzip	261 B	261 B	✓
link-HASH.js gzip	1.66 kB	1.66 kB	✓
routerDirect..HASH.js gzip	318 B	318 B	✓
script-HASH.js gzip	387 B	387 B	✓
withRouter-HASH.js gzip	320 B	320 B	✓
bb14e60e810b..30f.css gzip	125 B	125 B	✓
Overall change	13 kB	13 kB	✓

Client Build Manifests

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
_buildManifest.js gzip	491 B	491 B	✓
Overall change	491 B	491 B	✓

Rendered Page Sizes

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
index.html gzip	541 B	541 B	✓
link.html gzip	553 B	553 B	✓
withRouter.html gzip	534 B	534 B	✓
Overall change	1.63 kB	1.63 kB	✓

---

Webpack 4 Mode (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
buildDuration	12.9s	12.1s	-751ms
buildDurationCached	5.2s	4.9s	-265ms
nodeModulesSize	61.4 MB	61.4 MB	⚠️ +2 B

Page Load Tests Overall increase ✓

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
/ failed reqs	0	0	✓
/ total time (seconds)	2.988	2.962	-0.03
/ avg req/sec	836.64	844.16	+7.52
/error-in-render failed reqs	0	0	✓
/error-in-render total time (seconds)	1.853	1.813	-0.04
/error-in-render avg req/sec	1349.1	1379.02	+29.92

Client Bundles (main, webpack, commons)

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
16.HASH.js gzip	186 B	186 B	✓
677f882d2ed8..HASH.js gzip	14.1 kB	14.1 kB	✓
framework.HASH.js gzip	41.9 kB	41.9 kB	✓
main-HASH.js gzip	10.6 kB	10.6 kB	✓
webpack-HASH.js gzip	1.19 kB	1.19 kB	✓
Overall change	68 kB	68 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
polyfills-a4..dd70.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
_app-HASH.js gzip	964 B	964 B	✓
_error-HASH.js gzip	3.8 kB	3.8 kB	✓
amp-HASH.js gzip	552 B	552 B	✓
css-HASH.js gzip	333 B	333 B	✓
dynamic-HASH.js gzip	2.87 kB	2.87 kB	✓
head-HASH.js gzip	3.06 kB	3.06 kB	✓
hooks-HASH.js gzip	924 B	924 B	✓
index-HASH.js gzip	231 B	231 B	✓
link-HASH.js gzip	1.64 kB	1.64 kB	✓
routerDirect..HASH.js gzip	298 B	298 B	✓
script-HASH.js gzip	2.98 kB	2.98 kB	✓
withRouter-HASH.js gzip	295 B	295 B	✓
30809af5c834..565.css gzip	125 B	125 B	✓
Overall change	18.1 kB	18.1 kB	✓

Client Build Manifests

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
_buildManifest.js gzip	500 B	500 B	✓
Overall change	500 B	500 B	✓

Rendered Page Sizes

	vercel/next.js canary	stefanprobst/next.js feat/eslint-next-script-id	Change
index.html gzip	585 B	585 B	✓
link.html gzip	597 B	597 B	✓
withRouter.html gzip	577 B	577 B	✓
Overall change	1.76 kB	1.76 kB	✓

Commit: 0bed0a2

[styfle]

Thanks!