gbu-accessibility-package 3.8.5 → 3.8.7

package/README-vi.md

@@ -362,7 +362,7 @@ await fixer.checkFileSizes('./src');
 ### Tối ưu hóa dự án
 
 - **File không sử dụng** → Phát hiện file không được tham chiếu ở đâu trong toàn bộ dự án
-  - **File types được kiểm tra**: Hình ảnh, CSS, JavaScript, JSX, TypeScript, Vue, PHP, JSON, Markdown, XML, PDF, Video, Audio files (không bao gồm HTML)
+  - **File types được kiểm tra**: Hình ảnh, CSS, SCSS/Sass, JavaScript, JSX, TypeScript, Vue, PHP, JSON, Markdown, XML, PDF, Video, Audio files (không bao gồm HTML)
   - **Quét toàn diện**: Phân tích từ project root, không giới hạn thư mục hiện tại
   - **Cross-reference detection**: Tìm tham chiếu từ HTML, CSS, JavaScript, JSON, và các file khác
   - **Multiple path formats**: Hỗ trợ relative paths, absolute paths, imports, requires

package/README.md

@@ -349,7 +349,7 @@ await fixer.checkFileSizes('./src');
 
 ### Project Optimization
 - **Unused Files** → Detect files not referenced anywhere in the project
-  - Images, CSS, JavaScript, JSX, TypeScript, Vue, PHP, JSON, Markdown, XML, PDF, Video, Audio files
+  - Images, CSS, SCSS/Sass, JavaScript, JSX, TypeScript, Vue, PHP, JSON, Markdown, XML, PDF, Video, Audio files
   - Local file references analysis
   - Heuristic detection with manual review recommendations
 - **Dead Code Analysis** → Find unused CSS rules and JavaScript functions

package/cli.js

@@ -572,9 +572,14 @@ async function main() {
       // Check unused files only (no fixes, no cleanup)
       console.log(chalk.blue('🗂️ Running unused files check only...'));
       const unusedResults = await fixer.checkUnusedFiles(options.directory);
-      const totalUnusedFiles = unusedResults.length;
+      const totalUnusedFiles = unusedResults.unusedCount;
       
-      console.log(chalk.green(`\n✅ Checked project files (${totalUnusedFiles} unused files found)`));
+      if (totalUnusedFiles === 0) {
+        console.log(chalk.green(`\n✅ No unused files found! All ${unusedResults.totalFiles} files are properly referenced.`));
+      } else {
+        console.log(chalk.green(`\n✅ Analysis complete: Found ${totalUnusedFiles} unused files out of ${unusedResults.totalFiles} total files`));
+        console.log(chalk.gray(`📊 ${unusedResults.referencedFiles} files are referenced, ${totalUnusedFiles} potentially unused`));
+      }
       console.log(chalk.gray('💡 Unused file detection is heuristic - manual review recommended'));
       
       showCompletionMessage(options, 'Unused files check');

package/lib/fixer.js

@@ -5671,6 +5671,8 @@ class AccessibilityFixer {
     const referencedFiles = await this.findReferencedFiles(scanDirectory);
     console.log(chalk.gray(`🔍 Found ${referencedFiles.size} referenced files`));
     
+
+    
     // Find unused files
     const unusedFiles = [];
     
@@ -5684,6 +5686,8 @@ class AccessibilityFixer {
       const relativePath = path.relative(scanDirectory, file);
       const isReferenced = this.isFileReferenced(file, relativePath, referencedFiles, scanDirectory);
       
+
+      
       if (!isReferenced) {
         const stats = await require('fs').promises.stat(file);
         const fileSize = this.formatFileSize(stats.size);
@@ -5732,7 +5736,7 @@ class AccessibilityFixer {
     };
   }
 
-  // Enhanced file reference checking
+  // Enhanced file reference checking - now works with relative paths
   isFileReferenced(filePath, relativePath, referencedFiles, projectRoot) {
     // Check various possible reference formats
     const possibleRefs = [
@@ -5748,19 +5752,31 @@ class AccessibilityFixer {
       relativePath.replace(/^\//, ''),                 // remove leading /
     ];
     
-    // Check if any reference format exists
+    // Check if any reference format exists in the set
     for (const ref of possibleRefs) {
       if (referencedFiles.has(ref)) {
         return true;
       }
     }
     
-    // Check for partial matches (for dynamic imports)
-    const fileName = path.basename(filePath, path.extname(filePath));
+    // Additional checks for path variations
+    const fileName = path.basename(filePath);
+    const relativeDir = path.dirname(relativePath);
+    
+    // Check for references that might include parent directory names
     for (const ref of referencedFiles) {
-      if (ref.includes(fileName) || ref.includes(relativePath)) {
+      // If reference ends with the filename, check if path context matches
+      if (ref.endsWith('/' + fileName) || ref === fileName) {
         return true;
       }
+      
+      // Check for absolute paths that correspond to our relative path
+      if (ref.startsWith('/') && ref.includes(fileName)) {
+        const refWithoutLeading = ref.substring(1);
+        if (refWithoutLeading === relativePath || refWithoutLeading.endsWith('/' + fileName)) {
+          return true;
+        }
+      }
     }
     
     return false;
@@ -5768,8 +5784,8 @@ class AccessibilityFixer {
 
   async findAllProjectFiles(directory) {
     const files = [];
-    // Check all relevant file types except HTML files
-    const extensions = ['.css', '.js', '.jsx', '.ts', '.tsx', '.vue', '.php', '.json', '.md', '.xml', '.jpg', '.jpeg', '.png', '.gif', '.svg', '.webp', '.ico', '.pdf', '.mp4', '.webm', '.mp3', '.wav'];
+    // Only check web assets: CSS, HTML, JS, and images
+    const extensions = ['.css', '.html', '.htm', '.js', '.jsx', '.png', '.jpg', '.jpeg', '.gif', '.svg', '.webp', '.ico'];
     
     const scan = async (dir) => {
       try {
@@ -5825,7 +5841,7 @@ class AccessibilityFixer {
     return referencedFiles;
   }
 
-  // Find all source files that could contain references
+  // Find HTML and CSS/SCSS files to scan for references
   async findSourceFiles(directory) {
     const sourceFiles = [];
     
@@ -5842,10 +5858,9 @@ class AccessibilityFixer {
               await walk(filePath);
             }
           } else {
-            // Include files that could contain references
+            // Include HTML (main entry) and CSS/SCSS (for background images)
             const ext = path.extname(file).toLowerCase();
-            if (['.html', '.htm', '.css', '.js', '.jsx', '.ts', '.tsx', 
-                 '.vue', '.php', '.json', '.md', '.xml', '.svg'].includes(ext)) {
+            if (['.html', '.htm', '.css', '.scss', '.sass'].includes(ext)) {
               sourceFiles.push(filePath);
             }
           }
@@ -5859,59 +5874,47 @@ class AccessibilityFixer {
     return sourceFiles;
   }
 
-  // Enhanced reference extraction
+  // Enhanced reference extraction from HTML and CSS files
   extractAllReferences(content, baseDir, sourceFile) {
-    const references = new Set();
-    
-    // Get file extension to determine extraction method
+    const references = [];
     const ext = path.extname(sourceFile).toLowerCase();
     
     if (['.html', '.htm'].includes(ext)) {
-      // HTML references
-      const htmlRefs = this.extractFileReferences(content, baseDir);
-      htmlRefs.forEach(ref => references.add(ref));
+      // Extract from HTML files - main entry points
+      const htmlRefs = this.extractHtmlReferences(content, baseDir);
+      references.push(...htmlRefs);
       
-    } else if (ext === '.css') {
-      // CSS references
+    } else if (['.css', '.scss', '.sass'].includes(ext)) {
+      // Extract from CSS/SCSS files - background images
       const cssRefs = this.extractCssReferences(content, baseDir);
-      cssRefs.forEach(ref => references.add(ref));
-      
-    } else if (['.js', '.jsx', '.ts', '.tsx'].includes(ext)) {
-      // JavaScript/TypeScript references
-      const jsRefs = this.extractJsReferences(content, baseDir);
-      jsRefs.forEach(ref => references.add(ref));
-      
-      // Also extract import statements
-      const importRefs = this.extractImportReferences(content, baseDir);
-      importRefs.forEach(ref => references.add(ref));
-      
-    } else if (ext === '.json') {
-      // JSON references (like package.json, config files)
-      const jsonRefs = this.extractJsonReferences(content, baseDir);
-      jsonRefs.forEach(ref => references.add(ref));
-      
-    } else {
-      // Generic file references (for .md, .xml, etc.)
-      const genericRefs = this.extractGenericReferences(content, baseDir);
-      genericRefs.forEach(ref => references.add(ref));
+      references.push(...cssRefs);
     }
     
-    return Array.from(references);
+    return references;
   }
 
-  extractFileReferences(content, baseDir) {
+  extractHtmlReferences(content, baseDir) {
     const references = [];
     
     // HTML patterns for file references
     const patterns = [
       // Images
       /<img[^>]*src\s*=\s*["']([^"']+)["']/gi,
+      // Srcset (responsive images)
+      /<img[^>]*srcset\s*=\s*["']([^"']+)["']/gi,
+      /<source[^>]*srcset\s*=\s*["']([^"']+)["']/gi,
+      // Data attributes (lazy loading, etc.)
+      /data-src\s*=\s*["']([^"']+)["']/gi,
+      /data-background\s*=\s*["']([^"']+)["']/gi,
+      /data-image\s*=\s*["']([^"']+)["']/gi,
+      /data-bg\s*=\s*["']([^"']+)["']/gi,
+      /data-lazy\s*=\s*["']([^"']+)["']/gi,
       // Links (CSS, other files)
       /<link[^>]*href\s*=\s*["']([^"']+)["']/gi,
       // Scripts
       /<script[^>]*src\s*=\s*["']([^"']+)["']/gi,
-      // Anchors
-      /<a[^>]*href\s*=\s*["']([^"']+)["']/gi,
+      // Anchors to other HTML files
+      /<a[^>]*href\s*=\s*["']([^"'#]+\.html?)["']/gi,
       // Video/Audio
       /<(?:video|audio)[^>]*src\s*=\s*["']([^"']+)["']/gi,
       // Object/Embed
@@ -5926,10 +5929,18 @@ class AccessibilityFixer {
       let match;
       while ((match = pattern.exec(content)) !== null) {
         const url = match[1];
-        if (this.isLocalFile(url)) {
-          const resolvedPath = this.resolveFilePath(url, baseDir);
-          if (resolvedPath) {
-            references.push(resolvedPath);
+        
+        // Handle srcset format: "image1.jpg 1x, image2.jpg 2x"
+        if (pattern.source.includes('srcset')) {
+          const srcsetUrls = url.split(',').map(item => item.trim().split(' ')[0]);
+          srcsetUrls.forEach(srcUrl => {
+            if (this.isLocalFile(srcUrl)) {
+              this.addNormalizedUrl(references, srcUrl);
+            }
+          });
+        } else {
+          if (this.isLocalFile(url)) {
+            this.addNormalizedUrl(references, url);
           }
         }
       }
@@ -5938,15 +5949,29 @@ class AccessibilityFixer {
     return references;
   }
 
+  // Helper method to add normalized URL variations
+  addNormalizedUrl(references, url) {
+    // Store original URL and normalized versions for matching
+    references.push(url);
+    if (url.startsWith('/')) {
+      references.push(url.substring(1)); // Remove leading slash
+    }
+    if (!url.startsWith('./') && !url.startsWith('/')) {
+      references.push('./' + url); // Add leading ./
+    }
+  }
+
   extractCssReferences(content, baseDir) {
     const references = [];
     
-    // CSS patterns for file references
+    // CSS patterns for file references  
     const patterns = [
-      // url() function
+      // url() function - background images, fonts, etc.
       /url\s*\(\s*["']?([^"')]+)["']?\s*\)/gi,
-      // @import
-      /@import\s+["']([^"']+)["']/gi
+      // @import CSS files
+      /@import\s+["']([^"']+)["']/gi,
+      // CSS custom properties with URLs
+      /--[^:]+:\s*url\s*\(\s*["']?([^"')]+)["']?\s*\)/gi
     ];
     
     for (const pattern of patterns) {
@@ -5954,10 +5979,7 @@ class AccessibilityFixer {
       while ((match = pattern.exec(content)) !== null) {
         const url = match[1];
         if (this.isLocalFile(url)) {
-          const resolvedPath = this.resolveFilePath(url, baseDir);
-          if (resolvedPath) {
-            references.push(resolvedPath);
-          }
+          this.addNormalizedUrl(references, url);
         }
       }
     }
@@ -5985,9 +6007,13 @@ class AccessibilityFixer {
       while ((match = pattern.exec(content)) !== null) {
         const url = match[1];
         if (this.isLocalFile(url)) {
-          const resolvedPath = this.resolveFilePath(url, baseDir);
-          if (resolvedPath) {
-            references.push(resolvedPath);
+          // Store both original URL and normalized versions for matching
+          references.push(url);
+          if (url.startsWith('/')) {
+            references.push(url.substring(1)); // Remove leading slash
+          }
+          if (!url.startsWith('./') && !url.startsWith('/')) {
+            references.push('./' + url); // Add leading ./
           }
         }
       }
@@ -6058,15 +6084,25 @@ class AccessibilityFixer {
   shouldSkipUnusedCheck(filePath) {
     const fileName = path.basename(filePath);
     const dirName = path.basename(path.dirname(filePath));
+    const relativePath = path.relative(process.cwd(), filePath);
     
-    // Skip certain file types and patterns
+    // Skip index files - they are main entry points
+    if (/^index\d*\.(html?|htm)$/i.test(fileName)) {
+      return true;
+    }
+    
+    // Skip OGP images - usually referenced with absolute paths in meta tags
+    if (/^ogp\.(png|jpg|jpeg)$/i.test(fileName)) {
+      return true;
+    }
+    
+    // Skip certain file types and patterns - but only in root directory
     const skipPatterns = [
-      // Common files that might not be directly referenced
-      /^(index|main|app)\.(html|js|css)$/i,
+      // Common files that might not be directly referenced - only in root
+      /^(main|app)\.(html|js|css)$/i,
       /^(readme|license|changelog)/i,
       /^package\.json$/i,
       /^\.gitignore$/i,
-      /^favicon\.(ico|png)$/i,
       /^robots\.txt$/i,
       /^sitemap\.xml$/i,
       // Backup files
@@ -6075,6 +6111,11 @@ class AccessibilityFixer {
       /test|spec|__tests__/i
     ];
     
+    // Only skip favicon in root directory, not in assets folders
+    if (/^favicon\.(ico|png)$/i.test(fileName) && !relativePath.includes('/')) {
+      return true;
+    }
+    
     return skipPatterns.some(pattern => 
       pattern.test(fileName) || pattern.test(dirName)
     );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gbu-accessibility-package",
-  "version": "3.8.5",
+  "version": "3.8.7",
   "description": "Comprehensive accessibility fixes and project optimization for HTML files. Smart context-aware alt text generation, form labels, button names, link names, landmarks, heading analysis, WCAG-compliant role attributes, unused files detection, dead code analysis, broken external links detection, and missing local resources detection. Covers major axe DevTools issues with individual fix modes.",
   "main": "index.js",
   "bin": {
@@ -35,6 +35,9 @@
     "demo": "node cli.js --dry-run demo",
     "demo-enhanced": "node cli.js --enhanced-alt --dry-run demo",
     "demo-creative": "node cli.js --enhanced-alt --alt-creativity creative --include-emotions --dry-run demo",
+    "test-local": "./test-local-projects.sh",
+    "test-unused-files": "./test-unused-files.sh",
+    "test-pack": "npm pack && echo 'Package created. Install in test project with: npm install ./gbu-accessibility-package-$(node -p \"require('./package.json').version\").tgz'",
     "prepublishOnly": "npm run test"
   },
   "keywords": [