Merge 1e5c101 into b0eb172

future-architect · Apr 22, 2020 · 11fb201 · 11fb201
2 parents b0eb172 + 1e5c101
commit 11fb201
Show file tree

Hide file tree

Showing 5 changed files with 111 additions and 14 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -16,7 +16,8 @@ module.exports = {
     rules: {
         'require-jsdoc': 'error',
         "no-warning-comments": "warn",
-        'no-lonely-if': 'off'
+        'no-lonely-if': 'off',
+        "@mysticatea/ts/ban-ts-ignore": 'off'
     },
     overrides: [
         {

diff --git a/docs/rules/require-scoped.md b/docs/rules/require-scoped.md
@@ -31,6 +31,38 @@ This rule reports the `<style>` tags missing the `scoped` attribute.
 
 </eslint-code-block>
 
+## :wrench: Options
+
+Default is set to `always`.
+
+```json
+{
+  "vue-scoped-css/require-scoped": ["error", "always" | "never"]
+}
+```
+
+- `"always"` (default) ... requires `scoped`.
+- `"never"` ... disallowed `scoped`.
+
+### `"never"`
+
+<eslint-code-block :rules="{'vue-scoped-css/require-scoped': ['error', 'never']}">
+
+```vue
+<template>
+</template>
+
+<!-- ✓ GOOD -->
+<style>
+</style>
+
+<!-- ✗ BAD -->
+<style scoped>
+</style>
+```
+
+</eslint-code-block>
+
 ## :books: Further reading
 
 - [Vue Loader - Scoped CSS]

diff --git a/lib/rules/require-scoped.ts b/lib/rules/require-scoped.ts
@@ -20,12 +20,15 @@ module.exports = {
         fixable: null,
         messages: {
             missing: "Missing `scoped` attribute.",
+            forbidden: "`scoped` attribute are forbidden.",
             add: "Add `scoped` attribute.",
+            remove: "Remove `scoped` attribute.",
         },
-        schema: [],
+        schema: [{ enum: ["always", "never"] }],
         type: "suggestion",
     },
     create(context: RuleContext) {
+        const always = context.options[0] !== "never"
         const styles = getStyleContexts(context).filter(StyleContext.isValid)
         if (!styles.length) {
             return {}
@@ -37,7 +40,7 @@ module.exports = {
          * Reports the given node.
          * @param {ASTNode} node node to report
          */
-        function report(node: AST.VElement) {
+        function reportAlways(node: AST.VElement) {
             reporter.report({
                 node: node.startTag,
                 messageId: "missing",
@@ -50,8 +53,7 @@ module.exports = {
                             return (
                                 close &&
                                 fixer.insertTextBefore(
-                                    // eslint-disable-next-line @mysticatea/ts/ban-ts-ignore, spaced-comment
-                                    /// @ts-ignore
+                                    // @ts-ignore
                                     close,
                                     " scoped",
                                 )
@@ -62,11 +64,39 @@ module.exports = {
             })
         }
 
+        /**
+         * Reports the given node.
+         * @param {ASTNode} node node to report
+         */
+        function reportNever(node: AST.VElement) {
+            const scopedAttr = node.startTag.attributes.find(
+                attr => attr.key.name === "scoped",
+            )
+            reporter.report({
+                node: scopedAttr!,
+                messageId: "forbidden",
+                data: {},
+                suggest: [
+                    {
+                        messageId: "remove",
+                        fix(fixer: Rule.RuleFixer) {
+                            return fixer.remove(
+                                // @ts-ignore
+                                scopedAttr,
+                            )
+                        },
+                    },
+                ],
+            })
+        }
+
         return {
             "Program:exit"() {
                 for (const style of styles) {
-                    if (!style.scoped) {
-                        report(style.styleElement)
+                    if (always && !style.scoped) {
+                        reportAlways(style.styleElement)
+                    } else if (!always && style.scoped) {
+                        reportNever(style.styleElement)
                     }
                 }
             },

diff --git a/tests/lib/rules/require-scoped.ts b/tests/lib/rules/require-scoped.ts
@@ -24,6 +24,15 @@ tester.run("require-scoped", rule, {
         <template>
         </template>
         `,
+        {
+            code: `
+            <template>
+            </template>
+            <style>
+            </style>
+            `,
+            options: ["never"],
+        },
     ],
     invalid: [
         {
@@ -40,8 +49,7 @@ tester.run("require-scoped", rule, {
                     column: 13,
                     endLine: 4,
                     endColumn: 20,
-                    // eslint-disable-next-line @mysticatea/ts/ban-ts-ignore, spaced-comment
-                    /// @ts-ignore
+                    // @ts-ignore
                     suggestions: [
                         {
                             desc: "Add `scoped` attribute.",
@@ -69,8 +77,7 @@ tester.run("require-scoped", rule, {
                     column: 13,
                     endLine: 4,
                     endColumn: 22,
-                    // eslint-disable-next-line @mysticatea/ts/ban-ts-ignore, spaced-comment
-                    /// @ts-ignore
+                    // @ts-ignore
                     suggestions: [
                         {
                             desc: "Add `scoped` attribute.",
@@ -104,5 +111,35 @@ tester.run("require-scoped", rule, {
                   },
               ]
             : []),
+        {
+            code: `
+            <template>
+            </template>
+            <style scoped>
+            </style>
+            `,
+            options: ["never"],
+            errors: [
+                {
+                    messageId: "forbidden",
+                    line: 4,
+                    column: 20,
+                    endLine: 4,
+                    endColumn: 26,
+                    // @ts-ignore
+                    suggestions: [
+                        {
+                            desc: "Remove `scoped` attribute.",
+                            output: `
+            <template>
+            </template>
+            <style >
+            </style>
+            `,
+                        },
+                    ],
+                },
+            ],
+        },
     ],
 })
diff --git a/tests/lib/styles/parser/index.ts b/tests/lib/styles/parser/index.ts
@@ -3,13 +3,10 @@ import assert from "assert"
 import fs from "fs"
 import path from "path"
 
-// eslint-disable-next-line @mysticatea/ts/ban-ts-ignore
 // @ts-ignore
 import CSSStringifier from "postcss/lib/stringifier"
-// eslint-disable-next-line @mysticatea/ts/ban-ts-ignore
 // @ts-ignore
 import SCSSStringifier from "postcss-scss/lib/scss-stringifier"
-// eslint-disable-next-line @mysticatea/ts/ban-ts-ignore
 // @ts-ignore
 import StylusStringifier from "postcss-styl/lib/stringifier"