-
Notifications
You must be signed in to change notification settings - Fork 116
fix(react/runtime): do some global var initialize in hydrate #461
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
🦋 Changeset detectedLatest commit: 59640d0 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Codecov ReportAll modified and coverable lines are covered by tests ✅ ✅ All tests successful. No failed tests found. 📢 Thoughts on this report? Let us know! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR addresses a runtime issue by resetting global variables during the hydration process to prevent errors such as "cannot read property '-21' of undefined".
- Added a clearPage() function to reset global state in snapshot.ts.
- Introduced a call to resetJSReady() and setupPage() in the native call sequence.
- Updated tests and changeset documentation to reflect these changes.
Reviewed Changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.
File | Description |
---|---|
packages/react/runtime/src/snapshot.ts | Added clearPage() to reset __page and __pageId. |
packages/react/runtime/src/lynx/calledByNative.ts | Inserted resetJSReady() and setupPage() into hydration. |
packages/react/runtime/test/ssr.test.jsx | Updated tests to verify proper global variable handling. |
.changeset/icy-parrots-stare.md | Updated changeset notes describing the global var fix. |
Comments suppressed due to low confidence (2)
packages/react/runtime/src/snapshot.ts:42
- Using chained type assertions to reset __page might mask potential type issues. Consider using a more type-safe approach, such as assigning null if FiberElement supports it.
__page = undefined as unknown as FiberElement;
.changeset/icy-parrots-stare.md:5
- [nitpick] Consider revising the changeset message to 'Initialize global variables during hydration' for improved clarity and grammatical correctness.
Do some global var initialize in hydrate, which fixes error like `cannot read property '-21' of undefined` and some style issue.
CodSpeed Performance ReportMerging #461 will not alter performanceComparing Summary
|
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @lynx-js/rspeedy@0.9.0 ### Minor Changes - Bundle Rspeedy with Rslib for faster start-up times. ([#395](#395)) This would be a **BREAKING CHANGE** for using [global version of Rspeedy](https://lynxjs.org/rspeedy/cli#using-the-global-rspeedy-version). Please ensure that you update your globally installed version of Rspeedy: ```bash npm install --global @lynx-js/rspeedy@latest ``` - Bump Rsbuild v1.3.2 with Rspack v1.3.1 ([#446](#446)) - **BREAKING CHANGE**: Added explicit TypeScript peer dependency requirement of 5.1.6 - 5.8.x. ([#480](#480)) This formalizes the existing TypeScript version requirement in `peerDependencies` (marked as optional since it is only needed for TypeScript configurations). The actual required TypeScript version has not changed. Note: This may cause installation to fail if you have strict peer dependency checks enabled. Node.js v22.7+ users can bypass TypeScript installation using `--experimental-transform-types` or `--experimental-strip-types` flags. Node.js v23.6+ users don't need any flags. See [Node.js - TypeScript](https://nodejs.org/api/typescript.html) for details. ### Patch Changes - Support cli flag `--base` to specify the base path of the server. ([#387](#387)) - Support cli option `--environment` to specify the name of environment to build ([#462](#462)) - Select the most appropriate network interface. ([#457](#457)) This is a port of [webpack/webpack-dev-server#5411](webpack/webpack-dev-server#5411). - Support Node.js v23.6+ native TypeScript. ([#481](#481)) See [Node.js - TypeScript](https://nodejs.org/api/typescript.html) for more details. - Support cli option `--env-mode` to specify the env mode to load the `.env.[mode]` file. ([#453](#453)) - Support `dev.hmr` and `dev.liveReload`. ([#458](#458)) - Updated dependencies \[[`df63722`](df63722), [`df63722`](df63722)]: - @lynx-js/chunk-loading-webpack-plugin@0.2.0 ## @lynx-js/chunk-loading-webpack-plugin@0.2.0 ### Minor Changes - **BREAKING CHANGE**: Requires `@rspack/core` v1.3.0. ([#400](#400)) - **BREAKING CHANGE**: Remove the deprecated `ChunkLoadingRspackPlugin`, use `ChunkLoadingWebpackPlugin` with `output.chunkLoading: 'lynx'` instead. ([#400](#400)) ```js import { ChunkLoadingWebpackPlugin } from "@lynx-js/chunk-loading-webpack-plugin"; export default { output: { chunkLoading: "lynx", }, plugins: [new ChunkLoadingWebpackPlugin()], }; ``` ## @lynx-js/react@0.106.3 ### Patch Changes - Do some global var initialize in hydrate, which fixes error like `cannot read property '-21' of undefined` and some style issue. ([#461](#461)) - fix: ensure ref lifecycle events run after firstScreen in the background thread ([#434](#434)) This patch fixes an issue where ref lifecycle events were running before firstScreen events in the background thread async render mode, which could cause refs to be undefined when components try to access them. ## @lynx-js/qrcode-rsbuild-plugin@0.3.5 ### Patch Changes - Build with Rslib ([#396](#396)) ## @lynx-js/react-rsbuild-plugin@0.9.5 ### Patch Changes - fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix pseudo-class (such as `:active`) not working in HMR. ([#435](#435)) - Disable `module.generator.json.JSONParse` option as it increases the bundle size of `main-thread.js`. For more detail, please see this [issue](webpack/webpack#19319). ([#402](#402)) - Updated dependencies \[[`3e7988f`](3e7988f), [`7243242`](7243242)]: - @lynx-js/css-extract-webpack-plugin@0.5.3 - @lynx-js/template-webpack-plugin@0.6.8 - @lynx-js/react-alias-rsbuild-plugin@0.9.5 - @lynx-js/react-refresh-webpack-plugin@0.3.2 - @lynx-js/react-webpack-plugin@0.6.10 - @lynx-js/web-webpack-plugin@0.6.3 ## @lynx-js/web-constants@0.10.1 ### Patch Changes - feat: onNapiModulesCall function add new param: `dispatchNapiModules`, napiModulesMap val add new param: `handleDispatch`. ([#414](#414)) Now you can use them to actively communicate to napiModules (background thread) in onNapiModulesCall (ui thread). - Updated dependencies \[]: - @lynx-js/web-worker-rpc@0.10.1 ## @lynx-js/web-core@0.10.1 ### Patch Changes - docs: fix documents about lynx-view's properties ([#412](#412)) Attributes should be hyphen-name: 'init-data', 'global-props'. now all properties has corresponding attributes. - feat: onNapiModulesCall function add new param: `dispatchNapiModules`, napiModulesMap val add new param: `handleDispatch`. ([#414](#414)) Now you can use them to actively communicate to napiModules (background thread) in onNapiModulesCall (ui thread). - Updated dependencies \[[`1af3b60`](1af3b60)]: - @lynx-js/web-constants@0.10.1 - @lynx-js/web-worker-runtime@0.10.1 - @lynx-js/web-worker-rpc@0.10.1 ## @lynx-js/web-elements@0.5.3 ### Patch Changes - feat: add `layoutchange` event support for x-view and x-text ([#408](#408)) ## @lynx-js/web-mainthread-apis@0.10.1 ### Patch Changes - Updated dependencies \[[`1af3b60`](1af3b60)]: - @lynx-js/web-constants@0.10.1 ## @lynx-js/web-worker-runtime@0.10.1 ### Patch Changes - feat: onNapiModulesCall function add new param: `dispatchNapiModules`, napiModulesMap val add new param: `handleDispatch`. ([#414](#414)) Now you can use them to actively communicate to napiModules (background thread) in onNapiModulesCall (ui thread). - Updated dependencies \[[`1af3b60`](1af3b60)]: - @lynx-js/web-constants@0.10.1 - @lynx-js/web-mainthread-apis@0.10.1 - @lynx-js/web-worker-rpc@0.10.1 ## @lynx-js/css-extract-webpack-plugin@0.5.3 ### Patch Changes - Fix CSS HMR not working with nested entry name. ([#456](#456)) - fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix pseudo-class (such as `:active`) not working in HMR. ([#435](#435)) ## @lynx-js/template-webpack-plugin@0.6.8 ### Patch Changes - fix: add enableCSSInvalidation for encodeCSS of css HMR, this will fix pseudo-class (such as `:active`) not working in HMR. ([#435](#435)) ## create-rspeedy@0.9.0 ## @lynx-js/react-alias-rsbuild-plugin@0.9.5 ## upgrade-rspeedy@0.9.0 ## @lynx-js/web-worker-rpc@0.10.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Summary
Checklist