[Prettier] Add Prettier dependency, to format web files (#15932)

* Add prettier

* Integrate prettier with presubmit format checks.

* Use the usual presubmit diff for Prettier to support --files option.

* Disable prettier presubmit check.

---------

Co-authored-by: Aleksey Khoroshilov <[email protected]>

.eslintrc.js

@@ -4,8 +4,8 @@
 // You can obtain one at https://mozilla.org/MPL/2.0/.
 
 module.exports = {
-  'root': true, /* Don't read chromium's eslint config (https://eslint.org/docs/user-guide/configuring/configuration-files#cascading-and-hierarchy) */
-  'extends': 'standard-with-typescript',
+  'root': true /* Don't read chromium's eslint config (https://eslint.org/docs/user-guide/configuring/configuration-files#cascading-and-hierarchy) */,
+  'extends': ['standard-with-typescript', 'prettier'],
   'ignorePatterns': [
     '.storybook/*',
     'build/*',
@@ -21,10 +21,7 @@ module.exports = {
     'es6': true,
     'jest/globals': true
   },
-  'plugins': [
-    'jest',
-    'licenses'
-  ],
+  'plugins': ['jest', 'licenses'],
   'globals': {
     'chrome': 'readonly'
   },
@@ -67,10 +64,6 @@ module.exports = {
         ]
       }
     ],
-    'quote-props': [
-      'error',
-      'consistent'
-    ],
     'object-shorthand': 0,
     'n/no-callback-literal': 0,
     '@typescript-eslint/await-thenable': 0,

.prettierrc.js

@@ -0,0 +1,13 @@
+// Copyright (c) 2022 The Brave Authors. All rights reserved.
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v. 2.0. If a copy of the MPL was not distributed with this file,
+// You can obtain one at https://mozilla.org/MPL/2.0/.
+
+module.exports = {
+  'trailingComma': 'none',
+  'tabWidth': 2,
+  'semi': false,
+  'singleQuote': true,
+  'bracketSameLine': false,
+  'quoteProps': 'preserve'
+}

PRESUBMIT.py

@@ -7,9 +7,10 @@
 import os
 import sys
 
-import import_inline
+import brave_node
 import chromium_presubmit_overrides
 import git_cl
+import import_inline
 import override_utils
 
 USE_PYTHON3 = True
@@ -54,6 +55,39 @@ def CheckPatchFormatted(input_api, output_api):
 
     is_format_required = git_cl_format_code == 2
 
+    if not is_format_required or input_api.PRESUBMIT_FIX:
+        # Use Prettier to format other file types.
+        files_to_check = (
+            # Enable when files will be formatted.
+            # r'.+\.js$',
+            # r'.+\.ts$',
+            # r'.+\.tsx$',
+        )
+        files_to_skip = input_api.DEFAULT_FILES_TO_SKIP
+
+        file_filter = lambda f: input_api.FilterSourceFile(
+            f, files_to_check=files_to_check, files_to_skip=files_to_skip)
+        affected_files = input_api.AffectedFiles(file_filter=file_filter,
+                                                 include_deletes=False)
+        files_to_format = [f.AbsoluteLocalPath() for f in affected_files]
+
+        node_args = [
+            brave_node.PathInNodeModules('prettier', 'bin-prettier'),
+            '--write' if input_api.PRESUBMIT_FIX else '--check',
+        ]
+
+        files_per_command = 25 if input_api.is_windows else 1000
+        for i in range(0, len(files_to_format), files_per_command):
+            args = node_args + files_to_format[i:i + files_per_command]
+            try:
+                brave_node.RunNode(args)
+            except RuntimeError as err:
+                if 'Forgot to run Prettier?' in str(err):
+                    is_format_required = True
+                    break
+                # Raise on unexpected output. Could be node or prettier issues.
+                raise
+
     if is_format_required:
         if input_api.PRESUBMIT_FIX:
             raise RuntimeError('--fix was passed, but format has failed')

package.json

@@ -306,6 +306,7 @@
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
     "eslint": "8.33.0",
+    "eslint-config-prettier": "8.6.0",
     "eslint-config-standard-with-typescript": "34.0.0",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jest": "27.2.1",
@@ -326,6 +327,7 @@
     "log-update": "3.4.0",
     "mkdirp": "0.5.5",
     "mz": "2.7.0",
+    "prettier": "2.8.4",
     "react": "16.14.0",
     "react-dom": "16.14.0",
     "react-redux": "7.2.2",