@culur/config-stylelint 1.0.0 → 1.0.1

package/src/__tests__/describe-rule-or-config.ts

@@ -0,0 +1,73 @@
+import type { Awaitable } from 'vitest';
+import { afterEach, describe, it, vi } from 'vitest';
+import type { Config, ConfigRuleSettings } from 'stylelint';
+import type { UtilsPackages } from './mock';
+import { hasValues, spyOnUtilsPackages } from './spy-on-utils-packages';
+import type {
+  ConfigRulePrimaryOption,
+  ConfigRuleSecondaryOptions,
+} from '~/utils';
+
+type Fn<
+  TTestCase extends UtilsPackages & object,
+  TRuleOrConfig extends
+    | ConfigRuleSettings<ConfigRulePrimaryOption, ConfigRuleSecondaryOptions>
+    | Config,
+> = (
+  ruleOrConfig: TRuleOrConfig,
+  options: UtilsPackages & TTestCase,
+) => Promise<void> | void;
+
+export function describeRuleOrConfigFactory<
+  TBaseRuleOrConfig extends
+    | ConfigRuleSettings<ConfigRulePrimaryOption, ConfigRuleSecondaryOptions>
+    | Config,
+>(describeName: string) {
+  function describeRuleOrConfig<
+    TRuleOrConfig extends TBaseRuleOrConfig,
+    TTestCase extends UtilsPackages & object,
+  >(
+    utilsPackages: typeof import('@culur/utils-packages'),
+    getRuleOrConfig: (() => Awaitable<TRuleOrConfig>) | TRuleOrConfig,
+    ...args:
+      | [testCases: TTestCase[], fn: Fn<TTestCase, TRuleOrConfig>]
+      | [fn: Fn<TTestCase, TRuleOrConfig>]
+  ) {
+    const [testCases, fn] =
+      args.length === 2 //
+        ? [...args]
+        : [[{} as UtilsPackages & TTestCase], ...args];
+
+    const itName =
+      hasValues
+        .filter(field => testCases.some(t => typeof t[field] === 'boolean'))
+        .map(field => `${field} = $${field}`)
+        .join(', ') || 'default';
+
+    describe(describeName, () => {
+      afterEach(() => {
+        vi.restoreAllMocks();
+      });
+
+      it.each(testCases)(itName, async testCase => {
+        spyOnUtilsPackages(utilsPackages, testCase);
+
+        const ruleOrConfig =
+          typeof getRuleOrConfig === 'function'
+            ? await getRuleOrConfig()
+            : getRuleOrConfig;
+
+        fn(ruleOrConfig, testCase);
+      });
+    });
+  }
+
+  return describeRuleOrConfig;
+}
+export const describeConfig = describeRuleOrConfigFactory<Config>('config');
+export const describeRule = describeRuleOrConfigFactory<
+  ConfigRuleSettings<
+    ConfigRulePrimaryOption, //
+    ConfigRuleSecondaryOptions
+  >
+>('rule');

package/src/__tests__/index.ts

@@ -1,5 +1,8 @@
-export * from './dedent';
-export * from './mock';
-export * from './syntax';
-export * from './test-rule-or-config-value';
-export * from './test-lint-and-fix';
+export * from './dedent';
+export * from './describe-lint-and-fix';
+export * from './describe-rule-or-config';
+// export * from './mock';
+export * from './spy-on-utils-packages';
+export * from './syntax';
+// export * from './test-lint-and-fix';
+// export * from './test-rule-or-config-value';

package/src/__tests__/mock.ts

@@ -1,36 +1,36 @@
-import { vi } from 'vitest';
-
-export type UtilsPackages = Partial<{
-  hasTailwind: boolean;
-  hasSass: boolean;
-  hasVue: boolean;
-}>;
-
-export const defineMockUtilsPackages = (testCases: UtilsPackages[]) => {
-  const shouldMockUtilsPackages = testCases.some(
-    t =>
-      typeof t.hasTailwind === 'boolean' ||
-      typeof t.hasSass === 'boolean' ||
-      typeof t.hasVue === 'boolean',
-  );
-
-  if (shouldMockUtilsPackages) {
-    vi.mock('@culur/utils-packages');
-  }
-
-  return async ({ hasTailwind, hasSass, hasVue }: UtilsPackages) => {
-    if (shouldMockUtilsPackages) {
-      const utilsPackages = await import('@culur/utils-packages');
-
-      if (typeof hasTailwind === 'boolean') {
-        utilsPackages.hasTailwind = vi.fn().mockReturnValue(hasTailwind);
-      }
-      if (typeof hasSass === 'boolean') {
-        utilsPackages.hasSass = vi.fn().mockReturnValue(hasSass);
-      }
-      if (typeof hasVue === 'boolean') {
-        utilsPackages.hasVue = vi.fn().mockReturnValue(hasVue);
-      }
-    }
-  };
-};
+import { vi } from 'vitest';
+
+export type UtilsPackages = Partial<{
+  hasTailwind: boolean;
+  hasSass: boolean;
+  hasVue: boolean;
+}>;
+
+export const defineMockUtilsPackages = (testCases: UtilsPackages[]) => {
+  const shouldMockUtilsPackages = testCases.some(
+    t =>
+      typeof t.hasTailwind === 'boolean' ||
+      typeof t.hasSass === 'boolean' ||
+      typeof t.hasVue === 'boolean',
+  );
+
+  if (shouldMockUtilsPackages) {
+    vi.mock('@culur/utils-packages');
+  }
+
+  return async ({ hasTailwind, hasSass, hasVue }: UtilsPackages) => {
+    if (shouldMockUtilsPackages) {
+      const utilsPackages = await import('@culur/utils-packages');
+
+      if (typeof hasTailwind === 'boolean') {
+        utilsPackages.hasTailwind = vi.fn().mockReturnValue(hasTailwind);
+      }
+      if (typeof hasSass === 'boolean') {
+        utilsPackages.hasSass = vi.fn().mockReturnValue(hasSass);
+      }
+      if (typeof hasVue === 'boolean') {
+        utilsPackages.hasVue = vi.fn().mockReturnValue(hasVue);
+      }
+    }
+  };
+};

package/src/__tests__/spy-on-utils-packages.ts

@@ -0,0 +1,14 @@
+import { vi } from 'vitest';
+import type { UtilsPackages } from './mock';
+
+export const hasValues = ['hasTailwind', 'hasSass', 'hasVue'] as const;
+
+export function spyOnUtilsPackages(
+  utilsPackages: typeof import('@culur/utils-packages'),
+  options: UtilsPackages,
+) {
+  for (const hasValue of hasValues) {
+    const value = options[hasValue] ?? false;
+    vi.spyOn(utilsPackages, hasValue).mockReturnValue(value);
+  }
+}

package/src/__tests__/syntax.ts

@@ -1,11 +1,11 @@
-import type { Config } from 'stylelint';
-import postcssScss from 'postcss-scss';
-
-type OverrideSyntax = Config['overrides'] extends (infer T)[] | undefined
-  ? T
-  : never;
-
-export const syntaxScss: OverrideSyntax = {
-  files: ['*.scss', '**/*.scss'],
-  customSyntax: postcssScss,
-};
+import type { Config } from 'stylelint';
+import postcssScss from 'postcss-scss';
+
+type OverrideSyntax = Config['overrides'] extends (infer T)[] | undefined
+  ? T
+  : never;
+
+export const syntaxScss: OverrideSyntax = {
+  files: ['*.scss', '**/*.scss'],
+  customSyntax: postcssScss,
+};

package/src/configs/css.test.ts

@@ -1,10 +1,9 @@
-import { assert, describe } from 'vitest';
-import { configCss } from './css';
-import { testConfigValue } from '~/__tests__';
-
-describe('css config', () => {
-  testConfigValue(configCss, config => {
-    assert(Array.isArray(config.extends));
-    assert(Array.isArray(config.plugins));
-  });
-});
+import { assert } from 'vitest';
+import * as utilsPackages from '@culur/utils-packages';
+import { configCss } from './css';
+import { describeConfig } from '~/__tests__';
+
+describeConfig(utilsPackages, configCss, config => {
+  assert(Array.isArray(config.extends));
+  assert(Array.isArray(config.plugins));
+});

package/src/configs/css.ts

@@ -1,16 +1,16 @@
-import type { Config } from 'stylelint';
-import { atRuleNoUnknownCSS } from '~/rules/at-rule-no-unknown';
-import { declarationBlockNoRedundantLonghandProperties } from '~/rules/declaration-block-no-redundant-longhand-properties';
-import { functionNoUnknown } from '~/rules/function-no-unknown';
-import { order } from '~/rules/order';
-
-export const configCss = (): Config => ({
-  extends: ['stylelint-config-standard', 'stylelint-config-clean-order'],
-  plugins: ['stylelint-order', 'stylelint-selector-bem-pattern'],
-  rules: {
-    ...atRuleNoUnknownCSS(),
-    ...declarationBlockNoRedundantLonghandProperties,
-    ...functionNoUnknown(),
-    ...order(),
-  },
-});
+import type { Config } from 'stylelint';
+import { atRuleNoUnknownCSS } from '~/rules/at-rule-no-unknown';
+import { declarationBlockNoRedundantLonghandProperties } from '~/rules/declaration-block-no-redundant-longhand-properties';
+import { functionNoUnknown } from '~/rules/function-no-unknown';
+import { order } from '~/rules/order';
+
+export const configCss = (): Config => ({
+  extends: ['stylelint-config-standard', 'stylelint-config-clean-order'],
+  plugins: ['stylelint-order', 'stylelint-selector-bem-pattern'],
+  rules: {
+    ...atRuleNoUnknownCSS(),
+    ...declarationBlockNoRedundantLonghandProperties,
+    ...functionNoUnknown(),
+    ...order(),
+  },
+});

package/src/configs/scss.test.ts

@@ -1,9 +1,8 @@
-import { assert, describe } from 'vitest';
-import { configScss } from './scss';
-import { testConfigValue } from '~/__tests__';
-
-describe('scss config', () => {
-  testConfigValue(configScss, config => {
-    assert(Array.isArray(config.extends));
-  });
-});
+import * as utilsPackages from '@culur/utils-packages';
+import { assert } from 'vitest';
+import { configScss } from './scss';
+import { describeConfig } from '~/__tests__';
+
+describeConfig(utilsPackages, configScss, config => {
+  assert(Array.isArray(config.extends));
+});

package/src/configs/scss.ts

@@ -1,11 +1,11 @@
-import type { Config } from 'stylelint';
-import { atRuleNoUnknownSCSS } from '~/rules/at-rule-no-unknown';
-import { dollarVariablePatternSCSS } from '~/rules/dollar-variable-pattern';
-
-export const configScss = (): Config => ({
-  extends: ['stylelint-config-standard-scss'],
-  rules: {
-    ...atRuleNoUnknownSCSS(),
-    ...dollarVariablePatternSCSS,
-  },
-});
+import type { Config } from 'stylelint';
+import { atRuleNoUnknownSCSS } from '~/rules/at-rule-no-unknown';
+import { dollarVariablePatternSCSS } from '~/rules/dollar-variable-pattern';
+
+export const configScss = (): Config => ({
+  extends: ['stylelint-config-standard-scss'],
+  rules: {
+    ...atRuleNoUnknownSCSS(),
+    ...dollarVariablePatternSCSS,
+  },
+});

package/src/configs/shared.test.ts

@@ -1,9 +1,8 @@
-import { assert, describe } from 'vitest';
-import { configShared } from './shared';
-import { testConfigValue } from '~/__tests__';
-
-describe('shared config', () => {
-  testConfigValue(configShared, config => {
-    assert(Array.isArray(config.extends));
-  });
-});
+import { assert } from 'vitest';
+import * as utilsPackages from '@culur/utils-packages';
+import { configShared } from './shared';
+import { describeConfig } from '~/__tests__';
+
+describeConfig(utilsPackages, configShared, config => {
+  assert(Array.isArray(config.extends));
+});

package/src/configs/shared.ts

@@ -1,5 +1,5 @@
-import type { Config } from 'stylelint';
-
-export const configShared = (): Config => ({
-  extends: ['stylelint-config-html'],
-});
+import type { Config } from 'stylelint';
+
+export const configShared = (): Config => ({
+  extends: ['stylelint-config-html'],
+});

package/src/configs/vue.test.ts

@@ -1,18 +1,19 @@
-import { assert, describe } from 'vitest';
-import { configVue } from './vue';
-import { testConfigValue } from '~/__tests__';
-
-describe('vue config', () => {
-  testConfigValue(
-    [{ hasSass: true }, { hasSass: false }],
-    configVue,
-    (config, options) => {
-      assert(Array.isArray(config.extends));
-      config.extends.includes(
-        options.hasSass
-          ? 'stylelint-config-standard-vue/scss'
-          : 'stylelint-config-standard-vue',
-      );
-    },
-  );
-});
+import { assert } from 'vitest';
+import * as utilsPackages from '@culur/utils-packages';
+import { configVue } from './vue';
+import { describeConfig } from '~/__tests__';
+
+describeConfig(
+  utilsPackages,
+  configVue,
+  [{ hasSass: true }, { hasSass: false }],
+  (config, testCase) => {
+    assert(Array.isArray(config.extends));
+    assert(Array.isArray(config.extends));
+    config.extends.includes(
+      testCase.hasSass
+        ? 'stylelint-config-standard-vue/scss'
+        : 'stylelint-config-standard-vue',
+    );
+  },
+);

package/src/configs/vue.ts

@@ -1,10 +1,10 @@
-import { hasSass } from '@culur/utils-packages';
-import type { Config } from 'stylelint';
-
-export const configVue = (): Config => ({
-  extends: [
-    hasSass()
-      ? 'stylelint-config-standard-vue/scss'
-      : 'stylelint-config-standard-vue',
-  ],
-});
+import { hasSass } from '@culur/utils-packages';
+import type { Config } from 'stylelint';
+
+export const configVue = (): Config => ({
+  extends: [
+    hasSass()
+      ? 'stylelint-config-standard-vue/scss'
+      : 'stylelint-config-standard-vue',
+  ],
+});

package/src/factory.test.ts

@@ -1,15 +1,16 @@
-import { css, testLintAndFix } from './__tests__';
-import defineConfig from './factory';
-
-testLintAndFix(defineConfig, [
-  {
-    code: css`
-      a {
-        color: red;
-      }
-    `,
-    hasSass: true,
-    hasVue: true,
-    isError: false,
-  },
-]);
+import * as utilsPackages from '@culur/utils-packages';
+import { css, describeLintAndFix } from './__tests__';
+import defineConfig from './factory';
+
+describeLintAndFix(utilsPackages, defineConfig, [
+  {
+    code: css`
+      a {
+        color: red;
+      }
+    `,
+    hasSass: true,
+    hasVue: true,
+    isError: false,
+  },
+]);

package/src/factory.ts

@@ -1,23 +1,23 @@
-import type { Packages } from '@culur/utils-packages';
-import { hasSass, hasVue, updateDefaultPackages } from '@culur/utils-packages';
-import type { Config } from 'stylelint';
-import { configCss } from './configs/css';
-import { configScss } from './configs/scss';
-import { configShared } from './configs/shared';
-import { configVue } from './configs/vue';
-import { mergeConfigs } from './utils';
-
-export default function defineConfig(
-  options?: Partial<Packages>,
-  config?: Config,
-): Config {
-  updateDefaultPackages(options);
-
-  return mergeConfigs(
-    configShared(),
-    configCss(),
-    hasSass() && configScss(),
-    hasVue() && configVue(),
-    config,
-  );
-}
+import type { Packages } from '@culur/utils-packages';
+import { hasSass, hasVue, updateDefaultPackages } from '@culur/utils-packages';
+import type { Config } from 'stylelint';
+import { configCss } from './configs/css';
+import { configScss } from './configs/scss';
+import { configShared } from './configs/shared';
+import { configVue } from './configs/vue';
+import { mergeConfigs } from './utils';
+
+export default function defineConfig(
+  options?: Partial<Packages>,
+  config?: Config,
+): Config {
+  updateDefaultPackages(options);
+
+  return mergeConfigs(
+    configShared(),
+    configCss(),
+    hasSass() && configScss(),
+    hasVue() && configVue(),
+    config,
+  );
+}

package/src/index.test.ts

@@ -1,9 +1,9 @@
-import { describe, expectTypeOf, it } from 'vitest';
-import type { Config } from 'stylelint';
-import defineConfig from '.';
-
-describe('index', () => {
-  it('root config', () => {
-    expectTypeOf(defineConfig).toEqualTypeOf<Config>();
-  });
-});
+import { describe, expectTypeOf, it } from 'vitest';
+import type { Config } from 'stylelint';
+import defineConfig from '.';
+
+describe('index', () => {
+  it('root config', () => {
+    expectTypeOf(defineConfig).toEqualTypeOf<Config>();
+  });
+});

package/src/index.ts

@@ -1,3 +1,3 @@
-import defineConfig from './factory';
-
-export default defineConfig();
+import defineConfig from './factory';
+
+export default defineConfig();

package/src/rules/at-rule-no-unknown.test.ts

@@ -1,43 +1,46 @@
-import { assert, expect } from 'vitest';
-import { syntaxScss, testLintAndFix } from '~/__tests__';
-import { testRuleValue } from '~/__tests__/test-rule-or-config-value';
-
-testRuleValue(
-  [
-    { hasTailwind: false, length: 0 },
-    { hasTailwind: true, length: 7 },
-  ],
-  async () => {
-    const module = await import('./at-rule-no-unknown');
-    return module.atRuleNoUnknownRule();
-  },
-  (rule, options) => {
-    assert(Array.isArray(rule));
-    assert(typeof rule[1] === 'object');
-    expect(rule[1].ignoreAtRules).toHaveLength(options.length);
-  },
-);
-
-testLintAndFix(async () => {
-  const module = await import('./at-rule-no-unknown');
-  return {
-    rules: module.atRuleNoUnknownCSS(),
-  };
-}, [
-  { hasTailwind: false, code: '@unknown {}', isError: true },
-  { hasTailwind: false, code: '@media {}', isError: false },
-  { hasTailwind: true, code: '@tailwind {}', isError: false },
-]);
-
-testLintAndFix(async () => {
-  const module = await import('./at-rule-no-unknown');
-  return {
-    plugins: ['stylelint-scss'],
-    rules: module.atRuleNoUnknownSCSS(),
-    overrides: [syntaxScss],
-  };
-}, [
-  { ext: 'scss', hasTailwind: false, code: '@unknown {}', isError: true },
-  { ext: 'scss', hasTailwind: false, code: '@media {}', isError: false },
-  { ext: 'scss', hasTailwind: true, code: '@tailwind {}', isError: false },
-]);
+import * as utilsPackages from '@culur/utils-packages';
+import { assert, expect } from 'vitest';
+import {
+  atRuleNoUnknownCSS,
+  atRuleNoUnknownRule,
+  atRuleNoUnknownSCSS,
+} from './at-rule-no-unknown';
+import { describeLintAndFix, describeRule, syntaxScss } from '~/__tests__';
+
+describeRule(
+  utilsPackages,
+  atRuleNoUnknownRule,
+  [
+    { hasTailwind: false, length: 0 },
+    { hasTailwind: true, length: 7 },
+  ],
+  (rule, testCase) => {
+    assert(Array.isArray(rule));
+    assert(typeof rule[1] === 'object');
+    expect(rule[1].ignoreAtRules).toHaveLength(testCase.length);
+  },
+);
+
+describeLintAndFix(
+  utilsPackages, //
+  () => ({ rules: atRuleNoUnknownCSS() }),
+  [
+    { hasTailwind: false, code: '@unknown {}', isError: true },
+    { hasTailwind: false, code: '@media {}', isError: false },
+    { hasTailwind: true, code: '@tailwind {}', isError: false },
+  ],
+);
+
+describeLintAndFix(
+  utilsPackages,
+  () => ({
+    plugins: ['stylelint-scss'],
+    rules: atRuleNoUnknownSCSS(),
+    overrides: [syntaxScss],
+  }),
+  [
+    { ext: 'scss', hasTailwind: false, code: '@unknown {}', isError: true },
+    { ext: 'scss', hasTailwind: false, code: '@media {}', isError: false },
+    { ext: 'scss', hasTailwind: true, code: '@tailwind {}', isError: false },
+  ],
+);

package/src/rules/at-rule-no-unknown.ts

@@ -1,33 +1,33 @@
-import { hasTailwind } from '@culur/utils-packages';
-import { defineRule, defineRules } from '~/utils';
-
-// https://tailwindcss.com/docs/functions-and-directives
-const directives = [
-  'tailwind',
-  'layer',
-  'apply',
-  'config',
-
-  // https://v2.tailwindcss.com/docs/functions-and-directives
-  // backwards compatible for v2
-  'variants',
-  'responsive',
-  'screen',
-];
-
-export const atRuleNoUnknownRule = () =>
-  defineRule<boolean, { ignoreAtRules: (string | RegExp)[] }>([
-    true,
-    { ignoreAtRules: hasTailwind() ? directives : [] },
-  ]);
-
-export const atRuleNoUnknownCSS = () =>
-  defineRules({
-    'at-rule-no-unknown': atRuleNoUnknownRule(),
-  });
-
-export const atRuleNoUnknownSCSS = () =>
-  defineRules({
-    'at-rule-no-unknown': null,
-    'scss/at-rule-no-unknown': atRuleNoUnknownRule(),
-  });
+import { hasTailwind } from '@culur/utils-packages';
+import { defineRule, defineRules } from '~/utils';
+
+// https://tailwindcss.com/docs/functions-and-directives
+const directives = [
+  'tailwind',
+  'layer',
+  'apply',
+  'config',
+
+  // https://v2.tailwindcss.com/docs/functions-and-directives
+  // backwards compatible for v2
+  'variants',
+  'responsive',
+  'screen',
+];
+
+export const atRuleNoUnknownRule = () =>
+  defineRule<boolean, { ignoreAtRules: (string | RegExp)[] }>([
+    true,
+    { ignoreAtRules: hasTailwind() ? directives : [] },
+  ]);
+
+export const atRuleNoUnknownCSS = () =>
+  defineRules({
+    'at-rule-no-unknown': atRuleNoUnknownRule(),
+  });
+
+export const atRuleNoUnknownSCSS = () =>
+  defineRules({
+    'at-rule-no-unknown': null,
+    'scss/at-rule-no-unknown': atRuleNoUnknownRule(),
+  });