shakapacker 8.0.2 → 9.2.0

data/test/typescript/pathValidation.test.js

@@ -0,0 +1,142 @@
+// Tests for path validation and security utilities
+const path = require("path")
+const {
+  isPathTraversalSafe,
+  safeResolvePath,
+  validatePaths,
+  sanitizeEnvValue,
+  validatePort
+} = require("../../package/utils/pathValidation")
+
+describe("Path Validation Security", () => {
+  describe("isPathTraversalSafe", () => {
+    it("detects directory traversal patterns", () => {
+      const unsafePaths = [
+        "../etc/passwd",
+        "../../secrets",
+        "/etc/passwd",
+        "~/ssh/keys",
+        "C:\\Windows\\System32",
+        "C:/Windows/System32", // Windows with forward slash
+        "D:\\Program Files", // Different drive letter
+        "\\\\server\\share\\file", // Windows UNC path
+        "\\\\192.168.1.1\\share", // UNC with IP
+        "%2e%2e%2fsecrets",
+        "%2E%2E%2Fsecrets", // URL encoded uppercase
+        "path\x00with\x00null" // Null bytes
+      ]
+
+      unsafePaths.forEach((unsafePath) => {
+        expect(isPathTraversalSafe(unsafePath)).toBe(false)
+      })
+    })
+
+    it("allows safe relative paths", () => {
+      const safePaths = [
+        path.join("src", "index.js"),
+        path.join(".", "components", "App.tsx"),
+        path.join("node_modules", "package", "index.js"),
+        path.join("dist", "bundle.js")
+      ]
+
+      safePaths.forEach((safePath) => {
+        expect(isPathTraversalSafe(safePath)).toBe(true)
+      })
+    })
+  })
+
+  describe("safeResolvePath", () => {
+    it("resolves paths within base directory", () => {
+      const basePath = path.join(path.sep, "app")
+      const userPath = path.join("src", "index.js")
+      const result = safeResolvePath(basePath, userPath)
+
+      expect(result).toContain(basePath)
+      expect(result).toContain(userPath.replace(/\\/g, path.sep))
+    })
+
+    it("throws on traversal attempts", () => {
+      const basePath = path.join(path.sep, "app")
+      const maliciousPath = path.join("..", "etc", "passwd")
+
+      expect(() => {
+        safeResolvePath(basePath, maliciousPath)
+      }).toThrow("Path traversal attempt detected")
+    })
+  })
+
+  describe("validatePaths", () => {
+    it("filters out unsafe paths with warnings", () => {
+      const consoleSpy = jest.spyOn(console, "warn").mockImplementation()
+
+      const paths = [
+        path.join("src", "index.js"),
+        path.join("..", "etc", "passwd"),
+        path.join("components", "App.tsx")
+      ]
+
+      const result = validatePaths(paths, path.join(path.sep, "app"))
+
+      expect(result).toHaveLength(2)
+      expect(consoleSpy).toHaveBeenCalledWith(
+        expect.stringContaining("potentially unsafe path")
+      )
+
+      consoleSpy.mockRestore()
+    })
+  })
+
+  describe("sanitizeEnvValue", () => {
+    it("removes control characters", () => {
+      const dirty = "normal\x00text\x1Fwith\x7Fcontrol"
+      const clean = sanitizeEnvValue(dirty)
+
+      expect(clean).toBe("normaltextwithcontrol")
+    })
+
+    it("warns when sanitization occurs", () => {
+      const consoleSpy = jest.spyOn(console, "warn").mockImplementation()
+
+      sanitizeEnvValue("text\x00with\x00nulls")
+
+      expect(consoleSpy).toHaveBeenCalledWith(
+        expect.stringContaining("control characters")
+      )
+
+      consoleSpy.mockRestore()
+    })
+
+    it("returns undefined for undefined input", () => {
+      expect(sanitizeEnvValue(undefined)).toBeUndefined()
+    })
+  })
+
+  describe("validatePort", () => {
+    it("accepts valid port numbers", () => {
+      expect(validatePort(3000)).toBe(true)
+      expect(validatePort(80)).toBe(true)
+      expect(validatePort(65535)).toBe(true)
+    })
+
+    it("accepts valid port strings", () => {
+      expect(validatePort("3000")).toBe(true)
+      expect(validatePort("auto")).toBe(true)
+    })
+
+    it("rejects invalid ports", () => {
+      expect(validatePort(0)).toBe(false)
+      expect(validatePort(65536)).toBe(false)
+      expect(validatePort(-1)).toBe(false)
+      expect(validatePort(3000.5)).toBe(false)
+      expect(validatePort("invalid")).toBe(false)
+      expect(validatePort("3000abc")).toBe(false) // Should reject strings with non-digits
+      expect(validatePort("abc3000")).toBe(false) // Should reject strings with non-digits
+      expect(validatePort("30.00")).toBe(false) // Should reject decimal strings
+      expect(validatePort("3000 ")).toBe(false) // Should reject strings with spaces
+      expect(validatePort(" 3000")).toBe(false) // Should reject strings with spaces
+      expect(validatePort("0x1234")).toBe(false) // Should reject hex notation
+      expect(validatePort(null)).toBe(false)
+      expect(validatePort(undefined)).toBe(false)
+    })
+  })
+})

data/test/typescript/securityValidation.test.js

@@ -0,0 +1,182 @@
+const {
+  isValidConfig,
+  clearValidationCache
+} = require("../../package/utils/typeGuards")
+
+describe("security validation", () => {
+  const originalNodeEnv = process.env.NODE_ENV
+  const originalStrictValidation = process.env.SHAKAPACKER_STRICT_VALIDATION
+
+  afterEach(() => {
+    process.env.NODE_ENV = originalNodeEnv
+    process.env.SHAKAPACKER_STRICT_VALIDATION = originalStrictValidation
+    clearValidationCache()
+  })
+
+  describe("path traversal security checks", () => {
+    const baseConfig = {
+      source_path: "./app/javascript",
+      source_entry_path: "./packs",
+      public_root_path: "./public",
+      public_output_path: "packs",
+      cache_path: "tmp/shakapacker",
+      javascript_transpiler: "babel",
+      nested_entries: false,
+      css_extract_ignore_order_warnings: false,
+      webpack_compile_output: true,
+      shakapacker_precompile: true,
+      cache_manifest: false,
+      ensure_consistent_versioning: false,
+      useContentHash: true,
+      compile: true,
+      additional_paths: []
+    }
+
+    it("always validates path traversal in required path fields in production", () => {
+      process.env.NODE_ENV = "production"
+      delete process.env.SHAKAPACKER_STRICT_VALIDATION
+
+      const unsafeConfig = {
+        ...baseConfig,
+        source_path: "../../../etc/passwd"
+      }
+
+      expect(isValidConfig(unsafeConfig)).toBe(false)
+    })
+
+    it("always validates path traversal in required path fields in development", () => {
+      process.env.NODE_ENV = "development"
+
+      const unsafeConfig = {
+        ...baseConfig,
+        public_output_path: "../../sensitive/data"
+      }
+
+      expect(isValidConfig(unsafeConfig)).toBe(false)
+    })
+
+    it("always validates path traversal in additional_paths in production", () => {
+      process.env.NODE_ENV = "production"
+      delete process.env.SHAKAPACKER_STRICT_VALIDATION
+
+      const unsafeConfig = {
+        ...baseConfig,
+        additional_paths: ["./safe/path", "../../../etc/passwd"]
+      }
+
+      expect(isValidConfig(unsafeConfig)).toBe(false)
+    })
+
+    it("always validates path traversal in additional_paths in development", () => {
+      process.env.NODE_ENV = "development"
+
+      const unsafeConfig = {
+        ...baseConfig,
+        additional_paths: ["./safe/path", "../../../../root/.ssh"]
+      }
+
+      expect(isValidConfig(unsafeConfig)).toBe(false)
+    })
+
+    it("allows safe paths in production", () => {
+      process.env.NODE_ENV = "production"
+      delete process.env.SHAKAPACKER_STRICT_VALIDATION
+
+      const safeConfig = {
+        ...baseConfig,
+        additional_paths: ["./app/assets", "./vendor/assets", "node_modules"]
+      }
+
+      expect(isValidConfig(safeConfig)).toBe(true)
+    })
+
+    it("allows safe paths in development", () => {
+      process.env.NODE_ENV = "development"
+
+      const safeConfig = {
+        ...baseConfig,
+        additional_paths: ["./app/components", "./lib/assets"]
+      }
+
+      expect(isValidConfig(safeConfig)).toBe(true)
+    })
+  })
+
+  describe("optional field validation", () => {
+    const validConfig = {
+      source_path: "./app/javascript",
+      source_entry_path: "./packs",
+      public_root_path: "./public",
+      public_output_path: "packs",
+      cache_path: "tmp/shakapacker",
+      javascript_transpiler: "babel",
+      nested_entries: false,
+      css_extract_ignore_order_warnings: false,
+      webpack_compile_output: true,
+      shakapacker_precompile: true,
+      cache_manifest: false,
+      ensure_consistent_versioning: false,
+      useContentHash: true,
+      compile: true,
+      additional_paths: [],
+      dev_server: {
+        hmr: true,
+        port: 3035
+      },
+      integrity: {
+        enabled: true,
+        cross_origin: "anonymous"
+      }
+    }
+
+    it("skips deep validation of optional fields in production without strict mode", () => {
+      process.env.NODE_ENV = "production"
+      delete process.env.SHAKAPACKER_STRICT_VALIDATION
+
+      // Invalid integrity config that would fail deep validation
+      const configWithInvalidOptional = {
+        ...validConfig,
+        integrity: {
+          enabled: "not-a-boolean", // Invalid type
+          cross_origin: "anonymous"
+        }
+      }
+
+      // Should pass because deep validation is skipped in production
+      expect(isValidConfig(configWithInvalidOptional)).toBe(true)
+    })
+
+    it("performs deep validation of optional fields in development", () => {
+      process.env.NODE_ENV = "development"
+
+      // Invalid integrity config
+      const configWithInvalidOptional = {
+        ...validConfig,
+        integrity: {
+          enabled: "not-a-boolean", // Invalid type
+          cross_origin: "anonymous"
+        }
+      }
+
+      // Should fail because deep validation runs in development
+      expect(isValidConfig(configWithInvalidOptional)).toBe(false)
+    })
+
+    it("performs deep validation in production with strict mode", () => {
+      process.env.NODE_ENV = "production"
+      process.env.SHAKAPACKER_STRICT_VALIDATION = "true"
+
+      // Invalid integrity config
+      const configWithInvalidOptional = {
+        ...validConfig,
+        integrity: {
+          enabled: "not-a-boolean", // Invalid type
+          cross_origin: "anonymous"
+        }
+      }
+
+      // Should fail because strict validation is enabled
+      expect(isValidConfig(configWithInvalidOptional)).toBe(false)
+    })
+  })
+})

data/tools/README.md

@@ -0,0 +1,124 @@
+# Shakapacker v9 Migration Tools
+
+## CSS Modules Codemod
+
+A jscodeshift codemod to help migrate CSS module imports from v8 to v9 format.
+
+### What it does
+
+#### For JavaScript files (.js, .jsx):
+- Converts `import styles from './styles.module.css'` to `import { className1, className2 } from './styles.module.css'`
+- Automatically detects which CSS classes are used in the file
+- Handles kebab-case to camelCase conversion (e.g., `my-button` → `myButton`)
+- Updates all class references from `styles.className` to `className`
+
+#### For TypeScript files (.ts, .tsx):
+- Converts `import styles from './styles.module.css'` to `import * as styles from './styles.module.css'`
+- Preserves the same usage pattern (`styles.className`)
+- Works around TypeScript's limitation with dynamic named exports
+
+### Installation
+
+```bash
+npm install -g jscodeshift
+```
+
+### Usage
+
+#### Dry run (see what would change):
+```bash
+npx jscodeshift -t tools/css-modules-v9-codemod.js src/ --dry
+```
+
+#### Apply to JavaScript files:
+```bash
+npx jscodeshift -t tools/css-modules-v9-codemod.js src/
+```
+
+#### Apply to TypeScript files:
+```bash
+npx jscodeshift -t tools/css-modules-v9-codemod.js --parser tsx src/
+```
+
+#### Apply to specific file patterns:
+```bash
+# Only .jsx files
+npx jscodeshift -t tools/css-modules-v9-codemod.js src/**/*.jsx
+
+# Only .tsx files
+npx jscodeshift -t tools/css-modules-v9-codemod.js --parser tsx src/**/*.tsx
+```
+
+### Options
+
+- `--dry` - Run without modifying files
+- `--print` - Print the transformed output
+- `--parser tsx` - Use TypeScript parser
+- `--verbose` - Show detailed progress
+
+### Examples
+
+#### Before (JavaScript):
+```javascript
+import styles from './Button.module.css';
+
+function Button() {
+  return (
+    <button className={styles.button}>
+      <span className={styles['button-text']}>Click me</span>
+    </button>
+  );
+}
+```
+
+#### After (JavaScript):
+```javascript
+import { button, buttonText } from './Button.module.css';
+
+function Button() {
+  return (
+    <button className={button}>
+      <span className={buttonText}>Click me</span>
+    </button>
+  );
+}
+```
+
+#### Before (TypeScript):
+```typescript
+import styles from './Button.module.css';
+
+const Button: React.FC = () => {
+  return <button className={styles.button}>Click</button>;
+};
+```
+
+#### After (TypeScript):
+```typescript
+import * as styles from './Button.module.css';
+
+const Button: React.FC = () => {
+  return <button className={styles.button}>Click</button>;
+};
+```
+
+### Notes
+
+1. **Kebab-case conversion**: CSS classes with kebab-case (e.g., `my-button`) are automatically converted to camelCase (`myButton`) for JavaScript files, matching css-loader's `exportLocalsConvention: 'camelCaseOnly'` setting.
+
+2. **Unused imports**: The codemod only imports CSS classes that are actually used in JavaScript files. If you pass the entire styles object to a component, it will convert to namespace import for safety.
+
+3. **Manual review recommended**: Always review the changes, especially for complex usage patterns or dynamic class name construction.
+
+4. **Backup your code**: Run the codemod on version-controlled code or create a backup first.
+
+### Troubleshooting
+
+**Issue**: Codemod doesn't detect all CSS class usages
+**Solution**: For dynamic class names or complex patterns, manual migration may be needed.
+
+**Issue**: TypeScript errors after transformation
+**Solution**: Ensure your TypeScript definitions are updated as shown in the [v9 Upgrade Guide](../docs/v9_upgrade.md).
+
+**Issue**: Runtime errors about missing CSS classes
+**Solution**: Check if you have kebab-case class names that need camelCase conversion.

data/tools/css-modules-v9-codemod.js

@@ -0,0 +1,179 @@
+#!/usr/bin/env node
+
+/**
+ * Shakapacker v9 CSS Modules Codemod
+ *
+ * This codemod helps migrate CSS module imports from v8 (default exports)
+ * to v9 (named exports for JS, namespace imports for TS).
+ *
+ * Usage:
+ *   npx jscodeshift -t tools/css-modules-v9-codemod.js src/
+ *   npx jscodeshift -t tools/css-modules-v9-codemod.js --parser tsx src/ (for TypeScript)
+ *
+ * Options:
+ *   --dry                Run in dry mode (no files modified)
+ *   --print              Print transformed files to stdout
+ *   --parser tsx         Use TypeScript parser
+ */
+
+module.exports = function transformer(fileInfo, api) {
+  const j = api.jscodeshift
+  const root = j(fileInfo.source)
+  let hasChanges = false
+
+  // Detect if this is a TypeScript file
+  const isTypeScript = fileInfo.path.match(/\.tsx?$/)
+
+  // Find all CSS module imports
+  root
+    .find(j.ImportDeclaration, {
+      source: {
+        value: (value) =>
+          value && value.match(/\.module\.(css|scss|sass|less)$/)
+      }
+    })
+    .forEach((path) => {
+      const importDecl = path.node
+
+      // Check if it's a default import (v8 style)
+      const defaultSpecifier = importDecl.specifiers.find(
+        (spec) => spec.type === "ImportDefaultSpecifier"
+      )
+
+      if (!defaultSpecifier) {
+        // Already using named or namespace imports, skip
+        return
+      }
+
+      const defaultImportName = defaultSpecifier.local.name
+
+      if (isTypeScript) {
+        // For TypeScript: Convert to namespace import (import * as styles)
+        const namespaceSpecifier = j.importNamespaceSpecifier(
+          j.identifier(defaultImportName)
+        )
+
+        // Replace the import specifiers
+        importDecl.specifiers = [namespaceSpecifier]
+        hasChanges = true
+      } else {
+        // For JavaScript: Convert to named imports
+        // First, we need to find all usages of the imported object
+        const usages = new Set()
+
+        // Find all member expressions using the imported default
+        root
+          .find(j.MemberExpression, {
+            object: {
+              type: "Identifier",
+              name: defaultImportName
+            }
+          })
+          .forEach((memberPath) => {
+            // Handle both dot notation (styles.className) and bracket notation (styles['class-name'])
+            if (
+              memberPath.node.computed &&
+              memberPath.node.property.type === "Literal"
+            ) {
+              // Computed property access: styles['active-button']
+              const propertyValue = memberPath.node.property.value
+              if (typeof propertyValue === "string") {
+                usages.add(propertyValue)
+              }
+            } else if (
+              !memberPath.node.computed &&
+              memberPath.node.property.type === "Identifier"
+            ) {
+              // Dot notation: styles.activeButton
+              const propertyName = memberPath.node.property.name
+              if (propertyName) {
+                usages.add(propertyName)
+              }
+            }
+          })
+
+        if (usages.size > 0) {
+          // Create named import specifiers
+          const namedSpecifiers = Array.from(usages)
+            .sort()
+            .map((name) => {
+              // Handle kebab-case to camelCase conversion
+              const camelCaseName = name.replace(/-([a-z])/g, (g) =>
+                g[1].toUpperCase()
+              )
+
+              if (camelCaseName !== name) {
+                // If conversion happened, we need to alias it
+                return j.importSpecifier(
+                  j.identifier(camelCaseName),
+                  j.identifier(camelCaseName) // css-loader exports it as camelCase
+                )
+              }
+
+              return j.importSpecifier(j.identifier(name))
+            })
+
+          // Replace the import specifiers
+          importDecl.specifiers = namedSpecifiers
+
+          // Update all usages in the file
+          root
+            .find(j.MemberExpression, {
+              object: {
+                type: "Identifier",
+                name: defaultImportName
+              }
+            })
+            .forEach((memberPath) => {
+              let propertyName
+
+              // Extract property name from both computed and dot notation
+              if (
+                memberPath.node.computed &&
+                memberPath.node.property.type === "Literal"
+              ) {
+                propertyName = memberPath.node.property.value
+              } else if (
+                !memberPath.node.computed &&
+                memberPath.node.property.type === "Identifier"
+              ) {
+                propertyName = memberPath.node.property.name
+              }
+
+              if (propertyName && typeof propertyName === "string") {
+                // Convert kebab-case to camelCase
+                const camelCaseName = propertyName.replace(/-([a-z])/g, (g) =>
+                  g[1].toUpperCase()
+                )
+                // Replace with direct identifier
+                j(memberPath).replaceWith(j.identifier(camelCaseName))
+              }
+            })
+
+          hasChanges = true
+        } else if (usages.size === 0) {
+          // No usages found, might be passed as a whole object
+          // In this case, convert to namespace import for safety
+          const namespaceSpecifier = j.importNamespaceSpecifier(
+            j.identifier(defaultImportName)
+          )
+
+          importDecl.specifiers = [namespaceSpecifier]
+          hasChanges = true
+        }
+      }
+    })
+
+  if (!hasChanges) {
+    return null // No changes made
+  }
+
+  return root.toSource({
+    quote: "single",
+    trailingComma: true,
+    tabWidth: 2
+  })
+}
+
+// Export the parser to use
+module.exports.parser = "tsx"

data/tsconfig.eslint.json

@@ -0,0 +1,16 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "noEmit": true,
+    "rootDir": "."
+  },
+  "include": [
+    "package/**/*.ts",
+    "package/**/*.tsx",
+    "package/**/*.test.ts",
+    "package/**/*.spec.ts",
+    "test/**/*.ts",
+    "test/**/*.tsx"
+  ],
+  "exclude": ["node_modules"]
+}

data/tsconfig.json

@@ -0,0 +1,38 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "commonjs",
+    "lib": ["ES2020"],
+    "importHelpers": false,
+    "typeRoots": [
+      "./node_modules/@types",
+      "node_modules/@types",
+      "../node_modules/@types"
+    ],
+    "declaration": true,
+    "declarationMap": true,
+    "outDir": "./package",
+    "rootDir": "./package",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "moduleResolution": "node",
+    "allowJs": true,
+    "checkJs": false,
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictBindCallApply": true,
+    "strictPropertyInitialization": false,
+    "noImplicitThis": true,
+    "alwaysStrict": true,
+    "allowSyntheticDefaultImports": true,
+    "preserveConstEnums": true,
+    "isolatedModules": true,
+    "removeComments": false
+  },
+  "include": ["package/**/*.ts"],
+  "exclude": ["node_modules", "package/**/*.test.ts", "package/**/*.spec.ts"]
+}