Fixed false positives when ignoreBEMModifier and captureClassesFromDoc were used together in no-unused-selector and require-selector-used-inside.

Author: ota-meshi

.vscode/settings.json

@@ -2,18 +2,21 @@
  "eslint.validate": [
  "javascript",
  "javascriptreact",
- { "language": "vue", "autoFix": true },
- { "autoFix": true, "language": "typescript" },
+ "vue",
+ "typescript"
  ],
  "typescript.validate.enable": true,
  "javascript.validate.enable": false,
- "eslint.autoFixOnSave": true,
  "eslint.workingDirectories": [
  {"directory": "./", "changeProcessCWD": true },
  {"directory": "./docs/.vuepress", "changeProcessCWD": true }
  ],
  "vetur.validation.script": false,
  "vetur.validation.style": false,
  "css.validate": false,
- "typescript.tsdk": "node_modules/typescript/lib"
+ "typescript.tsdk": "node_modules/typescript/lib",
+ "editor.codeActionsOnSave": {
+ "source.fixAll.eslint": true
+ },
+ "editor.codeActionsOnSaveTimeout": 7500
 }

lib/styles/selectors/query/index.ts

@@ -506,6 +506,12 @@ function* genElementsByClassName(
  // If the class name is documented, it is considered to match all elements.
  yield* elements
  return
+ } else if (removeModifierClassName) {
+ if (removeModifierClassName.matchString(modClassName)) {
+ // If the class name is documented, it is considered to match all elements.
+ yield* elements
+ return
+ }
  }
  }
 

tests/lib/rules/no-unused-selector.ts

@@ -301,6 +301,29 @@ tester.run("no-unused-selector", rule, {
  },
  ],
  },
+ {
+ code: `
+ <template>
+ <div></div>
+ </template>
+ <style scoped>
+ /* .element - doc. */
+ .element {
+ color: green;
+ }
+ .element--mod {
+ color: red;
+ }
+ </style>`,
+ options: [
+ {
+ ignoreBEMModifier: true,
+ captureClassesFromDoc: [
+ "/(\\.[a-z-]+)(?::[a-z-]+)?\\s+-\\s*[^\\r\\n]+/i",
+ ],
+ },
+ ],
+ },
  // ignore nodes
  `
  <template>

tests/lib/rules/require-selector-used-inside.ts

@@ -262,6 +262,29 @@ tester.run("require-selector-used-inside", rule, {
  },
  ],
  },
+ {
+ code: `
+ <template>
+ <div></div>
+ </template>
+ <style scoped>
+ /* .element - doc. */
+ .element {
+ color: green;
+ }
+ .element--mod {
+ color: red;
+ }
+ </style>`,
+ options: [
+ {
+ ignoreBEMModifier: true,
+ captureClassesFromDoc: [
+ "/(\\.[a-z-]+)(?::[a-z-]+)?\\s+-\\s*[^\\r\\n]+/i",
+ ],
+ },
+ ],
+ },
  // ignore nodes
  `
  <template>