fix(devtools): stop wiping source maps in dev

.changeset/devtools-keep-sourcemaps.md

@@ -0,0 +1,5 @@
+---
+'@qwik.dev/devtools': patch
+---
+
+fix: devtools no longer drops the source maps of every module in dev

packages/devtools/plugin/src/plugin/devtools.ts

@@ -50,15 +50,14 @@ export function devtoolsPlugin(opts: QwikDevtoolsOptions = {}): Plugin {
     transform: {
       order: 'pre',
       handler(code, id) {
-        if (id.endsWith('.tsx') && code.includes('component$')) {
-          code = transformComponentFile(code, id);
+        let transformed = code;
+        if (id.endsWith('.tsx') && transformed.includes('component$')) {
+          transformed = transformComponentFile(transformed, id);
         }
-
         if (id.endsWith('root.tsx')) {
-          return { code: transformRootFile(code, opts), map: null };
+          transformed = transformRootFile(transformed, opts);
         }
-
-        return { code, map: { mappings: '' } };
+        return transformed === code ? null : { code: transformed, map: null };
       },
     },
 

packages/devtools/plugin/src/plugin/devtools.unit.ts

@@ -0,0 +1,48 @@
+import { mkdtemp, realpath, writeFile } from 'node:fs/promises';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { createServer } from 'vite';
+import { describe, expect, test } from 'vitest';
+import { devtoolsPlugin } from './devtools';
+
+describe('devtools plugin transform', () => {
+  test('keeps source maps for files it leaves alone and files it instruments', async () => {
+    // Windows tmpdir can be an 8.3 short path, which Vite's resolved ids won't match.
+    const root = await realpath(await mkdtemp(join(tmpdir(), 'qwik-devtools-sourcemap-')));
+    await writeFile(join(root, 'package.json'), JSON.stringify({ name: 'fixture' }));
+    await writeFile(join(root, 'util.ts'), 'export const double = (value: number) => value * 2;\n');
+    await writeFile(
+      join(root, 'qwik.ts'),
+      'export const component$ = (fn: unknown) => fn;\nexport const useSignal = (value: number) => ({ value });\n'
+    );
+    await writeFile(
+      join(root, 'counter.tsx'),
+      [
+        "import { component$, useSignal } from './qwik';",
+        'export const Counter = component$(() => {',
+        '  const count = useSignal(0);',
+        '  return count.value;',
+        '});',
+        '',
+      ].join('\n')
+    );
+    const server = await createServer({
+      configFile: false,
+      root,
+      logLevel: 'silent',
+      plugins: [devtoolsPlugin()],
+      server: { middlewareMode: true, ws: false },
+      optimizeDeps: { noDiscovery: true },
+    });
+
+    try {
+      for (const file of ['util.ts', 'counter.tsx']) {
+        const map = (await server.transformRequest(`/${file}`))?.map;
+        expect(map).toMatchObject({ sources: [file] });
+        expect(map?.mappings).not.toBe('');
+      }
+    } finally {
+      await server.close();
+    }
+  });
+});