diff --git a/packages/next/taskfile-swc.js b/packages/next/taskfile-swc.js
index 71f79fc86477..5b6553926670 100644
--- a/packages/next/taskfile-swc.js
+++ b/packages/next/taskfile-swc.js
@@ -118,7 +118,25 @@ module.exports = function (task) {
if (interopClientDefaultExport) {
output.code += `
if (typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) {
- Object.assign(exports.default, exports);
+ for (var exp in exports) {
+ if (Object.prototype.hasOwnProperty.call(exports, exp)) {
+ Object.defineProperty(exports.default, exp, {
+ enumerable: true,
+ configurable: true,
+ get: (function (exp) {
+ return function() {
+ return exports[exp];
+ }
+ })(exp),
+ set: (function (exp) {
+ return function(newValue) {
+ exports[exp] = newValue;
+ }
+ })(exp)
+ });
+ }
+ }
+ Object.defineProperty(exports.default, '__esModule', { value: true });
module.exports = exports.default;
}
`
diff --git a/test/unit/esm-interpolate/esm-interpolate.test.tsx b/test/unit/esm-interpolate/esm-interpolate.test.tsx
new file mode 100644
index 000000000000..c6ffb8137582
--- /dev/null
+++ b/test/unit/esm-interpolate/esm-interpolate.test.tsx
@@ -0,0 +1,14 @@
+import React from 'react'
+import { renderToString } from 'react-dom/server'
+import * as nextRouter from 'next/router'
+
+import { Foo } from './fixture'
+
+// @ts-expect-error
+jest.spyOn(nextRouter, 'useRouter').mockReturnValue({
+ pathname: 'Hello',
+})
+
+test('mock the interpolated modules should work', () => {
+ expect(renderToString(