Merge branch '44589-problem-with-prettier-setting-trailingcomma-all' into 'master'

Resolve "Problem with prettier setting trailingComma: all"

Closes #44589

See merge request gitlab-org/gitlab-ce!17967

.babelrc

@@ -1,20 +1,20 @@
 {
-  "presets": [
-    ["latest", { "es2015": { "modules": false } }],
-    "stage-2"
-  ],
+  "presets": [["latest", { "es2015": { "modules": false } }], "stage-2"],
   "env": {
     "coverage": {
       "plugins": [
-        ["istanbul", {
-          "exclude": [
-            "spec/javascripts/**/*",
-            "app/assets/javascripts/locale/**/app.js"
-          ]
-        }],
-        ["transform-define", {
-          "process.env.BABEL_ENV": "coverage"
-        }]
+        [
+          "istanbul",
+          {
+            "exclude": ["spec/javascripts/**/*", "app/assets/javascripts/locale/**/app.js"]
+          }
+        ],
+        [
+          "transform-define",
+          {
+            "process.env.BABEL_ENV": "coverage"
+          }
+        ]
       ]
     }
   }

.eslintignore

@@ -1,11 +1,12 @@
+/app/assets/javascripts/locale/**/app.js
+/config/
 /builds/
 /coverage/
 /coverage-javascript/
 /node_modules/
 /public/
+/scripts/
 /tmp/
 /vendor/
 karma.config.js
 webpack.config.js
-svg.config.js
-/app/assets/javascripts/locale/**/app.js

.prettierignore

@@ -1,6 +1,5 @@
-/config/
+/app/assets/javascripts/locale/**/app.js
 /node_modules/
 /public/
 /vendor/
-karma.config.js
-webpack.config.js
+/tmp/

.prettierrc

@@ -1,5 +1,13 @@
 {
   "printWidth": 100,
   "singleQuote": true,
-  "trailingComma": "all"
+  "trailingComma": "es5",
+  "overrides": [
+    {
+      "files": ["**/app/**/*", "**/spec/**/*"],
+      "options": {
+        "trailingComma": "all"
+      }
+    }
+  ]
 }

config/karma.config.js

@@ -5,7 +5,7 @@ var ROOT_PATH = path.resolve(__dirname, '..');
 
 // remove problematic plugins
 if (webpackConfig.plugins) {
-  webpackConfig.plugins = webpackConfig.plugins.filter(function (plugin) {
+  webpackConfig.plugins = webpackConfig.plugins.filter(function(plugin) {
     return !(
       plugin instanceof webpack.optimize.CommonsChunkPlugin ||
       plugin instanceof webpack.optimize.ModuleConcatenationPlugin ||
@@ -24,7 +24,7 @@ module.exports = function(config) {
 
   var karmaConfig = {
     basePath: ROOT_PATH,
-    browsers:  ['ChromeHeadlessCustom'],
+    browsers: ['ChromeHeadlessCustom'],
     customLaunchers: {
       ChromeHeadlessCustom: {
         base: 'ChromeHeadless',
@@ -34,7 +34,7 @@ module.exports = function(config) {
           // escalated kernel privileges (e.g. docker run --cap-add=CAP_SYS_ADMIN)
           '--no-sandbox',
         ],
-      }
+      },
     },
     frameworks: ['jasmine'],
     files: [
@@ -55,7 +55,7 @@ module.exports = function(config) {
       reports: ['html', 'text-summary'],
       dir: 'coverage-javascript/',
       subdir: '.',
-      fixWebpackSourcePaths: true
+      fixWebpackSourcePaths: true,
     };
     karmaConfig.browserNoActivityTimeout = 60000; // 60 seconds
   }

config/webpack.config.js

@@ -1,5 +1,3 @@
-'use strict';
-
 const crypto = require('crypto');
 const fs = require('fs');
 const path = require('path');
@@ -27,10 +25,10 @@ let watchAutoEntries = [];
 function generateEntries() {
   // generate automatic entry points
   const autoEntries = {};
-  const pageEntries = glob.sync('pages/**/index.js', { cwd: path.join(ROOT_PATH, 'app/assets/javascripts') });
-  watchAutoEntries = [
-    path.join(ROOT_PATH, 'app/assets/javascripts/pages/'),
-  ];
+  const pageEntries = glob.sync('pages/**/index.js', {
+    cwd: path.join(ROOT_PATH, 'app/assets/javascripts'),
+  });
+  watchAutoEntries = [path.join(ROOT_PATH, 'app/assets/javascripts/pages/')];
 
   function generateAutoEntries(path, prefix = '.') {
     const chunkPath = path.replace(/\/index\.js$/, '');
@@ -38,16 +36,16 @@ function generateEntries() {
     autoEntries[chunkName] = `${prefix}/${path}`;
   }
 
-  pageEntries.forEach(( path ) => generateAutoEntries(path));
+  pageEntries.forEach(path => generateAutoEntries(path));
 
   autoEntriesCount = Object.keys(autoEntries).length;
 
   const manualEntries = {
-    common:               './commons/index.js',
-    main:                 './main.js',
-    raven:                './raven/index.js',
-    webpack_runtime:      './webpack.js',
-    ide:                  './ide/index.js',
+    common: './commons/index.js',
+    main: './main.js',
+    raven: './raven/index.js',
+    webpack_runtime: './webpack.js',
+    ide: './ide/index.js',
   };
 
   return Object.assign(manualEntries, autoEntries);
@@ -91,8 +89,8 @@ const config = {
           {
             loader: 'worker-loader',
             options: {
-              inline: true
-            }
+              inline: true,
+            },
           },
           { loader: 'babel-loader' },
         ],
@@ -103,7 +101,7 @@ const config = {
         loader: 'file-loader',
         options: {
           name: '[name].[hash].[ext]',
-        }
+        },
       },
       {
         test: /katex.css$/,
@@ -113,8 +111,8 @@ const config = {
           {
             loader: 'css-loader',
             options: {
-              name: '[name].[hash].[ext]'
-            }
+              name: '[name].[hash].[ext]',
+            },
           },
         ],
       },
@@ -124,7 +122,7 @@ const config = {
         loader: 'file-loader',
         options: {
           name: '[name].[hash].[ext]',
-        }
+        },
       },
       {
         test: /monaco-editor\/\w+\/vs\/loader\.js$/,
@@ -132,7 +130,7 @@ const config = {
           { loader: 'exports-loader', options: 'l.global' },
           { loader: 'imports-loader', options: 'l=>{},this=>l,AMDLoader=>this,module=>undefined' },
         ],
-      }
+      },
     ],
 
     noParse: [/monaco-editor\/\w+\/vs\//],
@@ -150,10 +148,10 @@ const config = {
           source: false,
           chunks: false,
           modules: false,
-          assets: true
+          assets: true,
         });
         return JSON.stringify(stats, null, 2);
-      }
+      },
     }),
 
     // prevent pikaday from including moment.js
@@ -170,7 +168,7 @@ const config = {
     new NameAllModulesPlugin(),
 
     // assign deterministic chunk ids
-    new webpack.NamedChunksPlugin((chunk) => {
+    new webpack.NamedChunksPlugin(chunk => {
       if (chunk.name) {
         return chunk.name;
       }
@@ -187,9 +185,12 @@ const config = {
         const pagesBase = path.join(ROOT_PATH, 'app/assets/javascripts/pages');
 
         if (m.resource.indexOf(pagesBase) === 0) {
-          moduleNames.push(path.relative(pagesBase, m.resource)
-            .replace(/\/index\.[a-z]+$/, '')
-            .replace(/\//g, '__'));
+          moduleNames.push(
+            path
+              .relative(pagesBase, m.resource)
+              .replace(/\/index\.[a-z]+$/, '')
+              .replace(/\//g, '__')
+          );
         } else {
           moduleNames.push(path.relative(m.context, m.resource));
         }
@@ -197,7 +198,8 @@ const config = {
 
       chunk.forEachModule(collectModuleNames);
 
-      const hash = crypto.createHash('sha256')
+      const hash = crypto
+        .createHash('sha256')
         .update(moduleNames.join('_'))
         .digest('hex');
 
@@ -212,7 +214,10 @@ const config = {
     // copy pre-compiled vendor libraries verbatim
     new CopyWebpackPlugin([
       {
-        from: path.join(ROOT_PATH, `node_modules/monaco-editor/${IS_PRODUCTION ? 'min' : 'dev'}/vs`),
+        from: path.join(
+          ROOT_PATH,
+          `node_modules/monaco-editor/${IS_PRODUCTION ? 'min' : 'dev'}/vs`
+        ),
         to: 'monaco-editor/vs',
         transform: function(content, path) {
           if (/\.js$/.test(path) && !/worker/i.test(path) && !/typescript/i.test(path)) {
@@ -225,23 +230,23 @@ const config = {
             );
           }
           return content;
-        }
-      }
+        },
+      },
     ]),
   ],
 
   resolve: {
     extensions: ['.js'],
     alias: {
-      '~':              path.join(ROOT_PATH, 'app/assets/javascripts'),
-      'emojis':         path.join(ROOT_PATH, 'fixtures/emojis'),
-      'empty_states':   path.join(ROOT_PATH, 'app/views/shared/empty_states'),
-      'icons':          path.join(ROOT_PATH, 'app/views/shared/icons'),
-      'images':         path.join(ROOT_PATH, 'app/assets/images'),
-      'vendor':         path.join(ROOT_PATH, 'vendor/assets/javascripts'),
-      'vue$':           'vue/dist/vue.esm.js',
-      'spec':           path.join(ROOT_PATH, 'spec/javascripts'),
-    }
+      '~': path.join(ROOT_PATH, 'app/assets/javascripts'),
+      emojis: path.join(ROOT_PATH, 'fixtures/emojis'),
+      empty_states: path.join(ROOT_PATH, 'app/views/shared/empty_states'),
+      icons: path.join(ROOT_PATH, 'app/views/shared/icons'),
+      images: path.join(ROOT_PATH, 'app/assets/images'),
+      vendor: path.join(ROOT_PATH, 'vendor/assets/javascripts'),
+      vue$: 'vue/dist/vue.esm.js',
+      spec: path.join(ROOT_PATH, 'spec/javascripts'),
+    },
   },
 
   // sqljs requires fs
@@ -256,14 +261,14 @@ if (IS_PRODUCTION) {
     new webpack.NoEmitOnErrorsPlugin(),
     new webpack.LoaderOptionsPlugin({
       minimize: true,
-      debug: false
+      debug: false,
     }),
     new webpack.optimize.ModuleConcatenationPlugin(),
     new webpack.optimize.UglifyJsPlugin({
-      sourceMap: true
+      sourceMap: true,
     }),
     new webpack.DefinePlugin({
-      'process.env': { NODE_ENV: JSON.stringify('production') }
+      'process.env': { NODE_ENV: JSON.stringify('production') },
     })
   );
 
@@ -282,7 +287,7 @@ if (IS_DEV_SERVER) {
     headers: { 'Access-Control-Allow-Origin': '*' },
     stats: 'errors-only',
     hot: DEV_SERVER_LIVERELOAD,
-    inline: DEV_SERVER_LIVERELOAD
+    inline: DEV_SERVER_LIVERELOAD,
   };
   config.plugins.push(
     // watch node_modules for changes if we encounter a missing module compile error
@@ -298,10 +303,12 @@ if (IS_DEV_SERVER) {
           ];
 
           // report our auto-generated bundle count
-          console.log(`${autoEntriesCount} entries from '/pages' automatically added to webpack output.`);
+          console.log(
+            `${autoEntriesCount} entries from '/pages' automatically added to webpack output.`
+          );
 
           callback();
-        })
+        });
       },
     }
   );

scripts/frontend/frontend_script_utils.js

@@ -1,4 +1,3 @@
-/* eslint import/no-commonjs: "off" */
 const execFileSync = require('child_process').execFileSync;
 
 const exec = (command, args) => {
@@ -18,12 +17,7 @@ const execGitCmd = args =>
 
 module.exports = {
   getStagedFiles: fileExtensionFilter => {
-    const gitOptions = [
-      'diff',
-      '--name-only',
-      '--cached',
-      '--diff-filter=ACMRTUB',
-    ];
+    const gitOptions = ['diff', '--name-only', '--cached', '--diff-filter=ACMRTUB'];
     if (fileExtensionFilter) gitOptions.push(...fileExtensionFilter);
     return execGitCmd(gitOptions);
   },

scripts/frontend/prettier.js

@@ -1,4 +1,3 @@
-/* eslint import/no-commonjs: "off", import/no-extraneous-dependencies: "off", no-console: "off" */
 const glob = require('glob');
 const prettier = require('prettier');
 const fs = require('fs');
@@ -22,9 +21,7 @@ const availableExtensions = Object.keys(config.parsers);
 
 console.log(`Loading ${allFiles ? 'All' : 'Staged'} Files ...`);
 
-const stagedFiles = allFiles
-  ? null
-  : getStagedFiles(availableExtensions.map(ext => `*.${ext}`));
+const stagedFiles = allFiles ? null : getStagedFiles(availableExtensions.map(ext => `*.${ext}`));
 
 if (stagedFiles) {
   if (!stagedFiles.length || (stagedFiles.length === 1 && !stagedFiles[0])) {
@@ -41,15 +38,10 @@ let files;
 if (allFiles) {
   const ignore = config.ignore;
   const patterns = config.patterns;
-  const globPattern =
-    patterns.length > 1 ? `{${patterns.join(',')}}` : `${patterns.join(',')}`;
-  files = glob
-    .sync(globPattern, { ignore })
-    .filter(f => allFiles || stagedFiles.includes(f));
+  const globPattern = patterns.length > 1 ? `{${patterns.join(',')}}` : `${patterns.join(',')}`;
+  files = glob.sync(globPattern, { ignore }).filter(f => allFiles || stagedFiles.includes(f));
 } else {
-  files = stagedFiles.filter(f =>
-    availableExtensions.includes(f.split('.').pop()),
-  );
+  files = stagedFiles.filter(f => availableExtensions.includes(f.split('.').pop()));
 }
 
 if (!files.length) {
@@ -81,7 +73,7 @@ prettier
         } else if (!prettier.check(input, options)) {
           if (!didWarn) {
             console.log(
-              '\n===============================\nGitLab uses Prettier to format all JavaScript code.\nPlease format each file listed below or run "yarn prettier-staged-save"\n===============================\n',
+              '\n===============================\nGitLab uses Prettier to format all JavaScript code.\nPlease format each file listed below or run "yarn prettier-staged-save"\n===============================\n'
             );
             didWarn = true;
           }