Merge pull request #42 from humanmade/add-examples-and-update-rules

Add ESLint config test script with example fixtures

Author: rmccue

.travis.yml

@@ -6,5 +6,13 @@ install:
   - composer install
   - npm install
 
+  # Install for ESLint tests
+  - cd packages/eslint-config-humanmade
+  - npm install
+
+  # Reset
+  - cd ../..
+
 script:
   - vendor/bin/phpunit
+  - node packages/eslint-config-humanmade/fixtures/test-lint-config

packages/eslint-config-humanmade/.editorconfig

@@ -0,0 +1,8 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = tab
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

packages/eslint-config-humanmade/fixtures/fail/component-jsx-parentheses.js

@@ -0,0 +1,15 @@
+import React from 'react';
+
+const World = () => <span>World</span>;
+
+const Hello = () => ( <div>
+	<p>Hello <World /></p>
+</div> );
+
+export default class Test extends React.Component {
+	render() {
+		return <div>
+			<Hello />
+		</div>;
+	}
+}

packages/eslint-config-humanmade/fixtures/fail/variable-declaration.js

@@ -0,0 +1,7 @@
+let obj = [ 'only assigned once' ];
+
+var str = 'default value';
+const str2 = `${ str }, but declared with const`;
+if ( obj[0] === global.condition ) {
+	str2 = 'other value maybe assigned later';
+}

packages/eslint-config-humanmade/fixtures/pass/component-jsx-parentheses.jsx

@@ -0,0 +1,19 @@
+import React from 'react';
+
+const World = () => <span>World</span>;
+
+const Hello = () => (
+	<div>
+		<p>Hello <World /></p>
+	</div>
+);
+
+export default class Test extends React.Component {
+	render() {
+		return (
+			<div>
+				<Hello />
+			</div>
+		);
+	}
+}

packages/eslint-config-humanmade/fixtures/test-lint-config.js

@@ -0,0 +1,74 @@
+/* eslint-disable no-console */
+process.on( 'unhandledRejection', err => {
+	throw err;
+} );
+
+const chalk = require( 'chalk' );
+const join = require( 'path' ).join;
+const { CLIEngine } = require( 'eslint' );
+
+const cli = new CLIEngine( { useEslintrc: true } );
+const formatter = CLIEngine.getFormatter();
+
+const verbose = process.argv.indexOf( '--verbose' ) > -1;
+
+/** Utility to count errors, warnings & processed file count. */
+const count = results => results.reduce( ( counts, file ) => ( {
+	errors: counts.errors + file.errorCount,
+	warnings: counts.warnings + file.warningCount,
+	files: counts.files + 1,
+} ), {
+	errors: 0,
+	warnings: 0,
+	files: 0,
+} );
+
+console.log( 'Running ESLint on fixture directories. Use --verbose for a detailed report.' );
+console.log( '\nLinting `fixtures/fail/**`...' );
+
+const antipatternReport = cli.executeOnFiles( [ join( __dirname, 'fail/**' ) ] );
+const antipatternCounts = count( antipatternReport.results );
+const allFail = antipatternReport.results.reduce( ( didFail, file ) => didFail = didFail && ( file.errorCount > 0 || file.warningCount > 0 ), true );
+
+if ( allFail ) {
+	console.log( chalk.green( 'ESLint logs errors as expected.\n' ) );
+} else if ( antipatternCounts.errors ) {
+	console.log( chalk.bold.red( 'The following files did not produce errors:' ) );
+	antipatternReport.results.forEach( file => {
+		if ( file.errorCount > 0 || file.warningCount > 0 ) {
+			return;
+		}
+
+		console.log( '  ' + file.filePath );
+	} );
+	console.log( '' );
+
+	process.exitCode = 1;
+} else {
+	console.log( chalk.bold.red( 'Errors expected, but none encountered!\n' ) );
+	process.exitCode = 1;
+}
+
+// Log full report when --verbose, or when no errors are reported.
+if ( verbose || ! antipatternCounts.errors ) {
+	console.log( formatter( antipatternReport.results ) );
+}
+
+console.log( 'Linting `fixtures/pass/**`...' );
+
+const exampleReport = cli.executeOnFiles( [ join( __dirname, 'pass/**' ) ] );
+const exampleCounts = count( exampleReport.results );
+
+// Log full report when --verbose, or whenever errors are unexpectedly reported.
+if ( verbose || exampleCounts.errors || exampleCounts.warnings ) {
+	console.log( formatter( exampleReport.results ) );
+}
+
+if ( exampleCounts.errors ) {
+	const { errors } = exampleCounts;
+	console.log( chalk.bold.red( `${ errors } unexpected error${ errors !== 1 ? 's' : '' }!\n` ) );
+	process.exitCode = 1;
+} else {
+	const { files } = exampleCounts;
+	console.log( chalk.green( `${ files } files pass lint.` ) );
+}

packages/eslint-config-humanmade/index.js

@@ -72,6 +72,7 @@ module.exports = {
 			},
 		} ],
 		'object-curly-spacing': [ 'error', 'always' ],
+		'object-property-newline': [ 'error' ],
 		'quotes': [ 'error', 'single' ],
 		'semi-spacing': [ 'error', {
 			'before': false,
@@ -94,5 +95,6 @@ module.exports = {
 		} ],
 		'yoda': [ 'error', 'never' ],
 		'react/jsx-curly-spacing': [ 'error', 'always' ],
+		'react/jsx-wrap-multilines': [ 'error' ],
 	},
 };

packages/eslint-config-humanmade/package.json

@@ -5,6 +5,19 @@
     "type": "git",
     "url": "https://github.com/humanmade/coding-standards.git"
   },
+  "scripts": {
+    "test": "node fixtures/test-lint-config"
+  },
+  "devDependencies": {
+    "babel-eslint": "^7.2.3",
+    "chalk": "^2.3.2",
+    "eslint": "^4.19.0",
+    "eslint-config-react-app": "^0.5.0",
+    "eslint-plugin-flowtype": "^2.21.0",
+    "eslint-plugin-import": "^2.0.1",
+    "eslint-plugin-jsx-a11y": "^2.2.3",
+    "eslint-plugin-react": "^6.4.1"
+  },
   "peerDependencies": {
     "babel-eslint": "^7.0.0",
     "eslint": "^4.19.0",