fix: should forward sourcemaps for refresh loaders (web-infra-dev#7872)

crates/rspack_loader_preact_refresh/src/lib.rs

@@ -27,13 +27,14 @@ impl PreactRefreshLoader {
 #[async_trait::async_trait]
 impl Loader<RunnerContext> for PreactRefreshLoader {
   async fn run(&self, loader_context: &mut LoaderContext<RunnerContext>) -> Result<()> {
-    let content = loader_context
-      .take_content()
-      .expect("Content should be available");
+    let Some(content) = loader_context.take_content() else {
+      return Ok(());
+    };
     let mut source = content.try_into_string()?;
     source += "\n";
     source += include_str!("runtime.js");
-    loader_context.finish_with(source);
+    let sm = loader_context.take_source_map();
+    loader_context.finish_with((source, sm));
     Ok(())
   }
 }

crates/rspack_loader_react_refresh/src/lib.rs

@@ -42,7 +42,8 @@ Promise.resolve().then(function() {
   $ReactRefreshRuntime$.refresh(__webpack_module__.id, __webpack_module__.hot);
 });
 "#;
-    loader_context.finish_with(source);
+    let sm = loader_context.take_source_map();
+    loader_context.finish_with((source, sm));
     Ok(())
   }
 }

packages/rspack-test-tools/package.json

@@ -73,6 +73,8 @@
     "@monaco-editor/react": "^4.6.0",
     "@rspack/cli": "workspace:*",
     "@rspack/core": "workspace:*",
+    "@rspack/plugin-react-refresh": "1.0.0",
+    "@rspack/plugin-preact-refresh": "1.0.0",
     "@swc/helpers": "0.5.8",
     "@swc/plugin-remove-console": "^2.0.8",
     "@types/babel__generator": "7.6.8",

packages/rspack-test-tools/tests/configCases/builtin-swc-loader/preact-refresh/index.jsx

@@ -0,0 +1,9 @@
+function component () {
+	return <div></div>
+}
+
+it('should work with preact-refresh', () => {
+  const fs = require("fs")
+  let map = fs.readFileSync(__filename + ".map", "utf-8")
+  expect(map).toContain(STUB)
+})

packages/rspack-test-tools/tests/configCases/builtin-swc-loader/preact-refresh/rspack.config.js

@@ -0,0 +1,57 @@
+const rspack = require("@rspack/core")
+const PreactRefreshPlugin = require("@rspack/plugin-preact-refresh");
+const { ConcatSource, RawSource } = require("webpack-sources")
+/** @type {import("@rspack/core").Configuration} */
+module.exports = {
+	entry: "./index.jsx",
+	mode: "development",
+	resolve: {
+		extensions: ["...", ".ts", ".tsx", ".jsx"]
+	},
+	devtool: "source-map",
+	module: {
+		rules: [
+			{
+				test: /\.jsx$/,
+				loader: "builtin:swc-loader",
+				options: {
+					jsc: {
+						parser: {
+							syntax: "ecmascript",
+							jsx: true,
+							sourceMap: true,
+						},
+						transform: {
+							react: {
+								runtime: "classic",
+								pragma: "React.createElement",
+								pragmaFrag: "React.Fragment",
+								throwIfNamespace: true,
+								useBuiltins: false
+							}
+						}
+					}
+				}
+			}
+		]
+	},
+	plugins: [
+		new rspack.HotModuleReplacementPlugin(),
+		new PreactRefreshPlugin(),
+		new rspack.DefinePlugin({
+			STUB: JSON.stringify("<div></div>")
+		}),
+		{
+			apply(compiler) {
+				compiler.hooks.compilation.tap("_", (compilation) => {
+					compilation.hooks.processAssets.tap("_", (assets) => {
+						compilation.updateAsset("bundle0.js",new ConcatSource(
+							new RawSource("const self = globalThis;"), // mock self to NodeJs specific global object
+							assets["bundle0.js"]
+						))
+					})
+				})
+			}
+		}
+	]
+};

packages/rspack-test-tools/tests/configCases/builtin-swc-loader/react-refresh/index.jsx

@@ -0,0 +1,9 @@
+function component () {
+	return <div></div>
+}
+
+it('should work with react refresh', () => {
+  const fs = require("fs")
+  let map = fs.readFileSync(__filename + ".map", "utf-8")
+  expect(map).toContain(STUB)
+})

packages/rspack-test-tools/tests/configCases/builtin-swc-loader/react-refresh/rspack.config.js

@@ -0,0 +1,44 @@
+const rspack = require("@rspack/core")
+const ReactRefreshPlugin = require("@rspack/plugin-react-refresh");
+/** @type {import("@rspack/core").Configuration} */
+module.exports = {
+	entry: "./index.jsx",
+	mode: "development",
+	resolve: {
+		extensions: ["...", ".ts", ".tsx", ".jsx"]
+	},
+	devtool: "source-map",
+	module: {
+		rules: [
+			{
+				test: /\.jsx$/,
+				loader: "builtin:swc-loader",
+				options: {
+					jsc: {
+						parser: {
+							syntax: "ecmascript",
+							jsx: true,
+							sourceMap: true,
+						},
+						transform: {
+							react: {
+								runtime: "classic",
+								pragma: "React.createElement",
+								pragmaFrag: "React.Fragment",
+								throwIfNamespace: true,
+								useBuiltins: false
+							}
+						}
+					}
+				}
+			}
+		]
+	},
+	plugins: [
+		new rspack.HotModuleReplacementPlugin(),
+		new ReactRefreshPlugin(),
+		new rspack.DefinePlugin({
+			STUB: JSON.stringify("<div></div>")
+		})
+	]
+};