Scripts: Include YAML files in prettification

.github/workflows/bundle-size.yml

@@ -15,7 +15,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - uses: preactjs/compressed-size-action@7d87f60a6b0c7d193b8183ce859ed00b356ea92f # v2.1.0
               with:

.github/workflows/create-block.yml

@@ -20,7 +20,7 @@ jobs:
             - name: Use Node.js ${{ matrix.node }}.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: ${{ matrix.node }}
+                  node-version: ${{ matrix.node }}
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/end2end-test.yml

@@ -24,7 +24,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/pull-request-automation.yml

@@ -17,7 +17,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             # Changing into the action's directory and running `npm install` is much
             # faster than a full project-wide `npm ci`.

.github/workflows/rnmobile-android-runner.yml

@@ -19,7 +19,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Restore npm cache
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/rnmobile-ios-runner.yml

@@ -19,7 +19,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Restore npm cache
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/static-checks.yml

@@ -19,7 +19,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/storybook-pages.yml

@@ -17,7 +17,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

.github/workflows/unit-test.yml

@@ -24,7 +24,7 @@ jobs:
             - name: Use Node.js ${{ matrix.node }}.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: ${{ matrix.node }}
+                  node-version: ${{ matrix.node }}
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4
@@ -60,7 +60,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4
@@ -102,7 +102,7 @@ jobs:
             - name: Use Node.js 14.x
               uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea # v2.1.5
               with:
-                node-version: 14.x
+                  node-version: 14.x
 
             - name: Cache node modules
               uses: actions/cache@26968a09c0ea4f3e233fdddbafd1166051a095f6 # v2.1.4

bin/test-create-block.sh

@@ -25,8 +25,8 @@ status "Scaffolding block..."
 npx wp-create-block esnext-test --no-wp-scripts
 cd esnext-test
 
-status "Formatting JavaScript files..."
-../node_modules/.bin/wp-scripts format-js
+status "Formatting files..."
+../node_modules/.bin/wp-scripts format
 
 status "Building block..."
 ../node_modules/.bin/wp-scripts build

docs/how-to-guides/platform/README.md

@@ -43,7 +43,7 @@ You can then add a scripts section to your package.json file, for example:
 ```json
 	"scripts": {
 		"build": "wp-scripts build",
-		"format:js": "wp-scripts format-js",
+		"format": "wp-scripts format",
 		"lint:js": "wp-scripts lint-js",
 		"start": "wp-scripts start"
 	}

package.json

@@ -229,6 +229,7 @@
 		"fixtures:clean": "rimraf \"packages/e2e-tests/fixtures/blocks/*.+(json|serialized.html)\"",
 		"fixtures:generate": "cross-env GENERATE_MISSING_FIXTURES=y npm run test-unit",
 		"fixtures:regenerate": "npm run fixtures:clean && npm run fixtures:generate",
+		"format": "wp-scripts format",
 		"format-js": "wp-scripts format-js",
 		"format-php": "wp-env run composer run-script format",
 		"lint": "concurrently \"npm run lint-lockfile\" \"npm run lint-js\" \"npm run lint-pkg-json\" \"npm run lint-css\"",
@@ -291,8 +292,8 @@
 		"*.scss": [
 			"wp-scripts lint-style"
 		],
-		"*.{js,ts,tsx}": [
-			"wp-scripts format-js",
+		"*.{js,ts,tsx,yml}": [
+			"wp-scripts format",
 			"wp-scripts lint-js"
 		],
 		"{docs/{toc.json,tool/*.js},packages/{*/README.md,components/src/*/**/README.md}}": [

packages/create-block/CHANGELOG.md

@@ -4,6 +4,7 @@
 
 ### Enhancement
 
+-   Rename `format:js` script to `format` ([#30240](https://github.com/WordPress/gutenberg/pull/30240)).
 -   Updated `.editorconfig` template files to work with automatic file formatting ([#30794](https://github.com/WordPress/gutenberg/pull/30794)).
 
 ## 2.2.0 (2021-04-06)

packages/create-block/README.md

@@ -90,10 +90,10 @@ $ npm run build
 Builds the code for production. [Learn more](/packages/scripts#build).
 
 ```bash
-$ npm run format:js
+$ npm run format
 ```
 
-Formats JavaScript files. [Learn more](/packages/scripts#format-js).
+Formats files. [Learn more](/packages/scripts#format).
 
 ```bash
 $ npm run lint:css

packages/create-block/lib/init-package-json.js

@@ -37,7 +37,7 @@ module.exports = async ( {
 				main: wpScripts && 'build/index.js',
 				scripts: wpScripts && {
 					build: 'wp-scripts build',
-					'format:js': 'wp-scripts format-js',
+					format: 'wp-scripts format',
 					'lint:css': 'wp-scripts lint-style',
 					'lint:js': 'wp-scripts lint-js',
 					start: 'wp-scripts start',

packages/create-block/lib/init-wp-scripts.js

@@ -22,7 +22,7 @@ module.exports = async ( { slug } ) => {
 
 	info( '' );
 	info( 'Formatting JavaScript files.' );
-	await command( 'npm run format:js', {
+	await command( 'npm run format', {
 		cwd,
 	} );
 

packages/create-block/lib/scaffold.js

@@ -118,8 +118,8 @@ module.exports = async (
 		code( '  $ npm run build' );
 		info( '    Builds the code for production.' );
 		info( '' );
-		code( '  $ npm run format:js' );
-		info( '    Formats JavaScript files.' );
+		code( '  $ npm run format' );
+		info( '    Formats files.' );
 		info( '' );
 		code( '  $ npm run lint:css' );
 		info( '    Lints CSS files.' );

packages/scripts/CHANGELOG.md

@@ -4,6 +4,8 @@
 
 ### Breaking Changes
 
+-   Rename `format-js` script to `format` ([#30240](https://github.com/WordPress/gutenberg/pull/30240)).
+-   Include YAML files when formatting files with `format` ([#30240](https://github.com/WordPress/gutenberg/pull/30240)).
 -   The bundled `css-loader` dependency has been updated from requiring `^3.5.2` to requiring `^5.1.3` ([#27821](https://github.com/WordPress/gutenberg/pull/27821)).
 -   The bundled `mini-css-extract-plugin` dependency has been updated from requiring `^0.9.0` to requiring `^1.3.9` ([#27821](https://github.com/WordPress/gutenberg/pull/27821)).
 -   The bundled `postcss-loader` dependency has been updated from requiring `^3.0.0` to requiring `^4.2.0` ([#27821](https://github.com/WordPress/gutenberg/pull/27821)).

packages/scripts/README.md

@@ -30,7 +30,7 @@ _Example:_
 		"build": "wp-scripts build",
 		"check-engines": "wp-scripts check-engines",
 		"check-licenses": "wp-scripts check-licenses",
-		"format:js": "wp-scripts format-js",
+		"format": "wp-scripts format",
 		"lint:css": "wp-scripts lint-style",
 		"lint:js": "wp-scripts lint-js",
 		"lint:md:docs": "wp-scripts lint-md-docs",
@@ -128,27 +128,27 @@ _Flags_:
 -   `--gpl2`: Validates against [GPLv2 license compatibility](https://www.gnu.org/licenses/license-list.en.html)
 -   `--ignore=a,b,c`: A comma-separated set of package names to ignore for validation. This is intended to be used primarily in cases where a dependency’s `license` field is malformed. It’s assumed that any `ignored` package argument would be manually vetted for compatibility by the project owner.
 
-### `format-js`
+### `format`
 
-It helps to enforce coding style guidelines for your JavaScript files by formatting source code in a consistent way.
+It helps to enforce coding style guidelines for your files (JavaScript, YAML) by formatting source code in a consistent way.
 
 _Example:_
 
 ```json
 {
 	"scripts": {
-		"format:js": "wp-scripts format-js",
-		"format:js:src": "wp-scripts format-js ./src"
+		"format": "wp-scripts format",
+		"format:src": "wp-scripts format ./src"
 	}
 }
 ```
 
 This is how you execute the script with presented setup:
 
--   `npm run format:js` - formats JavaScript files in the entire project’s directories.
--   `npm run format:js:src` - formats JavaScript files in the project’s `src` subfolder’s directories.
+-   `npm run format` - formats files in the entire project’s directories.
+-   `npm run format:src` - formats files in the project’s `src` subfolder’s directories.
 
-When you run commands similar to the `npm run format:js:src` example above, you can provide a file, a directory, or `glob` syntax or any combination of them.
+When you run commands similar to the `npm run format:src` example above, you can provide a file, a directory, or `glob` syntax or any combination of them.
 
 By default, files located in `build`, `node_modules`, and `vendor` folders are ignored.
 

packages/scripts/scripts/format-js.js

@@ -1,116 +1,36 @@
-/**
- * External dependencies
- */
-const { exit, stdout } = require( 'process' );
-
 /**
  * External dependencies
  */
 const chalk = require( 'chalk' );
-const { sync: spawn } = require( 'cross-spawn' );
-const { sync: resolveBin } = require( 'resolve-bin' );
-const { sync: dirGlob } = require( 'dir-glob' );
-const { sync: readPkgUp } = require( 'read-pkg-up' );
 
 /**
  * Internal dependencies
  */
-const {
-	fromConfigRoot,
-	fromProjectRoot,
-	getArgFromCLI,
-	getFileArgsFromCLI,
-	hasArgInCLI,
-	hasPrettierConfig,
-	hasProjectFile,
-} = require( '../utils' );
-
-// Check if the project has wp-prettier installed and if the project has a Prettier config
-function checkPrettier() {
-	try {
-		const prettierResolvePath = require.resolve( 'prettier' );
-		const prettierPackageJson = readPkgUp( { cwd: prettierResolvePath } );
-		const prettierPackageName = prettierPackageJson.pkg.name;
-
-		if (
-			! [ 'wp-prettier', '@wordpress/prettier' ].includes(
-				prettierPackageName
-			)
-		) {
-			return {
-				success: false,
-				message:
-					chalk.red(
-						'Incompatible version of Prettier was found in your project\n'
-					) +
-					"You need to install the 'wp-prettier' package to get " +
-					'code formatting compliant with the WordPress coding standards.\n\n',
-			};
-		}
-	} catch {
-		return {
-			success: false,
-			message:
-				chalk.red(
-					"The 'prettier' package was not found in your project\n"
-				) +
-				"You need to install the 'wp-prettier' package under an alias to get " +
-				'code formatting compliant with the WordPress coding standards.\n\n',
-		};
-	}
-
-	return { success: true };
-}
-
-const checkResult = checkPrettier();
-if ( ! checkResult.success ) {
-	stdout.write( checkResult.message );
-	exit( 1 );
-}
-
-// Check for existing config in project, if it exists no command-line args are
-// needed for config, otherwise pass in args to default config in packages
-// See: https://prettier.io/docs/en/configuration.html
-let configArgs = [];
-if ( ! hasPrettierConfig() ) {
-	configArgs = [
-		'--config',
-		require.resolve( '@wordpress/prettier-config' ),
-	];
-}
-
-// If `--ignore-path` is not explicitly specified, use the project's or global .eslintignore
-let ignorePath = getArgFromCLI( '--ignore-path' );
-if ( ! ignorePath ) {
-	if ( hasProjectFile( '.eslintignore' ) ) {
-		ignorePath = fromProjectRoot( '.eslintignore' );
-	} else {
-		ignorePath = fromConfigRoot( '.eslintignore' );
-	}
-}
-const ignoreArgs = [ '--ignore-path', ignorePath ];
-
-// forward the --require-pragma option that formats only files that already have the @format
-// pragma in the first docblock.
-const pragmaArgs = hasArgInCLI( '--require-pragma' )
-	? [ '--require-pragma' ]
-	: [];
-
-// Get the files and directories to format and convert them to globs
-let fileArgs = getFileArgsFromCLI();
-if ( fileArgs.length === 0 ) {
-	fileArgs = [ '.' ];
-}
-
-// Converts `foo/bar` directory to `foo/bar/**/*.js`
-const globArgs = dirGlob( fileArgs, {
-	extensions: [ 'js', 'jsx', 'ts', 'tsx' ],
-} );
-
-const result = spawn(
-	resolveBin( 'prettier' ),
-	[ '--write', ...configArgs, ...ignoreArgs, ...pragmaArgs, ...globArgs ],
-	{ stdio: 'inherit' }
-);
-
-process.exit( result.status );
+const { getNodeArgsFromCLI, spawnScript } = require( '../utils' );
+
+const { scriptArgs, nodeArgs } = getNodeArgsFromCLI();
+
+const keypress = async () => {
+	process.stdin.setRawMode( true );
+	return new Promise( ( resolve ) =>
+		process.stdin.once( 'data', () => {
+			process.stdin.setRawMode( false );
+			resolve();
+		} )
+	);
+};
+
+( async () => {
+	const message =
+		`Please note that the ${ chalk.red(
+			'format-js'
+		) } script has been renamed to ${ chalk.green( 'format' ) }.\n` +
+		"If you're calling it from any of your own scripts, please update them accordingly.\n" +
+		'Press any key to continiue.';
+
+	// eslint-disable-next-line no-console
+	console.log( message );
+
+	await keypress();
+	spawnScript( 'format', scriptArgs, nodeArgs );
+} )();