vue/component-name-in-template-casing transforms <b-button> to <BButton>.

[TitanFighter]

Tell us about your environment

• ESLint version: 5.9.0
• eslint-plugin-vue version: 3.2.1
• Node version: 10.14.1

Please show your full configuration:

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "vue": "^2.5.17"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.2.0",
    "@vue/cli-plugin-eslint": "^3.2.0",
    "@vue/cli-service": "^3.2.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0-0",
    "vue-template-compiler": "^2.5.17"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/recommended",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

What did you do?

1. Create a new project in vue ui with default template;
2. In vue ui open Configuration -> ESLint configuration -> Rules tab + select Error for vue/component-name-in-template-casing + Save settings;
3. Open App.vue and add, for example <b-button>My Button</b-button>. Save changes;
4. npm run lint;
5. Open App.vue again and you will see, that b-button is changes to BButton, because of the rule to transform components to PascalCase. I checked that bootstrap-vue works in camelCase (bButton) and kebab-case (b-button), but not in PascalCase (BButton), probably because in the first part of b-button/BButton there is just 1 letter (I can guess, should be at least 2 instead).

What did you expect to happen?
So, as a result, as I understand, the rule vue/component-name-in-template-casing should not transform component name in case, if the first part of <b-button> has just one letter or if the first letter has lower case + the 2nd letter has upper case + the 3rd letter has lower case (bButton).

What actually happened?
<b-button> and <bButton> are transformed to <BButton>.

Additional info
Same problem happens with Vuetify (commented in #397)

[ota-meshi]

Thank you for this issue.
I opened PR.

[michalsnik]

Hi @TitanFighter I'm going to close this issue, as there is other that propose slightly better solution to this problem: #705 And it's actually in progress in #714