fix: TypeScript helper transpilation for multi-file imports

- Fixed import detection regex to match ./ and ../ patterns correctly
- Fixed extension handling for files like ./abstract.helper.ts
- Fixed import path calculation to use temp file directory
- Added recursive transpilation for imported TypeScript dependencies
- Import paths are now correctly rewritten to .temp.mjs files

Resolves issue where custom TypeScript helpers could not import from
other TypeScript files, resulting in 'Cannot find module' errors.

Version bump to 4.0.0-beta.22

Author: kobenguyent

CHANGELOG.md

@@ -1,3 +1,12 @@
+## 4.0.0-beta.22
+
+### 🐛 Bug Fixes
+
+- Fixed TypeScript helper transpilation to support imports from other TypeScript files
+  - Custom helpers can now import from other TypeScript files (e.g., `import { AbstractHelper } from './abstract.helper'`)
+  - Automatically transpiles imported TypeScript dependencies recursively
+  - Correctly rewrites import paths in transpiled `.temp.mjs` files
+
 ## 3.7.5
 
 ❤️ Thanks all to those who contributed to make this release! ❤️

lib/utils/typescript.js

@@ -4,7 +4,7 @@ import path from 'path'
 /**
  * Transpile TypeScript files to ES modules with CommonJS shim support
  * Handles recursive transpilation of imported TypeScript files
- * 
+ *
  * @param {string} mainFilePath - Path to the main TypeScript file to transpile
  * @param {object} typescript - TypeScript compiler instance
  * @returns {Promise<{tempFile: string, allTempFiles: string[]}>} - Main temp file and all temp files created
@@ -16,9 +16,9 @@ export async function transpileTypeScript(mainFilePath, typescript) {
    * Transpile a single TypeScript file to JavaScript
    * Injects CommonJS shims (require, module, exports, __dirname, __filename) as needed
    */
-  const transpileTS = (filePath) => {
+  const transpileTS = filePath => {
     const tsContent = fs.readFileSync(filePath, 'utf8')
-    
+
     // Transpile TypeScript to JavaScript with ES module output
     let jsContent = transpile(tsContent, {
       module: 99, // ModuleKind.ESNext
@@ -29,16 +29,16 @@ export async function transpileTypeScript(mainFilePath, typescript) {
       suppressOutputPathCheck: true,
       skipLibCheck: true,
     })
-    
+
     // Check if the code uses CommonJS globals
     const usesCommonJSGlobals = /__dirname|__filename/.test(jsContent)
     const usesRequire = /\brequire\s*\(/.test(jsContent)
     const usesModuleExports = /\b(module\.exports|exports\.)/.test(jsContent)
-    
+
     if (usesCommonJSGlobals || usesRequire || usesModuleExports) {
       // Inject ESM equivalents at the top of the file
       let esmGlobals = ''
-      
+
       if (usesRequire || usesModuleExports) {
         // IMPORTANT: Use the original .ts file path as the base for require()
         // This ensures dynamic require() calls work with relative paths from the original file location
@@ -81,7 +81,7 @@ const exports = module.exports;
 
 `
       }
-      
+
       if (usesCommonJSGlobals) {
         // For __dirname and __filename, also use the original file path
         const originalFileUrl = `file://${filePath.replace(/\\/g, '/')}`
@@ -92,56 +92,57 @@ const __dirname = __dirname_fn(__filename);
 
 `
       }
-      
+
       jsContent = esmGlobals + jsContent
-      
+
       // If module.exports is used, we need to export it as default
       if (usesModuleExports) {
         jsContent += `\nexport default module.exports;\n`
       }
     }
-    
+
     return jsContent
   }
-  
+
   // Create a map to track transpiled files
   const transpiledFiles = new Map()
   const baseDir = path.dirname(mainFilePath)
-  
+
   // Recursive function to transpile a file and all its TypeScript dependencies
-  const transpileFileAndDeps = (filePath) => {
+  const transpileFileAndDeps = filePath => {
     // Already transpiled, skip
     if (transpiledFiles.has(filePath)) {
       return
     }
-    
+
     // Transpile this file
     let jsContent = transpileTS(filePath)
-    
+
     // Find all relative TypeScript imports in this file
-    const importRegex = /from\s+['"](\..+?)(?:\.ts)?['"]/g
+    // Match imports that start with ./ or ../
+    const importRegex = /from\s+['"](\.\.?\/[^'"]+?)(?:\.ts)?['"]/g
     let match
     const imports = []
-    
+
     while ((match = importRegex.exec(jsContent)) !== null) {
       imports.push(match[1])
     }
-    
+
     // Get the base directory for this file
     const fileBaseDir = path.dirname(filePath)
-    
+
     // Recursively transpile each imported TypeScript file
     for (const relativeImport of imports) {
       let importedPath = path.resolve(fileBaseDir, relativeImport)
-      
+
       // Handle .js extensions that might actually be .ts files
       if (importedPath.endsWith('.js')) {
         const tsVersion = importedPath.replace(/\.js$/, '.ts')
         if (fs.existsSync(tsVersion)) {
           importedPath = tsVersion
         }
       }
-      
+
       // Try adding .ts extension if file doesn't exist and no extension provided
       if (!path.extname(importedPath)) {
         const tsPath = importedPath + '.ts'
@@ -155,68 +156,76 @@ const __dirname = __dirname_fn(__filename);
             continue
           }
         }
+      } else if (importedPath.match(/\.[^./\\]+$/)) {
+        // Has an extension that's not .ts - check if .ts version exists by appending .ts
+        const tsPath = importedPath + '.ts'
+        if (fs.existsSync(tsPath)) {
+          importedPath = tsPath
+        }
       }
-      
+
       // If it's a TypeScript file, recursively transpile it and its dependencies
       if (importedPath.endsWith('.ts') && fs.existsSync(importedPath)) {
         transpileFileAndDeps(importedPath)
       }
     }
-    
+
     // After all dependencies are transpiled, rewrite imports in this file
-    jsContent = jsContent.replace(
-      /from\s+['"](\..+?)(?:\.ts)?['"]/g,
-      (match, importPath) => {
-        let resolvedPath = path.resolve(fileBaseDir, importPath)
-        
-        // Handle .js extension that might be .ts
-        if (resolvedPath.endsWith('.js')) {
-          const tsVersion = resolvedPath.replace(/\.js$/, '.ts')
-          if (transpiledFiles.has(tsVersion)) {
-            const tempFile = transpiledFiles.get(tsVersion)
-            const relPath = path.relative(fileBaseDir, tempFile).replace(/\\/g, '/')
-            // Ensure the path starts with ./
-            if (!relPath.startsWith('.')) {
-              return `from './${relPath}'`
-            }
-            return `from '${relPath}'`
-          }
-        }
-        
-        // Try with .ts extension
-        const tsPath = resolvedPath.endsWith('.ts') ? resolvedPath : resolvedPath + '.ts'
-        
-        // If we transpiled this file, use the temp file
-        if (transpiledFiles.has(tsPath)) {
-          const tempFile = transpiledFiles.get(tsPath)
-          const relPath = path.relative(fileBaseDir, tempFile).replace(/\\/g, '/')
+    // IMPORTANT: We need to calculate temp file location first so we can compute correct relative paths
+    const tempFile = filePath.replace(/\.ts$/, '.temp.mjs')
+    const tempFileDir = path.dirname(tempFile)
+
+    jsContent = jsContent.replace(/from\s+['"](\.\.?\/[^'"]+?)(?:\.ts)?['"]/g, (match, importPath) => {
+      let resolvedPath = path.resolve(fileBaseDir, importPath)
+
+      // Handle .js extension that might be .ts
+      if (resolvedPath.endsWith('.js')) {
+        const tsVersion = resolvedPath.replace(/\.js$/, '.ts')
+        if (transpiledFiles.has(tsVersion)) {
+          const importedTempFile = transpiledFiles.get(tsVersion)
+          // Calculate relative path from THIS temp file to the imported temp file
+          const relPath = path.relative(tempFileDir, importedTempFile).replace(/\\/g, '/')
           // Ensure the path starts with ./
           if (!relPath.startsWith('.')) {
             return `from './${relPath}'`
           }
           return `from '${relPath}'`
         }
-        
-        // Otherwise, keep the import as-is
-        return match
       }
-    )
-    
+
+      // Try with .ts extension
+      const tsPath = resolvedPath.endsWith('.ts') ? resolvedPath : resolvedPath + '.ts'
+
+      // If we transpiled this file, use the temp file
+      if (transpiledFiles.has(tsPath)) {
+        const importedTempFile = transpiledFiles.get(tsPath)
+        // Calculate relative path from THIS temp file to the imported temp file
+        const relPath = path.relative(tempFileDir, importedTempFile).replace(/\\/g, '/')
+        // Ensure the path starts with ./
+        if (!relPath.startsWith('.')) {
+          return `from './${relPath}'`
+        }
+        return `from '${relPath}'`
+      }
+
+      // Otherwise, keep the import as-is (for npm packages)
+      return match
+    })
+
     // Write the transpiled file with updated imports
-    const tempFile = filePath.replace(/\.ts$/, '.temp.mjs')
     fs.writeFileSync(tempFile, jsContent)
     transpiledFiles.set(filePath, tempFile)
   }
-  
+
   // Start recursive transpilation from the main file
   transpileFileAndDeps(mainFilePath)
-  
+
   // Get the main transpiled file
   const tempJsFile = transpiledFiles.get(mainFilePath)
-  
+
   // Store all temp files for cleanup
   const allTempFiles = Array.from(transpiledFiles.values())
-  
+
   return { tempFile: tempJsFile, allTempFiles }
 }
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "codeceptjs",
-  "version": "4.0.0-beta.21",
+  "version": "4.0.0-beta.22",
   "type": "module",
   "description": "Supercharged End 2 End Testing Framework for NodeJS",
   "keywords": [

test/data/typescript-helper-autoload/helpers/abstract.helper.ts

@@ -0,0 +1,11 @@
+import Helper from '@codeceptjs/helper'
+
+export abstract class AbstractHelper extends Helper {
+  protected getHelperName(): string {
+    return this.constructor.name
+  }
+
+  protected log(message: string): void {
+    console.log(`[${this.getHelperName()}] ${message}`)
+  }
+}

test/data/typescript-helper-autoload/helpers/custom.helper.ts

@@ -1,18 +1,18 @@
-import Helper from '@codeceptjs/helper';
+import { AbstractHelper } from './abstract.helper'
 
 interface TestData {
-  message: string;
-  count: number;
+  message: string
+  count: number
 }
 
-class CustomHelper extends Helper {
+class CustomHelper extends AbstractHelper {
   async logTestData(data: TestData): Promise<void> {
-    console.log(`Message: ${data.message}, Count: ${data.count}`);
+    this.log(`Message: ${data.message}, Count: ${data.count}`)
   }
 
   getGreeting(name: string): string {
-    return `Hello, ${name}!`;
+    return `Hello, ${name}!`
   }
 }
 
-export default CustomHelper;
+export default CustomHelper