Add back stylistic rules removed in v10

README.md

@@ -11,10 +11,13 @@
 This linter has been designed / tested with SCSS syntax based on the SCSS guidelines documented in https://sass-guidelin.es/. It is intended for use with SCSS syntax, not Sass (tab style) syntax.
 
 This config:
-- bundles the [`stylelint-scss` plugin pack](https://github.com/stylelint-scss/stylelint-scss) and turns on its rules that check for possible errors
-- bundles the [`postcss-scss` custom syntax](https://github.com/postcss/postcss-scss) and configures it
-- has a peer dependency on [`stylelint ^16.1.0`](https://github.com/stylelint/stylelint) You'll need to install this package in your project
-- has a peer dependency on [`postcss ^8.4.21`](https://github.com/postcss/postcss) You'll need to install this package in your project
+- includes the [`stylelint-scss` plugin module](https://github.com/stylelint-scss/stylelint-scss) and turns on rules for SCSS specific code
+- includes the [`@stylistic/stylelint-plugin` plugin module](https://github.com/stylelint-stylistic/stylelint-stylistic) and turns on rules for stylistic settings
+- includes the [`postcss-scss` custom syntax module](https://github.com/postcss/postcss-scss) and configures it
+- has a peer dependency on [`stylelint`](https://github.com/stylelint/stylelint)
+  - You'll need to install this package in your project
+- has a peer dependency on [`postcss`](https://github.com/postcss/postcss)
+  - You'll need to install this package in your project
 
 # Translations
 

__tests__/README.md

@@ -1,8 +1,8 @@
 # How to add tests
 
-* Create your test file named after the scss lint your you are adding a stylelint rule for. For example, `__tests___/unit/bang-format.test.mjs`
+* Create your test file named after the scss lint your you are adding a stylelint rule for. For example, `__tests___/color-hex-case.test.mjs`
 * Copy the code from one of the other tests into your test new file
-* Update the test so you have .scss code that will produce lint you want to test for
+* Update the test so you have SCSS code that will produce lint you want to test for
 * Look for warnings it generates
 * Copy expected text to test file
 * Run tests again and refine until they pass

__tests__/debug-statement.test.mjs → __tests__/at-rule-disallowed-list.test.mjs

@@ -5,11 +5,11 @@ import stylelint from 'stylelint';
 
 import config from '../index.js';
 
-describe('flags warnings with debug statement scss', () => {
+describe('flags warnings with at-rule-disallowed lint', () => {
 	const invalidScss = (
 `$color-blue: #1c94c6;
 
-.debug {
+.test-selector {
   @debug $color-blue;
 }
 `);

__tests__/at-rule-no-unknown.test.mjs

@@ -0,0 +1,48 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with at-rule-no-unknown lint', () => {
+	const invalidScss = (
+`@unknown { color: #fff; }
+
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 1);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+				'Unexpected unknown at-rule "@unknown" (scss/at-rule-no-unknown)',
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'scss/at-rule-no-unknown',
+			],
+		);
+	});
+});

__tests__/at-rule-no-vendor-prefix.test.mjs

@@ -0,0 +1,51 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with at-rule-no-vendor-prefix lint', () => {
+	const invalidScss = (
+`@-webkit-keyframes anim {
+  0% {
+    opacity: 0;
+  }
+}
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 1);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+				'Unexpected vendor-prefixed at-rule "@-webkit-keyframes" (at-rule-no-vendor-prefix)',
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'at-rule-no-vendor-prefix',
+			],
+		);
+	});
+});

__tests__/empty-rule.test.mjs → __tests__/block-no-empty.test.mjs

@@ -5,9 +5,9 @@ import stylelint from 'stylelint';
 
 import config from '../index.js';
 
-describe('flags warnings with empty rule', () => {
+describe('flags warnings with block-no-empty lint', () => {
 	const invalidScss = (
-`.cat {
+`.test-selector {
 }
 `);
 

__tests__/block-opening-brace-space-before.test.mjs

@@ -0,0 +1,52 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with block-opening-brace-space-before lint', () => {
+	const invalidScss = (
+`.test-selector{ color: #fff; }
+
+.test-selector
+{ color: #fff; }
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 2);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+				'Expected single space before "{" (@stylistic/block-opening-brace-space-before)',
+				'Expected single space before "{" (@stylistic/block-opening-brace-space-before)',
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'@stylistic/block-opening-brace-space-before',
+				'@stylistic/block-opening-brace-space-before',
+			],
+		);
+	});
+});

__tests__/color-hex-case.test.mjs

@@ -0,0 +1,49 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with color-hex-case lint', () => {
+	const invalidScss = (
+`.test-selector {
+  color: #FFF;
+}
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 1);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+				'Expected "#FFF" to be "#fff" (@stylistic/color-hex-case)',
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'@stylistic/color-hex-case',
+			],
+		);
+	});
+});

__tests__/hex-length.test.mjs → __tests__/color-hex-length.test.mjs

@@ -5,7 +5,7 @@ import stylelint from 'stylelint';
 
 import config from '../index.js';
 
-describe('flags warnings with hex color length', () => {
+describe('flags warnings with color-hex-length lint', () => {
 	const invalidScss = (
 `.hexlength {
   color: #ff22ee;

__tests__/color-keyword.test.mjs → __tests__/color-named.test.mjs

@@ -5,10 +5,10 @@ import stylelint from 'stylelint';
 
 import config from '../index.js';
 
-describe('flags warnings with named color keyword', () => {
+describe('flags warnings with color-named lint', () => {
 	const invalidScss = (
-`.colorkeyword {
-	color: green;
+`.test-selector {
+  color: green;
 }
 `);
 

__tests__/hex-validation.test.mjs → __tests__/color-no-invalid-hex.test.mjs

@@ -5,7 +5,7 @@ import stylelint from 'stylelint';
 
 import config from '../index.js';
 
-describe('flags warnings with hex validation', () => {
+describe('flags warnings with color-no-invalid-hex lint', () => {
 	const invalidScss = (
 `.hex-validation {
   background: #ab; // Clearly a typo

__tests__/declaration-bang-space-after.test.mjs

@@ -0,0 +1,52 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with declaration-bang-space-after lint', () => {
+	const invalidScss = (
+`.test-selector { color: #fff ! important; }
+.test-selector { color: #fff! important; }
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 3);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+        'Unexpected whitespace after "!" (@stylistic/declaration-bang-space-after)',
+        'Unexpected whitespace after "!" (@stylistic/declaration-bang-space-after)',
+        'Expected single space before "!" (@stylistic/declaration-bang-space-before)'
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'@stylistic/declaration-bang-space-after',
+				'@stylistic/declaration-bang-space-after',
+				'@stylistic/declaration-bang-space-before',
+			],
+		);
+	});
+});

__tests__/declaration-bang-space-before.test.mjs

@@ -0,0 +1,50 @@
+import { beforeEach, describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+
+import stylelint from 'stylelint';
+
+import config from '../index.js';
+
+describe('flags warnings with declaration-bang-space-before lint', () => {
+	const invalidScss = (
+`.test-selector { color: #fff!important; }
+.test-selector { color: #fff  !important; }
+`);
+
+	let result;
+
+	beforeEach(async () => {
+		result = await stylelint.lint({
+			code: invalidScss,
+			config,
+		});
+	});
+
+	it('did error', () => {
+		assert.equal(result.errored, true);
+	});
+
+	it('flags warnings', () => {
+		assert.equal(result.results[0].warnings.length, 2);
+	});
+
+	it('correct warning text', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.text),
+			[
+				'Expected single space before "!" (@stylistic/declaration-bang-space-before)',
+				'Expected single space before "!" (@stylistic/declaration-bang-space-before)',
+			],
+		);
+	});
+
+	it('correct rule flagged', () => {
+		assert.deepEqual(
+			result.results[0].warnings.map((w) => w.rule),
+			[
+				'@stylistic/declaration-bang-space-before',
+				'@stylistic/declaration-bang-space-before',
+			],
+		);
+	});
+});