diff --git a/.changeset/silly-tigers-think.md b/.changeset/silly-tigers-think.md new file mode 100644 index 0000000000..2f8f21888b --- /dev/null +++ b/.changeset/silly-tigers-think.md @@ -0,0 +1,5 @@ +--- +"@lynx-js/react-webpack-plugin": patch +--- + +Fix issue where loading a lazy bundle fails if it does not return a webpack chunk. diff --git a/packages/webpack/react-webpack-plugin/src/LynxProcessEvalResultRuntimeModule.ts b/packages/webpack/react-webpack-plugin/src/LynxProcessEvalResultRuntimeModule.ts index 733a0b3c49..242575949e 100644 --- a/packages/webpack/react-webpack-plugin/src/LynxProcessEvalResultRuntimeModule.ts +++ b/packages/webpack/react-webpack-plugin/src/LynxProcessEvalResultRuntimeModule.ts @@ -27,8 +27,8 @@ export function createLynxProcessEvalResultRuntimeModule( return ` ${LynxRuntimeGlobals.lynxProcessEvalResult} = function (result, schema) { - var chunk = result(schema); - if (chunk.ids && chunk.modules) { + var chunk = result && result(schema); + if (chunk && chunk.ids && chunk.modules) { // We only deal with webpack chunk ${webpack.RuntimeGlobals.externalInstallChunk}(chunk); // TODO: sort with preOrderIndex. See: https://github.com/web-infra-dev/rspack/pull/8588 @@ -37,6 +37,7 @@ ${LynxRuntimeGlobals.lynxProcessEvalResult} = function (result, schema) { } return chunk; } + return chunk } `; } diff --git a/packages/webpack/react-webpack-plugin/test/cases/code-splitting/eval-result/index.jsx b/packages/webpack/react-webpack-plugin/test/cases/code-splitting/eval-result/index.jsx index c7fc18fecb..7eff5493f9 100644 --- a/packages/webpack/react-webpack-plugin/test/cases/code-splitting/eval-result/index.jsx +++ b/packages/webpack/react-webpack-plugin/test/cases/code-splitting/eval-result/index.jsx @@ -21,6 +21,63 @@ it('should have processEvalResult', async () => { } }); +it('should allow result to be null', () => { + if (!__LEPUS__) { + return; + } + + const ret = globalThis.processEvalResult(null, 'foo'); + expect(ret).toBeNull(); +}); + +it('should allow result to be undefined', () => { + if (!__LEPUS__) { + return; + } + + const ret = globalThis.processEvalResult(undefined, 'foo'); + expect(ret).toBeUndefined(); +}); + +it('should allow result to return non-webpack chunk', () => { + if (!__LEPUS__) { + return; + } + + const result = {}; + const fn = vi.fn(); + fn.mockReturnValue(result); + + const ret = globalThis.processEvalResult(fn, 'foo'); + expect(fn).toHaveBeenCalledWith('foo'); + expect(ret).toBe(result); +}); + +it('should allow result to return webpack chunk', () => { + if (!__LEPUS__) { + return; + } + + const result = { + ids: ['foo'], + modules: { + foo: vi.fn(), + }, + }; + const fn = vi.fn(); + fn.mockReturnValue(result); + + __webpack_require__.C = (chunk) => { + __webpack_modules__['foo'] = chunk.modules.foo; + expect(chunk).toBe(result); + }; + + const ret = globalThis.processEvalResult(fn, 'foo'); + expect(fn).toHaveBeenCalledWith('foo'); + expect(ret).toBe(result); + expect(result.modules.foo).toHaveBeenCalled(); +}); + it('should have async chunks', () => { const LAYER = __LEPUS__ ? 'react:main-thread' : 'react:background';