Merge pull request #283 from mcous/svelte-5-modules

feat(svelte5): add support for Svelte 5 modules

Author: sebastianrothe

e2e/svelte-5/src/module.test.js

@@ -1,18 +1,15 @@
 import { test } from '@jest/globals'
 
-// TODO(mcous, 2024-05-23): this import fails
-// See https://github.com/svelteness/svelte-jester/pull/283
-// import * as Subject from "./module.svelte.js";
-const Subject = {}
+import * as Subject from './module.svelte.js'
 
-test.skip('get current count', () => {
+test('get current count', () => {
   const subject = Subject.createCounter()
   const result = subject.count
 
   expect(result).toBe(0)
 })
 
-test.skip('increment', () => {
+test('increment', () => {
   const subject = Subject.createCounter()
 
   subject.increment()

src/transformer.js

@@ -1,10 +1,10 @@
 import { execSync } from 'child_process'
 import { basename, extname } from 'path'
 import { pathToFileURL } from 'url'
-import { compile, preprocess as sveltePreprocess } from 'svelte/compiler'
+import * as SvelteCompiler from 'svelte/compiler'
 
 import { getSvelteConfig } from './svelteconfig.js'
-import { dynamicImport, IS_COMMON_JS, isSvelte3 } from './utils.js'
+import { dynamicImport, IS_COMMON_JS, isSvelte3, isSvelteModule } from './utils.js'
 
 const currentFileExtension = (global.__dirname !== undefined ? extname(__filename) : extname(pathToFileURL(import.meta.url).toString())).replace('.', '')
 
@@ -29,7 +29,7 @@ const processAsync = async (source, filename, jestOptions) => {
 
   const svelteConfigPath = getSvelteConfig(rootMode, filename, preprocess)
   const svelteConfig = await dynamicImport(svelteConfigPath)
-  const processed = await sveltePreprocess(
+  const processed = await SvelteCompiler.preprocess(
     source,
     svelteConfig.default.preprocess || {},
     { filename }
@@ -91,6 +91,8 @@ const compiler = (format, options = {}, filename, processedCode, processedMap) =
     opts.format = format
   }
 
+  const compile = isSvelteModule(filename) ? compileModule : compileComponent
+
   let result
   try {
     result = compile(processedCode, opts)
@@ -115,6 +117,18 @@ const compiler = (format, options = {}, filename, processedCode, processedMap) =
   }
 }
 
+const compileComponent = (processedCode, opts) => {
+  return SvelteCompiler.compile(processedCode, opts)
+}
+
+const compileModule = (processedCode, opts) => {
+  return SvelteCompiler.compileModule(processedCode, {
+    filename: opts.filename,
+    dev: opts.dev,
+    generate: opts.ssr ? 'server' : 'client'
+  })
+}
+
 export default {
   process: processSync,
   processAsync

src/utils.js

@@ -1,8 +1,17 @@
 import { pathToFileURL } from 'url'
-import { VERSION } from 'svelte/compiler'
+import * as SvelteCompiler from 'svelte/compiler'
 
 export const dynamicImport = async (filename) => import(pathToFileURL(filename).toString())
 
 export const IS_COMMON_JS = typeof module !== 'undefined'
 
-export const isSvelte3 = (version = VERSION) => version.startsWith('3')
+export const isSvelte3 = (version = SvelteCompiler.VERSION) => version.startsWith('3')
+
+const DEFAULT_SVELTE_MODULE_INFIX = ['.svelte.']
+
+const DEFAULT_SVELTE_MODULE_EXT = ['.js', '.ts']
+
+export const isSvelteModule = (filename) =>
+  typeof SvelteCompiler.compileModule === 'function' &&
+  DEFAULT_SVELTE_MODULE_INFIX.some((infix) => filename.includes(infix)) &&
+  DEFAULT_SVELTE_MODULE_EXT.some((ext) => filename.endsWith(ext))