scss-variable-extractor 1.1.0 → 1.4.0

package/test/ng-refactorer.test.js

@@ -0,0 +1,184 @@
+const { analyzeAngularPatterns, refactorAngularPatterns, generateAngularPatternReport } = require('../src/ng-refactorer');
+const path = require('path');
+const fs = require('fs');
+
+describe('Angular Pattern Refactorer', () => {
+  const fixturesPath = path.join(__dirname, 'fixtures/apps/subapp/src/app/component-c');
+  const testFilePath = path.join(fixturesPath, 'component-c.component.scss');
+
+  describe('analyzeAngularPatterns', () => {
+    test('should detect ::ng-deep usage', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.summary.ngDeepCount).toBeGreaterThan(0);
+      expect(analysis.ngDeep.length).toBeGreaterThan(0);
+      expect(analysis.ngDeep.some(issue => issue.pattern === '::ng-deep')).toBe(true);
+    });
+
+    test('should detect deprecated /deep/ syntax', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.ngDeep.some(issue => issue.pattern === '/deep/')).toBe(true);
+    });
+
+    test('should detect deprecated >>> syntax', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.ngDeep.some(issue => issue.pattern === '>>>')).toBe(true);
+    });
+
+    test('should detect !important usage', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.summary.importantCount).toBeGreaterThan(0);
+      expect(analysis.important.length).toBeGreaterThan(0);
+    });
+
+    test('should provide line numbers for issues', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.ngDeep[0].line).toBeGreaterThan(0);
+      expect(analysis.important[0].line).toBeGreaterThan(0);
+    });
+
+    test('should provide suggestions', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      
+      expect(analysis.ngDeep[0].suggestion).toBeDefined();
+      expect(analysis.ngDeep[0].suggestion.length).toBeGreaterThan(0);
+      expect(analysis.important[0].suggestion).toBeDefined();
+    });
+
+    test('should handle files without issues', () => {
+      const cleanFile = path.join(__dirname, 'fixtures/apps/subapp/src/app/component-a/component-a.component.scss');
+      const analysis = analyzeAngularPatterns([cleanFile]);
+      
+      expect(analysis.summary.ngDeepCount).toBe(0);
+      expect(analysis.summary.importantCount).toBe(0);
+    });
+  });
+
+  describe('refactorAngularPatterns', () => {
+    let tempFilePath;
+    
+    beforeEach(() => {
+      // Create a temporary copy of the test file
+      tempFilePath = path.join(fixturesPath, 'temp-test.scss');
+      const content = fs.readFileSync(testFilePath, 'utf8');
+      fs.writeFileSync(tempFilePath, content, 'utf8');
+    });
+
+    afterEach(() => {
+      // Clean up
+      if (fs.existsSync(tempFilePath)) {
+        fs.unlinkSync(tempFilePath);
+      }
+      const globalStylesPath = './src/styles.scss';
+      if (fs.existsSync(globalStylesPath)) {
+        fs.unlinkSync(globalStylesPath);
+      }
+    });
+
+    test('should remove ::ng-deep', () => {
+      const results = refactorAngularPatterns([tempFilePath], {
+        removeNgDeep: true,
+        removeImportant: false,
+        createGlobalStyles: false,
+        dryRun: false
+      });
+      
+      expect(results.modified.length).toBe(1);
+      
+      const refactoredContent = fs.readFileSync(tempFilePath, 'utf8');
+      expect(refactoredContent).not.toContain('::ng-deep');
+      expect(refactoredContent).not.toContain('/deep/');
+      expect(refactoredContent).not.toContain('>>>');
+    });
+
+    test('should remove !important', () => {
+      const results = refactorAngularPatterns([tempFilePath], {
+        removeNgDeep: false,
+        removeImportant: true,
+        createGlobalStyles: false,
+        dryRun: false
+      });
+      
+      expect(results.modified.length).toBe(1);
+      
+      const refactoredContent = fs.readFileSync(tempFilePath, 'utf8');
+      expect(refactoredContent).not.toContain('!important');
+    });
+
+    test('should handle dry-run mode', () => {
+      const originalContent = fs.readFileSync(tempFilePath, 'utf8');
+      
+      const results = refactorAngularPatterns([tempFilePath], {
+        removeNgDeep: true,
+        removeImportant: true,
+        createGlobalStyles: false,
+        dryRun: true
+      });
+      
+      const contentAfter = fs.readFileSync(tempFilePath, 'utf8');
+      expect(contentAfter).toBe(originalContent);
+      expect(results.modified.length).toBeGreaterThan(0); // Should still report what would be changed
+    });
+
+    test('should provide warnings for !important removal', () => {
+      const results = refactorAngularPatterns([tempFilePath], {
+        removeNgDeep: false,
+        removeImportant: true,
+        createGlobalStyles: false,
+        dryRun: false
+      });
+      
+      expect(results.warnings.length).toBeGreaterThan(0);
+      expect(results.warnings[0].message).toContain('!important');
+    });
+
+    test('should track changes made', () => {
+      const results = refactorAngularPatterns([tempFilePath], {
+        removeNgDeep: true,
+        removeImportant: true,
+        createGlobalStyles: false,
+        dryRun: false
+      });
+      
+      expect(results.modified[0].changes.length).toBeGreaterThan(0);
+      expect(results.modified[0].changes.some(c => c.type === 'ng-deep-removed')).toBe(true);
+      expect(results.modified[0].changes.some(c => c.type === 'important-removed')).toBe(true);
+    });
+  });
+
+  describe('generateAngularPatternReport', () => {
+    test('should generate table report', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      const report = generateAngularPatternReport(analysis, 'table');
+      
+      expect(report).toContain('Angular Anti-Pattern Analysis');
+      expect(report).toContain('Summary');
+      expect(report).toContain('::ng-deep');
+      expect(report).toContain('!important');
+    });
+
+    test('should generate JSON report', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      const report = generateAngularPatternReport(analysis, 'json');
+      
+      const parsed = JSON.parse(report);
+      expect(parsed.summary).toBeDefined();
+      expect(parsed.ngDeep).toBeDefined();
+      expect(parsed.important).toBeDefined();
+    });
+
+    test('should generate Markdown report', () => {
+      const analysis = analyzeAngularPatterns([testFilePath]);
+      const report = generateAngularPatternReport(analysis, 'markdown');
+      
+      expect(report).toContain('# Angular Anti-Pattern Analysis Report');
+      expect(report).toContain('## Summary');
+      expect(report).toContain('## ::ng-deep Issues');
+      expect(report).toContain('## !important Issues');
+    });
+  });
+});