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

next/script eslint-plugin-next Cannot read property 'name' of undefined #32178

Closed
gapon2401 opened this issue Dec 6, 2021 · 12 comments · Fixed by #32421
Closed

next/script eslint-plugin-next Cannot read property 'name' of undefined #32178

gapon2401 opened this issue Dec 6, 2021 · 12 comments · Fixed by #32421
Labels
good first issue Easy to fix issues, good for newcomers Linting Related to `next lint` or ESLint with Next.js.

Comments

@gapon2401
Copy link

What version of Next.js are you using?

12.0.7

What version of Node.js are you using?

14.17.5

What browser are you using?

Chrome

What operating system are you using?

Windows

How are you deploying your application?

next start

Describe the Bug

When I'm using spread operator for <Script> tag, I got an error:

    at \node_modules\@next\eslint-plugin-next\lib\rules\inline-script-id.js:34:43
    at Array.some (<anonymous>)
    at JSXElement (\node_modules\@next\eslint-plugin-next\lib\rules\inline-script-id.js:33:22)
    at \node_modules\eslint\lib\linter\safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (\node_modules\eslint\lib\linter\safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (\node_modules\eslint\lib\linter\node-event-generator.js:293:26)
    at NodeEventGenerator.applySelectors (\node_modules\eslint\lib\linter\node-event-generator.js:322:22)
    at NodeEventGenerator.enterNode (\node_modules\eslint\lib\linter\node-event-generator.js:336:14)
    at CodePathAnalyzer.enterNode (\node_modules\eslint\lib\linter\code-path-analysis\code-path-analyzer.js:711:23)

Expected Behavior

I expected to have no eslint errors

To Reproduce

<Script {...{ strategy: 'beforeInteractive' }} id={'test'} />

@gapon2401 gapon2401 added the bug Issue was opened via the bug report template. label Dec 6, 2021
@balazsorban44
Copy link
Member

balazsorban44 commented Dec 6, 2021

I could not reproduce, could you post your repository or a minimal reproduction?

My bad, it did happen, only I was looking for the error in the wrong place.

@balazsorban44 balazsorban44 added please add a complete reproduction The issue lacks information for further investigation Linting Related to `next lint` or ESLint with Next.js. kind: bug and removed bug Issue was opened via the bug report template. please add a complete reproduction The issue lacks information for further investigation labels Dec 6, 2021
@balazsorban44
Copy link
Member

balazsorban44 commented Dec 6, 2021

The issue is here:

(attribute) => attribute.name.name === 'dangerouslySetInnerHTML'
)
) {
if (!attributes.some((attribute) => attribute.name.name === 'id')) {

@balazsorban44 balazsorban44 added the good first issue Easy to fix issues, good for newcomers label Dec 6, 2021
@josharsh
Copy link
Contributor

josharsh commented Dec 7, 2021

@balazsorban44 are you picking this up? (If not, I would like to give a shot)

@balazsorban44
Copy link
Member

please do!

@josharsh
Copy link
Contributor

josharsh commented Dec 7, 2021

Hey, I am trying to run an example app (yarn next ./examples/basic-css/) and trying to include Script using "next/script".
I am trying to observe logs on removing "id" attribute but don't think I am doing it right.
Could you please help me in reproducing the error? @balazsorban44

@balazsorban44
Copy link
Member

balazsorban44 commented Dec 7, 2021

What I did was:

  1. create an example project with yarn create next-app
  2. Open in VScode (Make sure you have the ESLint extension enabled)
  3. Open pages/index.js
  4. add import Script from "next/script
  5. add <Script {...{ strategy: "beforeInteractive" }} id={"test"} /> in the return body

VSCode shows this in the Output:

[Error - 12:49:38 AM] TypeError: Cannot read property 'name' of undefined
Occurred while linting .../pages/index.js:9
Rule: "@next/next/inline-script-id"
    at .../node_modules/@next/eslint-plugin-next/lib/rules/inline-script-id.js:35:43
    at Array.some (<anonymous>)
    at JSXElement (.../node_modules/@next/eslint-plugin-next/lib/rules/inline-script-id.js:34:22)
    at ruleErrorHandler (.../node_modules/eslint/lib/linter/linter.js:1076:28)
    at .../node_modules/eslint/lib/linter/safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (.../node_modules/eslint/lib/linter/safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (.../node_modules/eslint/lib/linter/node-event-generator.js:297:26)
    at NodeEventGenerator.applySelectors (.../node_modules/eslint/lib/linter/node-event-generator.js:326:22)
    at NodeEventGenerator.enterNode (.../node_modules/eslint/lib/linter/node-event-generator.js:340:14)

@josharsh
Copy link
Contributor

josharsh commented Dec 8, 2021

Not able to reproduce.
Here are the specifics:

  • next version: v12.0.7
  • node version: v16.6.2
  • OS: mac
  • Running Using: yarn dev

Is there anything I am missing?

@balazsorban44
Copy link
Member

balazsorban44 commented Dec 8, 2021

Try running yarn lint?:

TypeError: Cannot read properties of undefined (reading 'name')
Occurred while linting .../pages/index.js:9
Rule: "@next/next/inline-script-id"
error Command failed with exit code 1.

@stefanprobst
Copy link
Contributor

i think changing

const attributes = node.openingElement.attributes
like this should work:

- const attributes = node.openingElement.attributes
+ const attributes = node.openingElement.attributes.filter(attribute => attribute.type === 'JSXAttribute')

@Xunnamius
Copy link

Xunnamius commented Dec 11, 2021

Might be related (if not, I'll open a new issue), but I'm receiving the same error but in what looks like a totally different context:

$ npx eslint --parser-options=project:tsconfig.lint.json src

Oops! Something went wrong! :(

ESLint: 8.4.1

TypeError: Cannot read properties of null (reading 'name')
Occurred while linting /repos/.ergodark/xunn.at/src/pages/api/[shortId].ts:9
Rule: "@next/next/no-page-custom-font"
    at ExportDefaultDeclaration (/repos/.ergodark/xunn.at/node_modules/@next/eslint-plugin-next/lib/rules/no-page-custom-font.js:46:56)
    at ruleErrorHandler (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/linter.js:1076:28)
    at /repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/node-event-generator.js:297:26)
    at NodeEventGenerator.applySelectors (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/node-event-generator.js:326:22)
    at NodeEventGenerator.enterNode (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/node-event-generator.js:340:14)
    at CodePathAnalyzer.enterNode (/repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/code-path-analysis/code-path-analyzer.js:795:23)
    at /repos/.ergodark/xunn.at/node_modules/eslint/lib/linter/linter.js:1107:32

It's doubly strange because I'm mostly doing API stuff so there is no frontend code yet, let alone any code having to do with fonts. Removing 'plugin:@next/next/recommended' from my ESLint extends "solves" the problem.

@balazsorban44
Copy link
Member

@Xunnamius I believe that is already fixed #32251

ccorda added a commit to patronage/bubs-next that referenced this issue Dec 27, 2021
ccorda added a commit to patronage/bubs-next that referenced this issue Dec 27, 2021
* node dep upgrades

* turn off next command that generates error on 12.0.7

see:
vercel/next.js#32178
@kodiakhq kodiakhq bot closed this as completed in #32421 Feb 2, 2022
kodiakhq bot pushed a commit that referenced this issue Feb 2, 2022
fixes #32178

the `inline-script-id` eslint rule crashed when encountering a `JSXSpreadAttribute`. this pr fixes that, and also handles `id` being passed via the spreaded object.

## Bug

- [x] Related issues linked using `fixes #number`
- [x] ~~Integration~~ Unit 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 by running `yarn lint`
natew pushed a commit to natew/next.js that referenced this issue Feb 16, 2022
…l#32421)

fixes vercel#32178

the `inline-script-id` eslint rule crashed when encountering a `JSXSpreadAttribute`. this pr fixes that, and also handles `id` being passed via the spreaded object.

## Bug

- [x] Related issues linked using `fixes #number`
- [x] ~~Integration~~ Unit 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 by running `yarn lint`
@github-actions
Copy link
Contributor

github-actions bot commented Mar 5, 2022

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Mar 5, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
good first issue Easy to fix issues, good for newcomers Linting Related to `next lint` or ESLint with Next.js.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants