Eslint-plugin-vue: token.type.endsWith is not a function with vue/script-indent

[KaelWD]

Tell us about your environment

• ESLint Version: 4.15.0
• eslint-plugin-vue Version: 4.2.0
• Node Version: 8.9.1

Please show your full configuration:

module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint',
    ecmaVersion: 2017,
    sourceType: 'module'
  },
  env: {
    node: true,
    browser: true
  },
  extends: [
    'plugin:vue/recommended',
    'standard'
  ],
  rules: {
    "vue/script-indent": ["error", 2, {
      "baseIndent": 1,
      "switchCase": 0,
      "ignores": []
    }]
...

What did you do? Please include the actual source code causing the issue.

return (
  // it's inside node_modules
  /node_modules/.test(module.context) &&
  // and not a CSS file (due to extract-text-webpack-plugin limitation)
  !/\.css$/.test(module.request)
)

What actually happened? Please include the actual, raw output from ESLint.

TypeError: token.type.endsWith is not a function
    at isComment (eslint-plugin-vue/lib/utils/indent-common.js:186:120)
    at Array.every (<anonymous>)
    at :matches(Program, VElement[parent.type!='VElement']):exit (eslint-plugin-vue/lib/utils/indent-common.js:1493:37)
    at listeners.(anonymous function).forEach.listener (eslint/lib/util/safe-emitter.js:47:58)
    at Array.forEach (<anonymous>)
    at Object.emit (eslint/lib/util/safe-emitter.js:47:38)
    at NodeEventGenerator.applySelector (eslint/lib/util/node-event-generator.js:251:26)
    at NodeEventGenerator.applySelectors (eslint/lib/util/node-event-generator.js:280:22)
    at NodeEventGenerator.leaveNode (eslint/lib/util/node-event-generator.js:303:14)
    at CodePathAnalyzer.leaveNode (eslint/lib/code-path-analysis/code-path-analyzer.js:630:23)

The token passed into isComment: (it's the ! before the regexp)

{
  "type": {
    "label": "!",
    "beforeExpr": true,
    "startsExpr": true,
    "rightAssociative": false,
    "isLoop": false,
    "isAssign": false,
    "prefix": true,
    "postfix": false,
    "binop": null,
    "updateContext": null
  },
  "value": "!",
  "start": 963,
  "end": 964,
  "loc": {
    "start": {
      "line": 26,
      "column": 10
    },
    "end": {
      "line": 26,
      "column": 11
    }
  },
  "range": [
    963,
    964
  ]
}

[mysticatea]

Thank you for this issue.

This looks like a bug of babel-eslint.
As ESLint AST spec, the type must be a string. Would you report it to https://github.com/babel/babel-eslint ?

[KaelWD]

Same thing's happening here:

search (val) {
  if (!val) {
    this.docSearch.autocomplete.autocomplete.close()
  }
}

[samit4me]

Having the same issue, is there any workarounds until the upstream issue is solved?

[KaelWD]

The fix was finally released in babel-eslint 8.2.1, so it just needs to be updated in this project.

[samit4me]

Updating the following resolved the issue for me:
JSON" "eslint-plugin-vue": "^4.3.0", "babel-eslint": "^8.2.1"

[rafaelkendrik]

Just a note, after updating babel-eslint and eslint-plugin-vue, i'm still having the same issue in this case:

"babel-eslint": "^8.2.1",
"eslint-plugin-vue": "^4.4.0",

Tell us about your environment:

• ESLint Version: 4.15.0
• eslint-plugin-vue Version: 4.4.0
• Node Version: 9.8.0

Please show your full configuration:

{
  "parserOptions": {
    "parser": "babel-eslint"
  },  
  "env": {
    "browser": true,
    "es6": true
  },  
  "extends": [
    "plugin:vue/essential",
    "airbnb-base"
  ],  
  "plugins": [
    "vue"
  ],  
  "rules": {
    "max-len": ["error", 80],
    "semi": ["error", "never"],
    "indent": ["off", "always"],
    "comma-dangle": ["error", "never"],
    "arrow-parens": ["error", "as-needed"],
    "consistent-return": ["off", "always"],
    "no-useless-escape": ["off", "always"],
    "quote-props": ["error", "consistent-as-needed"],
    "vue/script-indent": ["error", 2, { "baseIndent": 1 }], 
    "import/no-unresolved": ["off", "always"],
    "import/extensions": ["off", "always", {
      "js": "never",
      "vue": "never",
      "json": "never"
    }]  
  }
}

What did you do? Please include the actual source code causing the issue.

I ran the lint to a file that contains:

const typeGroup = obj =>
  !emptyObject(obj) && !typeLeaf(obj)

What actually happened? Please include the actual, raw output from ESLint.

yarn run v1.5.1
$ eslint --ext .js,.vue ./src
token.type.endsWith is not a function
TypeError: token.type.endsWith is not a function
    at isComment (/rafael/sample/node_modules/eslint-plugin-vue/lib/utils/indent-common.js:186:118)
    at Array.every (<anonymous>)
    at :matches(Program, VElement[parent.type!='VElement']):exit (/rafael/sample/frontend/node_modules/eslint-plugin-vue/lib/utils/indent-common.js:1523:37)
    at listeners.(anonymous function).forEach.listener (/rafael/sample/frontend/node_modules/eslint/lib/util/safe-emitter.js:47:58)
    at Array.forEach (<anonymous>)
    at Object.emit (/rafael/sample/frontend/node_modules/eslint/lib/util/safe-emitter.js:47:38)
    at NodeEventGenerator.applySelector (/rafael/sices/frontend/node_modules/eslint/lib/util/node-event-generator.js:251:26)
    at NodeEventGenerator.applySelectors (/rafael/sample/frontend/node_modules/eslint/lib/util/node-event-generator.js:280:22)
    at NodeEventGenerator.leaveNode (/rafael/sices/frontend/node_modules/eslint/lib/util/node-event-generator.js:303:14)
    at CodePathAnalyzer.leaveNode (/rafael/sample/frontend/node_modules/eslint/lib/code-path-analysis/code-path-analyzer.js:630:23)
error An unexpected error occurred: "Command failed.
Exit code: 1

It works fine including the braces and return:

const typeGroup = obj => {
  return !emptyObject(obj) && !typeLeaf(obj)
}

With inline statement:

const typeGroup = obj => !emptyObject(obj) && !typeLeaf(obj)

or with parent:

const typeGroup = obj => 
  (!emptyObject(obj) && !typeLeaf(obj))

But got this issue doing this:

const typeGroup = obj =>
  !emptyObject(obj) && !typeLeaf(obj)

[gabaum10]

I'm running into this as well, with a similar setup as above. However, my error is happening internally in a library I have installed, Vuetify. I can't upgrade the chain of deps for babel because of this error.

[gabaum10]

I debugged the "isComment" function that's erroring and am seeing token is not a string in this case:

TokenType {
  label: '!',
  keyword: undefined,
  beforeExpr: true,
  startsExpr: true,
  rightAssociative: false,
  isLoop: false,
  isAssign: false,
  prefix: true,
  postfix: false,
  binop: null,
  updateContext: null }  

That's what the token looks like and is clearly different than the rest. I'm not entirely sure why.

[gabaum10]

Actually, it has nothing to do with the library. It really is as described by @rafaelkendrik . Break a conditional statement to a new line and it'll break your builds. I was able to work around it by removing those breaks, but it's definitely an issue somewhere in the stream.

[mysticatea]

This was resolved. Please upgrade babel-eslint.

Thank you.

[gabaum10]

@mysticatea quick question. Is it fixed the the 9.0.0 beta? Or 8.2.6?

[mysticatea]

@gabaum10 It was 8.2.2.