fix(index): prevent adding scope to percentages with decimals

Author: kcmr

develop/index.js

@@ -9,7 +9,11 @@ const fixture = 'develop';
 const fixturePath = path.join(process.cwd(), 'tests', 'fixtures');
 const input = fs.readFileSync(path.join(fixturePath, `${fixture}.css`), 'utf-8');
 
-const write = (result) => fs.writeFileSync(path.join(fixturePath, `${fixture}-processed.css`), result.css, 'utf-8');
+const write = (result) => {
+	console.log(`\n⚡️ ${fixture}-processed.css updated\n`);
+
+	fs.writeFileSync(path.join(fixturePath, `${fixture}-processed.css`), result.css);
+};
 
 postcss()
 	.use(plugin)

lib/index.js

@@ -20,11 +20,11 @@ module.exports = postcss.plugin('postcss-selector-scope', (options = {}) => {
 	 * :root
 	 * from, to and percentages used in keyframes
 	 */
-	const defaultExclusions = [/^:root/, /^from/, /^to/, /^\d+%/];
+	const defaultExclusions = [/^:root/, /^from/, /^to/, /^(\d{1,3}(?:\.\d*)?)%$/];
 	const allExclusions = settings.exclude.concat(defaultExclusions);
 	const excludedSelectors = allExclusions.map((value) => {
 		if (typeof value === 'string') {
-			return new RegExp(`${value}`, 'i');
+			return new RegExp(value, 'i');
 		}
 
 		if (value instanceof RegExp) {

tests/fixtures/develop.css

@@ -62,6 +62,19 @@ a:hover,
 	to {}
 }
 
+@keyframes any {
+	0%,
+	66.64%,
+	100% {
+	  color: red;
+	}
+	8.33%,
+	41.65%,
+	58.31% {
+	  color: red;
+	}
+}
+
 /* media queries */
 @media (min-width: 1024px) {
 	.class {

tests/lib/index.spec.js

@@ -32,6 +32,9 @@ describe('postcss-selector-scope', () => {
 					@keyframes any {
 						from {}
 						50% {}
+						66.34%,
+						75.123%,
+						67.2% {}
 						to {}
 					}
 				`;