WIP. revert changes

DevExpress · Dec 23, 2024 · 8eed1f2 · 8eed1f2
1 parent c226641
commit 8eed1f2
Show file tree

Hide file tree

Showing 3 changed files with 110 additions and 25 deletions.
diff --git a/packages/devextreme-themebuilder/jest.config.js b/packages/devextreme-themebuilder/jest.config.js
@@ -10,7 +10,7 @@ module.exports = {
         }],
     },
     testMatch: [
-        '**/tests/**/builder.test.ts',
+        '**/tests/**/*.test.ts',
     ],
     coverageThreshold: {
         global: {

diff --git a/packages/devextreme-themebuilder/src/modules/bootstrap-extractor.ts b/packages/devextreme-themebuilder/src/modules/bootstrap-extractor.ts
@@ -93,11 +93,10 @@ export default class BootstrapExtractor {
   async sassProcessor(): Promise<string> {
     const functions = await this.readSassFile('_functions.scss');
     const variables = await this.readSassFile('_variables.scss');
-
+    
     const variablesDarkFile = '_variables-dark.scss';
     const variablesDark = this.version === 5 && existsSync(this.getFilePath(variablesDarkFile)) ? await this.readSassFile(variablesDarkFile) : ''; // TODO: can be removed safely in bootstrap@6
 
-    console.log('------readSassFile---->');
     const result = `${functions}
 ${variables.replace('@import "variables-dark";', '')}
 ${variablesDark}

diff --git a/packages/devextreme-themebuilder/tests/modules/builder.test.ts b/packages/devextreme-themebuilder/tests/modules/builder.test.ts
@@ -11,31 +11,103 @@ const normalizeCss = (css: string): string => css
   .replace(/\s*\/\*[\s\S]*?\*\/\s*/g, '')
   .trim();
 
-function findDifference(str1: string, str2: string) {
-  let start = 0;
-  let end1 = str1.length;
-  let end2 = str2.length;
-
-  // Найти начало различий
-  while (start < str1.length && start < str2.length && str1[start] === str2[start]) {
-    start++;
-  }
-
-  // Найти конец различий
-  while (end1 > start && end2 > start && str1[end1 - 1] === str2[end2 - 1]) {
-    end1--;
-    end2--;
-  }
-
-  // Вернуть отличающиеся подстроки
-  return [str1.slice(start, end1), str2.slice(start, end2)];
-}
-
 describe('Builder integration tests', () => {
+  test('Build theme without parameters', async () => {
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      outputColorScheme: 'custom-scheme',
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+      expect(result.swatchSelector).toBe(null);
+      expect(Object.keys(result.compiledMetadata).length).toBeGreaterThan(100);
+      expect(result.widgets.length).toBeGreaterThan(50);
+      expect(result.unusedWidgets.length).toBe(0);
+      expect(result.version).toBe(version);
+    });
+  }, buildTimeout);
+
+  test('Build base theme with swatch', async () => {
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      makeSwatch: true,
+      outputColorScheme: 'custom-scheme',
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+      expect(result.swatchSelector).toBe('.dx-swatch-custom-scheme');
+    });
+  }, buildTimeout);
 
+  test('Build theme according to bootstrap', async () => {
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      inputFile: 'some.less',
+      data: '',
+      outputColorScheme: 'custom-scheme',
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+    });
+  }, buildTimeout);
+
+  test('Build bootstrap 5 theme', async () => {
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      inputFile: 'bootstrap5.scss',
+      bootstrapVersion: 5,
+      data: '',
+      outputColorScheme: 'custom-scheme',
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+    });
+  }, buildTimeout);
+
+  test('Build theme with changed color constants (generic)', async () => {
+    const allChangedVariables = metadata.generic.map((item) => ({
+      key: item.Key,
+      value: item.Type === 'color' ? '#abcdef' : '10px',
+    }));
+
+    allChangedVariables.push({ key: '@undefined-variable', value: '#abcdef' });
+
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      outputColorScheme: 'custom-scheme',
+      items: allChangedVariables,
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+      expect(result.css.includes('#abcdef')).toBe(true);
+    });
+  }, buildTimeout);
+
+  test('Build theme with changed color constants (material)', async () => {
+    const allChangedVariables = metadata.material.map((item) => ({
+      key: item.Key,
+      value: item.Type === 'color' ? '#abcdef' : '10px',
+    }));
+
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      outputColorScheme: 'custom-scheme',
+      baseTheme: 'material.blue.light',
+      items: allChangedVariables,
+    };
+
+    return buildTheme(config).then((result) => {
+      expect(result.css).not.toBe('');
+      expect(result.css.includes('#abcdef')).toBe(true);
+    });
+  }, buildTimeout);
 
   test('Theme built without parameters is the same that in distribution (generic)', async () => {
-    console.log('------start builder.test---->');
     const config: ConfigSettings = {
       command: commands.BUILD_THEME,
       outputColorScheme: 'custom-scheme',
@@ -46,9 +118,23 @@ describe('Builder integration tests', () => {
       const themeBuilderCss = normalizeCss(result.css);
       const cssPath = path.resolve(__dirname, '../../../devextreme/artifacts/css/dx.light.css');
       const distributionCss = normalizeCss(readFileSync(cssPath, 'utf8'));
-
       expect(themeBuilderCss).toBe(distributionCss);
     });
   }, buildTimeout);
 
+  test('Theme built without parameters is the same that in distribution (material)', async () => {
+    const config: ConfigSettings = {
+      command: commands.BUILD_THEME,
+      outputColorScheme: 'custom-scheme',
+      baseTheme: 'material.blue.light',
+      items: [],
+    };
+
+    return buildTheme(config).then((result) => {
+      const themeBuilderCss = normalizeCss(result.css);
+      const cssPath = path.resolve(__dirname, '../../../devextreme/artifacts/css/dx.material.blue.light.css');
+      const distributionCss = normalizeCss(readFileSync(cssPath, 'utf8'));
+      expect(themeBuilderCss).toBe(distributionCss);
+    });
+  }, buildTimeout);
 });