Merge pull request #27 from Automattic/update/jsx-classname-namespace…

…-dashes jsx-classname-namespace: Validate non-root as containing only expected underscores
Automattic · Dec 6, 2018 · 4ca0b38 · 4ca0b38
1 parent 85ed86b
commit 4ca0b38
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 7 deletions.
diff --git a/packages/eslint-plugin-wpcalypso/CHANGELOG.md b/packages/eslint-plugin-wpcalypso/CHANGELOG.md
@@ -1,3 +1,7 @@
+#### v?.?.? (---)
+
+- Fix: `jsx-classname-namespace` will not allow underscores except as separator after namespace
+
 #### v2.0.0 (August 24, 2016)
 
 - Breaking: Required Node version increased from >=0.10.x to >=4.x ([see ESLint 3.0.0 migration guide](http://eslint.org/docs/user-guide/migrating-to-3.0.0))

diff --git a/packages/eslint-plugin-wpcalypso/lib/rules/jsx-classname-namespace.js b/packages/eslint-plugin-wpcalypso/lib/rules/jsx-classname-namespace.js
@@ -235,8 +235,8 @@ var rule = module.exports = function( context ) {
 
 	return {
 		JSXAttribute: function( node ) {
-			var rawClassName, filename, isRoot, classNames, namespace, prefix,
-				isError, expected;
+			var rawClassName, filename, isRoot, classNames, namespace,
+				prefixPattern, isError, expected;
 
 			if ( 'className' !== node.name.name ) {
 				return;
@@ -262,7 +262,7 @@ var rule = module.exports = function( context ) {
 
 			classNames = rawClassName.value.split( ' ' );
 			namespace = path.basename( path.dirname( filename ) );
-			prefix = namespace + '__';
+			prefixPattern = new RegExp( `^${ namespace }__[a-z0-9-]+$` );
 
 			isError = ! classNames.some( function( className ) {
 				if ( isRoot ) {
@@ -271,10 +271,7 @@ var rule = module.exports = function( context ) {
 
 				// Non-root node should have class name starting with but not
 				// equal to namespace prefix
-				return (
-					0 === className.indexOf( prefix ) &&
-					className !== prefix
-				);
+				return prefixPattern.test( className );
 			} );
 
 			if ( ! isError ) {

diff --git a/packages/eslint-plugin-wpcalypso/tests/lib/rules/jsx-classname-namespace.js b/packages/eslint-plugin-wpcalypso/tests/lib/rules/jsx-classname-namespace.js
@@ -198,6 +198,11 @@ EXPECTED_FOO_PREFIX_ERROR = formatMessage( rule.ERROR_MESSAGE, { expected: 'foo_
 			code: 'export default function() { return <div className="foo__child" />; }',
 			parserOptions: { ecmaFeatures: { jsx: true }, sourceType: 'module' },
 			filename: '/tmp/foo/foo-child.js'
+		},
+		{
+			code: 'export default function() { return <div className="foo__child-example2" />; }',
+			parserOptions: { ecmaFeatures: { jsx: true }, sourceType: 'module' },
+			filename: '/tmp/foo/foo-child.js'
 		}
 	],
 
@@ -442,6 +447,15 @@ EXPECTED_FOO_PREFIX_ERROR = formatMessage( rule.ERROR_MESSAGE, { expected: 'foo_
 			errors: [ {
 				message: EXPECTED_FOO_PREFIX_ERROR
 			} ]
+		},
+		{
+			code: 'export default function() { return <Foo className="foo"><div className="foo__child__example" /></Foo>; }',
+			env: { es6: true },
+			parserOptions: { ecmaFeatures: { jsx: true }, sourceType: 'module' },
+			filename: '/tmp/foo/index.js',
+			errors: [ {
+				message: EXPECTED_FOO_PREFIX_ERROR
+			} ]
 		}
 	]
 } );