niyogilabs/SkillSpectorWeb

SkillSpector Browser-Portierungs- und Upgrade-Methodik

Diese Fähigkeit bietet eine schrittweise Anleitung zur Portierung einer neuen Version des SkillSpector-Python-Sicherheitsscanners in eine vollständig im Browser ausgeführte WebAssembly-/JavaScript-Webanwendung (SkillSpectorWeb).

---

🎯 Architektonische Prinzipien

1. 100% Clientseitige Browser-Ausführung:

   • Der Scanner muss vollständig im Browser des Benutzers ausgeführt werden, ohne dass ein Backend-Server erforderlich ist.
   • Alle GitHub-Repository-Inhalte werden über die GitHub-REST-APIs (api.github.com und raw.githubusercontent.com) abgerufen.

2. Strenge Modultrennung:

   • Core Scanner Engine (docs/js/skillspector-engine.js): Reine übersetzte statische Analyse-Regeln, die den Python-nodes/analyzers/ entsprechen.
   • Isolierter Repo-Filter (docs/js/repo-filter.js): Behält benutzerdefinierte Nicht-Skill-Dateifilterungen (README.md, CHANGELOG.md, .git/ usw.) getrennt vom übersetzten Scanner-Code.
   • GitHub-Fetcher (docs/js/github-fetcher.js): Übernimmt URL-Parsing, Baum-Erweiterung und Batch-Download.

3. Multi-Skill-Repository-Unterstützung:

   • Muss src/skillspector/multi_skill.py spiegeln, um alle verschachtelten Fähigkeiten in einem Repository zu entdecken (resources/skills/*.md, skills/*.md, agents/*.md).

4. Lizenz- und Versionsparität:

   • Behalte exakte Versionsnummern (vX.Y.Z) bei, die mit der aktuellen Python-SkillSpector-Version übereinstimmen.
   • Bewahre die unveränderte upstream-LICENSE-Datei (Apache 2.0).

---

📋 Schritt-für-Schritt-Portierungs-Workflow

Phase 1: Extraktion von Regeln und AST-Analyse

1. Untersuche neue Analyzer-Regeln im upstream src/skillspector/nodes/analyzers/:
   • pattern_defaults.py (Regel-IDs: P1-P8, E1-E5, PE1-PE3, SC1-SC7, EA1-EA4, OH1-OH3, MP1-MP3, TM1-TM4, RA1-RA2, TR1-TR3, MCP1).
2. Übersetze neue Python-Regexes und AST-Prüfungen in JavaScript RegExp-Muster innerhalb von docs/js/skillspector-engine.js.
3. Aktualisiere Kategorielisten, Regelbeschreibungen, Erklärungen und Anleitungen zur Behebung.

Phase 2: GitHub-Fetcher und Baum-Erweiterung

1. Stelle sicher, dass docs/js/github-fetcher.js rekursive Baumstrukturen via https://api.github.com/repos/{owner}/{repo}/git/trees/{branch}?recursive=1 abruft.
2. Begrenze das Abrufen NICHT auf kleine willkürliche Dateilimits (verwende einen hohen Schwellenwert von bis zu 250 Dateien, um große Multi-Skill-Repositories zu unterstützen).
3. Verwende paralleles Batch-Abrufen (z.B. 10 Dateien pro Batch) mit Live-UI-Fortschritts-Callbacks (onProgress(current, total, filename)).

Phase 3: Multi-Skill-Erkennungs-Engine

1. Implementiere discoverSkills(filesMap) in skillspector-engine.js.
2. Parse YAML-Frontmatter von Markdown-Dateien (--- name: ... description: ... ---) für alle .md-Dateien im Repository.
3. Rendere eine Multi-Skill-Auswahlleiste in index.html, die es Benutzern erlaubt, Ergebnisse nach einzelnen entdeckten Fähigkeiten zu filtern oder den gesamten Repository-Kontext zu inspizieren.

Phase 4: Isolierte Repository-Dateifilterung

1. Halte docs/js/repo-filter.js vollständig getrennt von der Kern-Scanner-Engine.
2. Biete UI-Kontrollkästchen in index.html an:
   • Repository-Standarddokumente auslassen (README, CHANGELOG, LICENSE)
   • System-Metadaten auslassen (.git/, .github/, Punktdateien)
3. Protokolliere ausgelassene Dateien im Inspection Ledger als übersprungen mit expliziten Gründen.

Phase 5: GitHub-Pages-Verpackung (docs/)

1. Stelle sicher, dass alle statischen Website-Assets innerhalb von SkillSpectorWeb/docs/ liegen:
   • docs/index.html
   • docs/css/styles.css
   • docs/js/*.js
   • docs/CNAME (skillspector.niyogilabs.com)
   • docs/sitemap.xml
   • docs/robots.txt
   • docs/.nojekyll
   • docs/LICENSE
2. Stelle sicher, dass server.py standardmäßig das docs/-Verzeichnis bereitstellt.

---

🧪 Verifikations-Checkliste

• python3 server.py 8090 startet und liefert sauber aus docs/ aus.
• Das Scannen eines Multi-Skill-Repositories (z.B. Bhanunamikaze/Agentic-SEO-Skill) entdeckt alle verschachtelten Fähigkeiten.
• Helles Farbschema ist als Standard gesetzt; Dunkles Farbschema-Umschalter funktioniert und speichert in localStorage.
• SEO-Endpunkte (/sitemap.xml, /robots.txt, /CNAME) geben 200 OK zurück.
• Export-Funktionen für SARIF 2.1.0, JSON und Markdown laufen sauber.
• Die unveränderte root-LICENSE-Datei ist intakt.