@schalkneethling/toolkit 0.5.1 → 0.6.0

package/skills/frontend-security/references/nodejs-npm-security.md

@@ -54,33 +54,35 @@ vm.runInThisContext(userInput);
 require(userInput);
 
 // DANGEROUS - setTimeout/setInterval with strings
-setTimeout(userInput, 1000);  // Executes as code
+setTimeout(userInput, 1000); // Executes as code
 
 // SAFE - pass functions instead
-setTimeout(() => { /* code */ }, 1000);
+setTimeout(() => {
+  /* code */
+}, 1000);
 ```
 
 ### Child Process Injection
 
 ```javascript
 // DANGEROUS - command injection
-const { exec } = require('child_process');
-exec(`ls ${userInput}`);  // Shell injection
+const { exec } = require("child_process");
+exec(`ls ${userInput}`); // Shell injection
 
 // SAFER - use execFile with arguments array
-const { execFile } = require('child_process');
-execFile('ls', [userInput], callback);  // Arguments not interpreted by shell
+const { execFile } = require("child_process");
+execFile("ls", [userInput], callback); // Arguments not interpreted by shell
 
 // SAFEST - use spawn with shell: false
-const { spawn } = require('child_process');
-spawn('ls', [userInput], { shell: false });
+const { spawn } = require("child_process");
+spawn("ls", [userInput], { shell: false });
 ```
 
 ### File System
 
 ```javascript
-const path = require('path');
-const fs = require('fs');
+const path = require("path");
+const fs = require("fs");
 
 // DANGEROUS - path traversal
 const filePath = `/uploads/${userInput}`;
@@ -92,8 +94,8 @@ function safeReadFile(userInput, baseDir) {
   const relativePath = path.relative(basePath, safePath);
 
   // Verify path is within allowed directory
-  if (relativePath.startsWith('..') || path.isAbsolute(relativePath)) {
-    throw new Error('Invalid file path');
+  if (relativePath.startsWith("..") || path.isAbsolute(relativePath)) {
+    throw new Error("Invalid file path");
   }
 
   return fs.readFileSync(safePath);
@@ -105,14 +107,14 @@ function safeReadFile(userInput, baseDir) {
 ### Rate Limiting
 
 ```javascript
-const rateLimit = require('express-rate-limit');
+const rateLimit = require("express-rate-limit");
 
 const limiter = rateLimit({
   windowMs: 15 * 60 * 1000, // 15 minutes
   max: 100, // Limit each IP to 100 requests per window
-  message: 'Too many requests',
+  message: "Too many requests",
   standardHeaders: true,
-  legacyHeaders: false
+  legacyHeaders: false,
 });
 
 app.use(limiter);
@@ -121,28 +123,28 @@ app.use(limiter);
 const authLimiter = rateLimit({
   windowMs: 60 * 60 * 1000, // 1 hour
   max: 5, // 5 attempts per hour
-  message: 'Too many login attempts'
+  message: "Too many login attempts",
 });
 
-app.use('/api/login', authLimiter);
+app.use("/api/login", authLimiter);
 ```
 
 ### Request Size Limits
 
 ```javascript
-const express = require('express');
+const express = require("express");
 const app = express();
 
 // Limit JSON body size
-app.use(express.json({ limit: '100kb' }));
+app.use(express.json({ limit: "100kb" }));
 
 // Limit URL-encoded body
-app.use(express.urlencoded({ extended: true, limit: '100kb' }));
+app.use(express.urlencoded({ extended: true, limit: "100kb" }));
 
 // Limit file uploads
-const multer = require('multer');
+const multer = require("multer");
 const upload = multer({
-  limits: { fileSize: 5 * 1024 * 1024 } // 5MB
+  limits: { fileSize: 5 * 1024 * 1024 }, // 5MB
 });
 ```
 
@@ -160,27 +162,29 @@ server.headersTimeout = 66000;
 ## Secure Headers
 
 ```javascript
-const helmet = require('helmet');
-
-app.use(helmet({
-  contentSecurityPolicy: {
-    directives: {
-      defaultSrc: ["'self'"],
-      scriptSrc: ["'self'"],
-      styleSrc: ["'self'", "'unsafe-inline'"],
-      imgSrc: ["'self'", "data:", "https:"],
-      objectSrc: ["'none'"],
-      upgradeInsecureRequests: []
-    }
-  },
-  hsts: {
-    maxAge: 31536000,
-    includeSubDomains: true,
-    preload: true
-  },
-  referrerPolicy: { policy: 'strict-origin-when-cross-origin' },
-  frameguard: { action: 'deny' }
-}));
+const helmet = require("helmet");
+
+app.use(
+  helmet({
+    contentSecurityPolicy: {
+      directives: {
+        defaultSrc: ["'self'"],
+        scriptSrc: ["'self'"],
+        styleSrc: ["'self'", "'unsafe-inline'"],
+        imgSrc: ["'self'", "data:", "https:"],
+        objectSrc: ["'none'"],
+        upgradeInsecureRequests: [],
+      },
+    },
+    hsts: {
+      maxAge: 31536000,
+      includeSubDomains: true,
+      preload: true,
+    },
+    referrerPolicy: { policy: "strict-origin-when-cross-origin" },
+    frameguard: { action: "deny" },
+  }),
+);
 ```
 
 ## Error Handling
@@ -193,19 +197,22 @@ app.use((err, req, res, next) => {
 
   // Send generic message to client
   res.status(500).json({
-    error: 'An unexpected error occurred'
+    error: "An unexpected error occurred",
   });
 });
 
 // Async error wrapper
-const asyncHandler = fn => (req, res, next) => {
+const asyncHandler = (fn) => (req, res, next) => {
   Promise.resolve(fn(req, res, next)).catch(next);
 };
 
-app.get('/data', asyncHandler(async (req, res) => {
-  const data = await fetchData();
-  res.json(data);
-}));
+app.get(
+  "/data",
+  asyncHandler(async (req, res) => {
+    const data = await fetchData();
+    res.json(data);
+  }),
+);
 ```
 
 ## Environment Variables
@@ -216,8 +223,8 @@ app.get('/data', asyncHandler(async (req, res) => {
 const apiKey = process.env.API_KEY;
 
 // Validate required env vars at startup
-const required = ['API_KEY', 'DB_URL', 'SESSION_SECRET'];
-required.forEach(varName => {
+const required = ["API_KEY", "DB_URL", "SESSION_SECRET"];
+required.forEach((varName) => {
   if (!process.env[varName]) {
     console.error(`Missing required env var: ${varName}`);
     process.exit(1);
@@ -230,16 +237,16 @@ required.forEach(varName => {
 ```javascript
 // DANGEROUS - evil regex (catastrophic backtracking)
 const evilRegex = /^(a+)+$/;
-evilRegex.test('aaaaaaaaaaaaaaaaaaaaaaaaaaa!'); // Hangs
+evilRegex.test("aaaaaaaaaaaaaaaaaaaaaaaaaaa!"); // Hangs
 
 // Heuristic only: safe-regex can have false positives/negatives for ReDoS
-const safe = require('safe-regex');
+const safe = require("safe-regex");
 if (!safe(userProvidedRegex)) {
-  throw new Error('Unsafe regex pattern');
+  throw new Error("Unsafe regex pattern");
 }
 
 // Preferred for untrusted patterns: use RE2 for guaranteed linear time
-const RE2 = require('re2');
+const RE2 = require("re2");
 const pattern = new RE2(userProvidedRegex);
 ```
 
@@ -257,5 +264,6 @@ const pattern = new RE2(userProvidedRegex);
 - [ ] Use `npm-shrinkwrap.json` for published packages
 
 OWASP References:
+
 - https://cheatsheetseries.owasp.org/cheatsheets/Nodejs_Security_Cheat_Sheet.html
 - https://cheatsheetseries.owasp.org/cheatsheets/NPM_Security_Cheat_Sheet.html

package/skills/frontend-security/references/xss-prevention.md

@@ -4,13 +4,13 @@
 
 Apply context-appropriate encoding for all untrusted data:
 
-| Context | Encoding Method | Example |
-|---------|-----------------|---------|
-| HTML Body | HTML Entity Encoding | `<script>` |
-| HTML Attribute | Attribute Encoding | `"onclick"` |
-| JavaScript | JavaScript Encoding | `\x3cscript\x3e` |
-| CSS | CSS Encoding | `\3c script\3e` |
-| URL Parameter | URL Encoding | `%3Cscript%3E` |
+| Context        | Encoding Method      | Example               |
+| -------------- | -------------------- | --------------------- |
+| HTML Body      | HTML Entity Encoding | `<script>`      |
+| HTML Attribute | Attribute Encoding   | `"onclick"` |
+| JavaScript     | JavaScript Encoding  | `\x3cscript\x3e`      |
+| CSS            | CSS Encoding         | `\3c script\3e`       |
+| URL Parameter  | URL Encoding         | `%3Cscript%3E`        |
 
 ## Safe vs Unsafe Sinks
 
@@ -18,37 +18,37 @@ Apply context-appropriate encoding for all untrusted data:
 
 ```javascript
 // Execution sinks - NEVER use with user input
-element.innerHTML = userInput;        // XSS
-element.outerHTML = userInput;        // XSS
-document.write(userInput);            // XSS
-document.writeln(userInput);          // XSS
+element.innerHTML = userInput; // XSS
+element.outerHTML = userInput; // XSS
+document.write(userInput); // XSS
+document.writeln(userInput); // XSS
 
 // JavaScript execution sinks
-eval(userInput);                      // XSS
-new Function(userInput);              // XSS
-setTimeout(userInput, time);          // XSS if string
-setInterval(userInput, time);         // XSS if string
+eval(userInput); // XSS
+new Function(userInput); // XSS
+setTimeout(userInput, time); // XSS if string
+setInterval(userInput, time); // XSS if string
 
 // URL sinks
-location.href = userInput;            // XSS
-location.assign(userInput);           // XSS
-location.replace(userInput);          // XSS
-window.open(userInput);               // XSS
+location.href = userInput; // XSS
+location.assign(userInput); // XSS
+location.replace(userInput); // XSS
+window.open(userInput); // XSS
 ```
 
 ### Safe Alternatives
 
 ```javascript
 // Safe text insertion
-element.textContent = userInput;      // Safe
-element.innerText = userInput;        // Safe
+element.textContent = userInput; // Safe
+element.innerText = userInput; // Safe
 
 // Safe attribute setting (for safe attributes)
-element.setAttribute('title', userInput); // Safe for non-event attributes
+element.setAttribute("title", userInput); // Safe for non-event attributes
 
 // Safe URL handling
 const url = new URL(userInput, window.location.origin);
-if (url.protocol === 'https:') {
+if (url.protocol === "https:") {
   location.href = url.href;
 }
 ```
@@ -59,19 +59,19 @@ When HTML must be rendered, use sanitization:
 
 ```javascript
 // Using DOMPurify (recommended)
-import DOMPurify from 'dompurify';
+import DOMPurify from "dompurify";
 element.innerHTML = DOMPurify.sanitize(userInput);
 
 // With configuration
 const clean = DOMPurify.sanitize(dirty, {
-  ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a'],
-  ALLOWED_ATTR: ['href', 'title']
+  ALLOWED_TAGS: ["b", "i", "em", "strong", "a"],
+  ALLOWED_ATTR: ["href", "title"],
 });
 
 // Browser Sanitizer API (when available)
 const sanitizer = new Sanitizer({
-  allowElements: ['b', 'i', 'em', 'strong', 'a'],
-  allowAttributes: { 'href': ['a'] }
+  allowElements: ["b", "i", "em", "strong", "a"],
+  allowAttributes: { href: ["a"] },
 });
 element.setHTML(userInput, { sanitizer });
 ```
@@ -131,7 +131,7 @@ const safeUrl = userInput.startsWith('https://') ? userInput : '#';
 function isValidUrl(input) {
   try {
     const url = new URL(input);
-    return ['http:', 'https:'].includes(url.protocol);
+    return ["http:", "https:"].includes(url.protocol);
   } catch {
     return false;
   }
@@ -139,12 +139,14 @@ function isValidUrl(input) {
 
 // Prevent javascript: URLs
 function sanitizeHref(input) {
-  if (!input) return '#';
+  if (!input) return "#";
   const trimmed = input.trim().toLowerCase();
-  if (trimmed.startsWith('javascript:') ||
-      trimmed.startsWith('data:') ||
-      trimmed.startsWith('vbscript:')) {
-    return '#';
+  if (
+    trimmed.startsWith("javascript:") ||
+    trimmed.startsWith("data:") ||
+    trimmed.startsWith("vbscript:")
+  ) {
+    return "#";
   }
   return input;
 }
@@ -156,8 +158,8 @@ Always set appropriate Content-Type headers:
 
 ```javascript
 // Express.js
-res.setHeader('Content-Type', 'application/json');
-res.setHeader('X-Content-Type-Options', 'nosniff');
+res.setHeader("Content-Type", "application/json");
+res.setHeader("X-Content-Type-Options", "nosniff");
 ```
 
 OWASP Reference: https://cheatsheetseries.owasp.org/cheatsheets/Cross_Site_Scripting_Prevention_Cheat_Sheet.html

package/skills/frontend-testing/SKILL.md

@@ -16,7 +16,7 @@ This principle guides testing decisions, but isn't the whole picture:
 - **Acceptance criteria tests** verify the system does what users/stakeholders need. These should be stable across refactors.
 - **Implementation tests** verify the pieces are robust — edge cases, error handling, complex logic. These may change when you refactor.
 
-Both have value. The anti-pattern to avoid is tests that *only* mirror implementation without validating meaningful behavior.
+Both have value. The anti-pattern to avoid is tests that _only_ mirror implementation without validating meaningful behavior.
 
 ## When to Load References
 
@@ -36,6 +36,7 @@ Load reference files based on test type:
 Before writing any test, identify what the code should do from the user's perspective.
 
 Ask for or extract criteria from:
+
 - Ticket description or user story
 - Figma annotations
 - Functional requirements
@@ -48,11 +49,13 @@ Document criteria as a checklist. These become your first tests.
 ### Step 2: Map Criteria to Test Cases
 
 For each criterion, identify:
+
 - **Happy path**: Normal expected behavior
 - **Edge cases**: Boundary conditions
 - **Error cases**: Invalid inputs, failures
 
 Example mapping:
+
 ```text
 Criterion: "User can filter products by category"
 ├─ Happy path: Select category, products filter correctly
@@ -85,14 +88,14 @@ The distinction: acceptance tests should rarely change on refactor; implementati
 
 ### Step 4: Choose Test Type
 
-| Scenario | Test Type | Tool |
-|----------|-----------|------|
-| Pure logic (no DOM) | Unit test | Vitest |
-| Component behavior | Unit test with DOM | Vitest + Testing Library |
-| User flows, real browser | E2E test | Playwright |
-| Semantic structure validation | ARIA snapshot | Playwright `toMatchAriaSnapshot` |
-| Visual appearance | VRT | Playwright screenshots |
-| Accessibility compliance | A11y test | Playwright + axe-core |
+| Scenario                      | Test Type          | Tool                             |
+| ----------------------------- | ------------------ | -------------------------------- |
+| Pure logic (no DOM)           | Unit test          | Vitest                           |
+| Component behavior            | Unit test with DOM | Vitest + Testing Library         |
+| User flows, real browser      | E2E test           | Playwright                       |
+| Semantic structure validation | ARIA snapshot      | Playwright `toMatchAriaSnapshot` |
+| Visual appearance             | VRT                | Playwright screenshots           |
+| Accessibility compliance      | A11y test          | Playwright + axe-core            |
 
 **ARIA snapshots** are particularly valuable for E2E tests. A single snapshot can replace multiple individual assertions while validating the accessibility tree structure.
 
@@ -114,10 +117,10 @@ describe("calculateDiscount", () => {
     it("applies 20% discount to order total", () => {
       // Arrange - Set up test data matching criterion
       const order = { total: 100, membership: "premium" };
-      
+
       // Act - Call the function
       const result = calculateDiscount(order);
-      
+
       // Assert - Verify expected outcome from requirements
       expect(result).toBe(80);
     });
@@ -136,24 +139,14 @@ describe("LoginForm", () => {
     it("displays error message to user", async () => {
       const user = userEvent.setup();
       render(<LoginForm />);
-      
+
       // Interact using accessible queries
-      await user.type(
-        screen.getByLabelText(/email/i),
-        "invalid@test.com"
-      );
-      await user.type(
-        screen.getByLabelText(/password/i),
-        "wrong"
-      );
-      await user.click(
-        screen.getByRole("button", { name: /sign in/i })
-      );
-      
+      await user.type(screen.getByLabelText(/email/i), "invalid@test.com");
+      await user.type(screen.getByLabelText(/password/i), "wrong");
+      await user.click(screen.getByRole("button", { name: /sign in/i }));
+
       // Assert on user-visible outcome
-      expect(
-        await screen.findByRole("alert")
-      ).toHaveTextContent(/invalid credentials/i);
+      expect(await screen.findByRole("alert")).toHaveTextContent(/invalid credentials/i);
     });
   });
 });
@@ -168,10 +161,10 @@ test.describe("Product Catalog", () => {
   test.describe("filtering by category", () => {
     test("shows only matching products", async ({ page }) => {
       await page.goto("/products");
-      
+
       // Use semantic locators
       await page.getByRole("combobox", { name: /category/i }).selectOption("Electronics");
-      
+
       // Assert count, then spot-check first/last
       const products = page.getByRole("article");
       await expect(products).toHaveCount(5);
@@ -188,14 +181,12 @@ When you need to verify all items, use `Promise.all` for parallel assertions:
 test("all products match filter", async ({ page }) => {
   await page.goto("/products");
   await page.getByRole("combobox", { name: /category/i }).selectOption("Electronics");
-  
+
   const products = await page.getByRole("article").all();
-  
+
   // Parallel assertions — faster than sequential await in a loop
   await Promise.all(
-    products.map(product =>
-      expect(product.getByText(/electronics/i)).toBeVisible()
-    )
+    products.map((product) => expect(product.getByText(/electronics/i)).toBeVisible()),
   );
 });
 ```
@@ -208,7 +199,7 @@ ARIA snapshots consolidate multiple assertions into one, validating semantic str
 test.describe("Login Page", () => {
   test("has correct form structure", async ({ page }) => {
     await page.goto("/login");
-    
+
     // One snapshot replaces 5+ individual assertions
     await expect(page.getByRole("main")).toMatchAriaSnapshot(`
       - heading "Sign In" [level=1]
@@ -218,11 +209,11 @@ test.describe("Login Page", () => {
       - link "Forgot password?"
     `);
   });
-  
+
   test("shows validation errors on empty submit", async ({ page }) => {
     await page.goto("/login");
     await page.getByRole("button", { name: /sign in/i }).click();
-    
+
     await expect(page.getByRole("form")).toMatchAriaSnapshot(`
       - textbox "Email"
       - text "Email is required"
@@ -279,7 +270,7 @@ it("returns validation errors for malformed email", () => {
 });
 ```
 
-The key distinction: implementation tests should verify *meaningful* behavior of units, not just that code paths execute.
+The key distinction: implementation tests should verify _meaningful_ behavior of units, not just that code paths execute.
 
 ### Circular Validation
 
@@ -324,11 +315,13 @@ page.getByRole("button", { name: /submit order/i });
 When a test fails, the investigation depends on the test type:
 
 **Acceptance test fails:**
+
 1. Check the code under test first — likely a real bug
 2. Verify the test still matches current requirements — requirements may have changed
 3. Only update the test after confirming the new behavior is correct
 
 **Implementation test fails:**
+
 1. If you're refactoring, the test may legitimately need updating
 2. If you're not refactoring, check the code — likely a bug
 3. Consider whether the test is too tightly coupled to implementation