diff --git a/packages/react-dev-overlay/src/middleware.ts b/packages/react-dev-overlay/src/middleware.ts index 1fbd3508a0a51f9..ea4b75f96b1578f 100644 --- a/packages/react-dev-overlay/src/middleware.ts +++ b/packages/react-dev-overlay/src/middleware.ts @@ -216,7 +216,9 @@ export async function createOriginalStackFrame({ sourcePosition.name || // default is not a valid identifier in JS so webpack uses a custom variable when it's an unnamed default export // Resolve it back to `default` for the method name if the source position didn't have the method. - frame.methodName?.replace('__WEBPACK_DEFAULT_EXPORT__', 'default'), + frame.methodName + ?.replace('__WEBPACK_DEFAULT_EXPORT__', 'default') + ?.replace('__webpack_exports__', 'exports'), arguments: [], } diff --git a/test/development/acceptance-app/ReactRefreshLogBox.test.ts b/test/development/acceptance-app/ReactRefreshLogBox.test.ts index d78957b0d31a382..3a372d42d427698 100644 --- a/test/development/acceptance-app/ReactRefreshLogBox.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBox.test.ts @@ -1062,4 +1062,27 @@ describe('ReactRefreshLogBox app', () => { await cleanup() }) + + test('Should not show __webpack_exports__ when exporting anonymous arrow function', async () => { + const { session, cleanup } = await sandbox(next) + + await session.patch( + 'index.js', + ` + export default () => { + if (typeof window !== 'undefined') { + throw new Error('test') + } + + return null + } + + ` + ) + + expect(await session.hasRedbox(true)).toBe(true) + expect(await session.getRedboxSource()).toMatchSnapshot() + + await cleanup() + }) }) diff --git a/test/development/acceptance-app/__snapshots__/ReactRefreshLogBox.test.ts.snap b/test/development/acceptance-app/__snapshots__/ReactRefreshLogBox.test.ts.snap index 031f532d4b6d6c2..34c22b0ebaea5f0 100644 --- a/test/development/acceptance-app/__snapshots__/ReactRefreshLogBox.test.ts.snap +++ b/test/development/acceptance-app/__snapshots__/ReactRefreshLogBox.test.ts.snap @@ -1,5 +1,17 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`ReactRefreshLogBox app Should not show __webpack_exports__ when exporting anonymous arrow function 1`] = ` +"index.js (4:16) @ exports.default + + 2 | export default () => { + 3 | if (typeof window !== 'undefined') { +> 4 | throw new Error('test') + | ^ + 5 | } + 6 | + 7 | return null" +`; + exports[`ReactRefreshLogBox app boundaries 1`] = ` "FunctionDefault.js (1:50) @ FunctionDefault