[BUG] vue/attributes-order: always-error

[sense-it-gmbh]

Tell us about your environment

• ESLint version: 5.16.0
• eslint-plugin-vue version: 6.2.0
• Node version: v8.12.0

Please show your full configuration:

const INLINE_ELEMENTS = [
  'a',
  'abbr',
  'audio',
  'b',
  'bdi',
  'bdo',
  'canvas',
  'cite',
  'code',
  'data',
  'del',
  'dfn',
  'em',
  'i',
  'iframe',
  'ins',
  'kbd',
  'label',
  'map',
  'mark',
  'noscript',
  'object',
  'output',
  'picture',
  'q',
  'ruby',
  's',
  'samp',
  'small',
  'span',
  'strong',
  'sub',
  'sup',
  'svg',
  'time',
  'u',
  'var',
  'video'
]

const ERROR = 'error'
const WARN = 'warn'
const OFF = 'off'

module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/essential',
    'plugin:vue/strongly-recommended',
    'plugin:vue/recommended',
    '@vue/standard'
  ],
  globals: {
    __VERSION__: true
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? ERROR : OFF,
    'no-debugger': process.env.NODE_ENV === 'production' ? ERROR : OFF,
    'indent': [ERROR, 2],
    'no-unused-vars': WARN,
    'vue/html-indent': [ERROR, 2, {
      attribute: 2,
      baseIndent: 1,
      closeBracket: 0,
      alignAttributesVertically: false,
      ignores: []
    }],
    'vue/html-self-closing': [WARN, {
      html: {
        normal: 'never',
        void: 'any',
        component: 'any'
      },
      svg: 'any',
      math: 'any'
    }],
    'vue/multiline-html-element-content-newline': [WARN, {
      ignoreWhenEmpty: true,
      ignores: ['v-btn', 'v-icon', ...INLINE_ELEMENTS],
      allowEmptyLines: false
    }],
    'vue/name-property-casing': [ERROR, 'PascalCase'],
    'vue/singleline-html-element-content-newline': [WARN, {
      ignoreWhenNoAttributes: true,
      ignoreWhenEmpty: true,
      ignores: ['v-btn', 'v-icon', ...INLINE_ELEMENTS]
    }],
    'vue/array-bracket-spacing': [ERROR, 'always', {
      objectsInArrays: false,
      arraysInArrays: false
    }],
    'vue/object-curly-spacing': [ERROR, 'always'],
    'vue/arrow-spacing': [ERROR],
    'vue/block-spacing': [ERROR],
    'vue/brace-style': [ERROR],
    'vue/camelcase': [ERROR],
    'vue/comma-dangle': [ERROR],
    'vue/component-name-in-template-casing': [ERROR, 'kebab-case'],
    'vue/dot-location': [ERROR, 'property'],
    'vue/eqeqeq': [ERROR],
    'vue/key-spacing': [ERROR],
    'vue/keyword-spacing': [ERROR],
    'vue/match-component-file-name': [ERROR, {
      shouldMatchCase: false,
      extensions: ['vue']
    }],
    'vue/no-boolean-default': [ERROR, 'default-false'],
    'vue/no-deprecated-scope-attribute': [ERROR],
    'vue/space-infix-ops': [ERROR],
    'vue/space-unary-ops': [ERROR, {
      words: true,
      nonwords: false
    }],
    'vue/attributes-order': [ERROR, {
      'alphabetical': true
    }]
  },
  parserOptions: {
    parser: 'babel-eslint'
  },
  overrides: [{
    files: [
      '**/__tests__/*.{j,t}s?(x)'
    ],
    env: {
      mocha: true
    }
  }]
}

What did you do?

either:

<v-img
    v-if="dataNotLoaded"
    v-show="tempoaryHidden"
/>

or:

<v-img
    v-show="tempoaryHidden"
    v-if="dataNotLoaded"
/>

What did you expect to happen?

One of the above examples is accepted as valid.

Since the alphabetical option is true 'v-if before v-show' should be accepted.

What actually happened?

None of the examples gets accepted.

either:

  132:15  error  Attribute "v-show" should go before "v-if"  vue/attributes-order

or:

  132:15  error  Attribute "v-if" should go before "v-show"        vue/attributes-order

EDIT: this seems to happen for all directives and also for events that have a modifier like @keydown.enter or @keydown.escape.

[ota-meshi]

Thank you for this issue.
I will fix this bug.

[sense-it-gmbh]

@ota-meshi thanks for your fast reaction.

I have an update: This seems to be a problem with directives in general. The same happend to me with:

        <v-img
            ref="image"
            v-test-e2e="'form-identificationPoint-map'"
            v-resize="recalculateMaxImageHeight"
        ></v-img>

No matter wich is first ESLint will complain always that the other one should be first. Im now convinced more than ever that this issue is related to #1053