eslint-plugin-prettier 3.3.1 → 3.4.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## v3.4.0 (2021-04-15)
+
+* feat: support processor virtual filename ([#401](git@github.com:prettier/eslint-plugin-prettier/issues/401)) ([ee0ccc6](git@github.com:prettier/eslint-plugin-prettier/commit/ee0ccc6ac06d13cd546e78b444e53164f59eb27f))
+* Simplify report logic ([#380](git@github.com:prettier/eslint-plugin-prettier/issues/380)) ([d993f24](git@github.com:prettier/eslint-plugin-prettier/commit/d993f247b5661683af031ab3b93955a0dfe448fa))
+* Update: README.md ([#375](git@github.com:prettier/eslint-plugin-prettier/issues/375)) ([3ea4242](git@github.com:prettier/eslint-plugin-prettier/commit/3ea4242a8d4acdb76eb7e7dca9e44d3e87db70e3))
+
 ## v3.3.1 (2021-01-04)
 
 * fix: add eslint-config-prettier as an optional peer dependency ([#374](git@github.com:prettier/eslint-plugin-prettier/issues/374)) ([d59df27](git@github.com:prettier/eslint-plugin-prettier/commit/d59df27890aaffec9e528ceb3155831a0261848d))

package/README.md

@@ -4,6 +4,8 @@ Runs [Prettier](https://github.com/prettier/prettier) as an [ESLint](http://esli
 
 If your desired formatting does not match Prettier’s output, you should use a different tool such as [prettier-eslint](https://github.com/prettier/prettier-eslint) instead.
 
+Please read [Integrating with linters](https://prettier.io/docs/en/integrating-with-linters.html) before installing.
+
 ## Sample
 
 ```js
@@ -74,20 +76,6 @@ This plugin ships with a `plugin:prettier/recommended` config that sets up both
 
    You can then set Prettier's own options inside a `.prettierrc` file.
 
-3. Some ESLint plugins (such as [eslint-plugin-react](https://github.com/yannickcr/eslint-plugin-react)) also contain rules that conflict with Prettier. Add extra exclusions for the plugins you use like so:
-
-   ```json
-   {
-     "extends": [
-       "plugin:prettier/recommended",
-       "prettier/flowtype",
-       "prettier/react"
-     ]
-   }
-   ```
-
-   For the list of every available exclusion rule set, please see the [readme of eslint-config-prettier](https://github.com/prettier/eslint-config-prettier/blob/master/README.md).
-
 Exactly what does `plugin:prettier/recommended` do? Well, this is what it expands to:
 
 ```json
@@ -102,7 +90,7 @@ Exactly what does `plugin:prettier/recommended` do? Well, this is what it expand
 }
 ```
 
-- `"extends": ["prettier"]` enables the main config from `eslint-config-prettier`, which turns off some ESLint core rules that conflict with Prettier.
+- `"extends": ["prettier"]` enables the config from `eslint-config-prettier`, which turns off some ESLint rules that conflict with Prettier.
 - `"plugins": ["prettier"]` registers this plugin.
 - `"prettier/prettier": "error"` turns on the rule provided by this plugin, which runs Prettier from within ESLint.
 - `"arrow-body-style": "off"` and `"prefer-arrow-callback": "off"` turns off two ESLint core rules that unfortunately are problematic with this plugin – see the next section.

package/eslint-plugin-prettier.js

@@ -9,6 +9,9 @@
 //  Requirements
 // ------------------------------------------------------------------------------
 
+const fs = require('fs');
+const path = require('path');
+
 const {
   showInvisibles,
   generateDifferences
@@ -25,6 +28,9 @@ const { INSERT, DELETE, REPLACE } = generateDifferences;
 // ------------------------------------------------------------------------------
 
 // Lazily-loaded Prettier.
+/**
+ * @type {import('prettier')}
+ */
 let prettier;
 
 // ------------------------------------------------------------------------------
@@ -32,72 +38,49 @@ let prettier;
 // ------------------------------------------------------------------------------
 
 /**
- * Reports an "Insert ..." issue where text must be inserted.
- * @param {RuleContext} context - The ESLint rule context.
- * @param {number} offset - The source offset where to insert text.
- * @param {string} text - The text to be inserted.
+ * Reports a difference.
+ * @param {import('eslint').Rule.RuleContext} context - The ESLint rule context.
+ * @param {import('prettier-linter-helpers').Difference} difference - The difference object.
  * @returns {void}
  */
-function reportInsert(context, offset, text) {
-  const pos = context.getSourceCode().getLocFromIndex(offset);
-  const range = [offset, offset];
-  context.report({
-    message: 'Insert `{{ code }}`',
-    data: { code: showInvisibles(text) },
-    loc: { start: pos, end: pos },
-    fix(fixer) {
-      return fixer.insertTextAfterRange(range, text);
-    }
-  });
-}
+function reportDifference(context, difference) {
+  const { operation, offset, deleteText = '', insertText = '' } = difference;
+  const range = [offset, offset + deleteText.length];
+  const [start, end] = range.map(index =>
+    context.getSourceCode().getLocFromIndex(index)
+  );
 
-/**
- * Reports a "Delete ..." issue where text must be deleted.
- * @param {RuleContext} context - The ESLint rule context.
- * @param {number} offset - The source offset where to delete text.
- * @param {string} text - The text to be deleted.
- * @returns {void}
- */
-function reportDelete(context, offset, text) {
-  const start = context.getSourceCode().getLocFromIndex(offset);
-  const end = context.getSourceCode().getLocFromIndex(offset + text.length);
-  const range = [offset, offset + text.length];
   context.report({
-    message: 'Delete `{{ code }}`',
-    data: { code: showInvisibles(text) },
+    messageId: operation,
+    data: {
+      deleteText: showInvisibles(deleteText),
+      insertText: showInvisibles(insertText)
+    },
     loc: { start, end },
-    fix(fixer) {
-      return fixer.removeRange(range);
-    }
+    fix: fixer => fixer.replaceTextRange(range, insertText)
   });
 }
 
 /**
- * Reports a "Replace ... with ..." issue where text must be replaced.
- * @param {RuleContext} context - The ESLint rule context.
- * @param {number} offset - The source offset where to replace deleted text
- with inserted text.
- * @param {string} deleteText - The text to be deleted.
- * @param {string} insertText - The text to be inserted.
- * @returns {void}
+ * Given a filepath, get the nearest path that is a regular file.
+ * The filepath provided by eslint may be a virtual filepath rather than a file
+ * on disk. This attempts to transform a virtual path into an on-disk path
+ * @param {string} filepath
+ * @returns {string}
  */
-function reportReplace(context, offset, deleteText, insertText) {
-  const start = context.getSourceCode().getLocFromIndex(offset);
-  const end = context
-    .getSourceCode()
-    .getLocFromIndex(offset + deleteText.length);
-  const range = [offset, offset + deleteText.length];
-  context.report({
-    message: 'Replace `{{ deleteCode }}` with `{{ insertCode }}`',
-    data: {
-      deleteCode: showInvisibles(deleteText),
-      insertCode: showInvisibles(insertText)
-    },
-    loc: { start, end },
-    fix(fixer) {
-      return fixer.replaceTextRange(range, insertText);
+function getOnDiskFilepath(filepath) {
+  try {
+    if (fs.statSync(filepath).isFile()) {
+      return filepath;
     }
-  });
+  } catch (err) {
+    // https://github.com/eslint/eslint/issues/11989
+    if (err.code === 'ENOTDIR') {
+      return getOnDiskFilepath(path.dirname(filepath));
+    }
+  }
+
+  return filepath;
 }
 
 // ------------------------------------------------------------------------------
@@ -143,7 +126,12 @@ module.exports = {
             },
             additionalProperties: true
           }
-        ]
+        ],
+        messages: {
+          [INSERT]: 'Insert `{{ insertText }}`',
+          [DELETE]: 'Delete `{{ deleteText }}`',
+          [REPLACE]: 'Replace `{{ deleteText }}` with `{{ insertText }}`'
+        }
       },
       create(context) {
         const usePrettierrc =
@@ -152,6 +140,14 @@ module.exports = {
           (context.options[1] && context.options[1].fileInfoOptions) || {};
         const sourceCode = context.getSourceCode();
         const filepath = context.getFilename();
+        // Processors that extract content from a file, such as the markdown
+        // plugin extracting fenced code blocks may choose to specify virtual
+        // file paths. If this is the case then we need to resolve prettier
+        // config and file info using the on-disk path instead of the virtual
+        // path.
+        // See https://github.com/eslint/eslint/issues/11989 for ideas around
+        // being able to get this value directly from eslint in the future.
+        const onDiskFilepath = getOnDiskFilepath(filepath);
         const source = sourceCode.text;
 
         return {
@@ -164,13 +160,13 @@ module.exports = {
             const eslintPrettierOptions = context.options[0] || {};
 
             const prettierRcOptions = usePrettierrc
-              ? prettier.resolveConfig.sync(filepath, {
+              ? prettier.resolveConfig.sync(onDiskFilepath, {
                   editorconfig: true
                 })
               : null;
 
             const prettierFileInfo = prettier.getFileInfo.sync(
-              filepath,
+              onDiskFilepath,
               Object.assign(
                 {},
                 { resolveConfig: true, ignorePath: '.prettierignore' },
@@ -185,7 +181,7 @@ module.exports = {
 
             const initialOptions = {};
 
-            // ESLint suppports processors that let you extract and lint JS
+            // ESLint supports processors that let you extract and lint JS
             // fragments within a non-JS language. In the cases where prettier
             // supports the same language as a processor, we want to process
             // the provided source code as javascript (as ESLint provides the
@@ -193,9 +189,14 @@ module.exports = {
             // based off the filename. Otherwise, for instance, on a .md file we
             // end up trying to run prettier over a fragment of JS using the
             // markdown parser, which throws an error.
-            // If we can't infer the parser from from the filename, either
-            // because no filename was provided or because there is no parser
-            // found for the filename, use javascript.
+            // Processors may set virtual filenames for these extracted blocks.
+            // If they do so then we want to trust the file extension they
+            // provide, and no override is needed.
+            // If the processor does not set any virtual filename (signified by
+            // `filepath` and `onDiskFilepath` being equal) AND we can't
+            // infer the parser from the filename, either because no filename
+            // was provided or because there is no parser found for the
+            // filename, use javascript.
             // This is added to the options first, so that
             // prettierRcOptions and eslintPrettierOptions can still override
             // the parser.
@@ -207,6 +208,7 @@ module.exports = {
             //   from the file type.
             const parserBlocklist = [null, 'graphql', 'markdown', 'html'];
             if (
+              filepath === onDiskFilepath &&
               parserBlocklist.indexOf(prettierFileInfo.inferredParser) !== -1
             ) {
               // Prettier v1.16.0 renamed the `babylon` parser to `babel`
@@ -227,7 +229,7 @@ module.exports = {
             );
 
             // prettier.format() may throw a SyntaxError if it cannot parse the
-            // source code it is given. Ususally for JS files this isn't a
+            // source code it is given. Usually for JS files this isn't a
             // problem as ESLint will report invalid syntax before trying to
             // pass it to the prettier plugin. However this might be a problem
             // for non-JS languages that are handled by a plugin. Notably Vue
@@ -245,7 +247,7 @@ module.exports = {
               let message = 'Parsing error: ' + err.message;
 
               // Prettier's message contains a codeframe style preview of the
-              // invalid code and the line/column at which the error occured.
+              // invalid code and the line/column at which the error occurred.
               // ESLint shows those pieces of information elsewhere already so
               // remove them from the message
               if (err.codeFrame) {
@@ -263,32 +265,9 @@ module.exports = {
             if (source !== prettierSource) {
               const differences = generateDifferences(source, prettierSource);
 
-              differences.forEach(difference => {
-                switch (difference.operation) {
-                  case INSERT:
-                    reportInsert(
-                      context,
-                      difference.offset,
-                      difference.insertText
-                    );
-                    break;
-                  case DELETE:
-                    reportDelete(
-                      context,
-                      difference.offset,
-                      difference.deleteText
-                    );
-                    break;
-                  case REPLACE:
-                    reportReplace(
-                      context,
-                      difference.offset,
-                      difference.deleteText,
-                      difference.insertText
-                    );
-                    break;
-                }
-              });
+              for (const difference of differences) {
+                reportDifference(context, difference);
+              }
             }
           }
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-prettier",
-  "version": "3.3.1",
+  "version": "3.4.0",
   "description": "Runs prettier as an eslint rule",
   "keywords": [
     "eslint",