feat: support web preview in rspeedy dev by PupilTong · Pull Request #1893 · lynx-family/lynx-stack

PupilTong · 2025-10-17T07:31:37Z

#1806

Summary by CodeRabbit

New Features
- Added experimental web preview functionality to rspeedy dev environment, enabling developers to preview web-based content during development with enhanced middleware support.
Tests
- Added test coverage for web preview middleware initialization to ensure proper functionality when the web environment is configured.

Checklist

Tests updated (or not required).
Documentation updated (or not required).
Changeset added, and when a BREAKING CHANGE occurs, it needs to be clearly marked (or not required).

changeset-bot · 2025-10-17T07:31:41Z

🦋 Changeset detected

Latest commit: 61aa18d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@lynx-js/rspeedy	Patch
create-rspeedy	Patch
upgrade-rspeedy	Patch

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

coderabbitai · 2025-10-17T07:33:48Z

📝 Walkthrough

Walkthrough

This pull request adds web preview support to rspeedy dev by introducing a new middleware dependency, registering a web preview middleware during dev server initialization, and adding corresponding test coverage. The changes include a changeset entry, dependency configuration, conditional middleware registration, and test validation.

Changes

Cohort / File(s)	Summary
Changeset entry `.changeset/twenty-places-pump.md`	Records a patch-level version bump for @lynx-js/rspeedy with experimental web preview feature description.
Configuration updates `packages/rspeedy/core/package.json`, `packages/rspeedy/core/tsconfig.json`	Adds @lynx-js/web-rsbuild-server-middleware dependency and corresponding tsconfig reference.
Dev plugin implementation `packages/rspeedy/core/src/plugins/dev.plugin.ts`	Implements onBeforeStartDevServer hook that conditionally registers createWebVirtualFilesMiddleware at /__web_preview endpoint when web environment is present.
Test coverage `packages/rspeedy/core/test/plugins/dev.plugin.test.ts`	Adds test case verifying web middleware installation for environment.web configuration.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

The changes span multiple file types (changeset, config, implementation, test) with straightforward conditional middleware registration logic. Review requires verifying dependency integration, middleware correctness, and test adequacy across the cohesive feature addition.

Possibly related PRs

chore: add @lynx-js/web-rsbuild-server-middleware #1807: Main PR that integrates and calls the createWebVirtualFilesMiddleware function being added in this changeset.
fix: handle lynx.getJSModule error on web platform #1830: Related modifications to packages/rspeedy/core/src/plugins/dev.plugin.ts affecting dev-server behavior and plugin registration patterns.

Suggested reviewers

colinaaa
gaoachao

Poem

🐰✨ A dev server blooms, with web preview so bright,
Middleware dances at /__web_preview's light,
Lynx leaps forward with rspeedy's new flight,
Conditional hooks make the dev path just right! 🌐⚡

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run `@coderabbitai generate docstrings` to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The pull request title "feat: support web preview in rspeedy dev" directly and accurately reflects the main change across all modified files. The changeset confirms this is a patch-level update introducing web preview support in rspeedy dev, and all code changes align with this objective: adding a new dependency, implementing the onBeforeStartDevServer hook to register web preview middleware, adding corresponding test coverage, and updating TypeScript configuration. The title is clear, specific, concise, and uses conventional commit formatting without vague or misleading language.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

codecov · 2025-10-17T07:36:57Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

coderabbitai

Actionable comments posted: 1

🧹 Nitpick comments (1)

packages/rspeedy/core/test/plugins/dev.plugin.test.ts (1)
654-670: Consider verifying the middleware path parameter.

The test successfully verifies that the middleware is installed, but doesn't check that it was called with the correct path '/__web_preview'.

Optionally strengthen the assertion:
 await using server = await rsbuild.usingDevServer()
 await server.waitDevCompileDone()
-expect(vi.mocked(middleware.createWebVirtualFilesMiddleware)).toBeCalled()
+expect(vi.mocked(middleware.createWebVirtualFilesMiddleware))
+  .toHaveBeenCalledWith('/__web_preview')

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7570a5e and 61aa18d.

⛔ Files ignored due to path filters (1)

pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (5)

.changeset/twenty-places-pump.md (1 hunks)
packages/rspeedy/core/package.json (1 hunks)
packages/rspeedy/core/src/plugins/dev.plugin.ts (1 hunks)
packages/rspeedy/core/test/plugins/dev.plugin.test.ts (1 hunks)
packages/rspeedy/core/tsconfig.json (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

.changeset/*.md

📄 CodeRabbit inference engine (AGENTS.md)

For contributions, generate and commit a Changeset describing your changes

Files:

.changeset/twenty-places-pump.md

🧬 Code graph analysis (2)

packages/rspeedy/core/test/plugins/dev.plugin.test.ts (1)

packages/rspeedy/core/test/createStubRspeedy.ts (1)

createStubRspeedy (20-64)

packages/rspeedy/core/src/plugins/dev.plugin.ts (1)

packages/web-platform/web-rsbuild-server-middleware/src/node/index.ts (1)

createWebVirtualFilesMiddleware (22-89)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

GitHub Check: build / Build (Ubuntu)
GitHub Check: build / Build (Windows)
GitHub Check: test-rust / Test (Ubuntu)

🔇 Additional comments (3)

packages/rspeedy/core/package.json (1)

59-59: LGTM! Dependency addition aligns with the new web preview feature.

The workspace protocol is appropriate for internal monorepo dependencies.

packages/rspeedy/core/tsconfig.json (1)

24-24: LGTM! TypeScript project reference correctly configured.

This reference aligns with the newly added dependency.

.changeset/twenty-places-pump.md (1)

1-7: LGTM! Changeset correctly documents the new feature.

The patch-level bump is appropriate, and marking the feature as experimental sets clear expectations.

relativeci · 2025-10-17T07:45:54Z

React Example

#5936 Bundle Size — 237.5KiB (0%).

61aa18d(current) vs 7570a5e main#5928(baseline)

Bundle metrics no changes

	Current #5936	Baseline #5928
Initial JS	`0B`	`0B`
Initial CSS	`0B`	`0B`
Cache Invalidation	`0%`	`0%`
Chunks	`0`	`0`
Assets	`4`	`4`
Modules	`165`	`165`
Duplicate Modules	`67`	`67`
Duplicate Code	`46.77%`	`46.77%`
Packages	`2`	`2`
Duplicate Packages	`0`	`0`

Bundle size by type no changes

	Current #5936	Baseline #5928
IMG	`145.76KiB`	`145.76KiB`
Other	`91.74KiB`	`91.74KiB`

Bundle analysis report Branch PupilTong:p/hw/rspeedy-use-middl... Project dashboard

^{Generated by RelativeCI Documentation Report issue}

relativeci · 2025-10-17T07:45:57Z

Web Explorer

#5932 Bundle Size — 364.68KiB (0%).

61aa18d(current) vs 7570a5e main#5924(baseline)

Bundle metrics

1 change

	Current #5932	Baseline #5924
Initial JS	`144.63KiB`	`144.63KiB`
Initial CSS	`32.11KiB`	`32.11KiB`
Cache Invalidation	`0%`	`0%`
Chunks	`8`	`8`
Assets	`8`	`8`
Modules	`218`(`-0.46%`)	`219`
Duplicate Modules	`16`	`16`
Duplicate Code	`3.23%`	`3.23%`
Packages	`4`	`4`
Duplicate Packages	`0`	`0`

Bundle size by type no changes

	Current #5932	Baseline #5924
JS	`238.77KiB`	`238.77KiB`
Other	`93.8KiB`	`93.8KiB`
CSS	`32.11KiB`	`32.11KiB`

Bundle analysis report Branch PupilTong:p/hw/rspeedy-use-middl... Project dashboard

^{Generated by RelativeCI Documentation Report issue}

codspeed-hq · 2025-10-17T07:48:15Z

CodSpeed Performance Report

Merging #1893 will degrade performances by 9.68%

_{Comparing PupilTong:p/hw/rspeedy-use-middleware-no-print (61aa18d) with main (7570a5e)}

Summary

⚡ 2 improvements
❌ 2 regressions
✅ 49 untouched
⏩ 3 skipped¹

⚠️ Please fix the performance issues or acknowledge them on CodSpeed.

Benchmarks breakdown

	Benchmark	`BASE`	`HEAD`	Change
❌	`basic-performance-div-100`	5.9 ms	6.5 ms	-9.68%
❌	`basic-performance-div-10000`	382.7 ms	404.9 ms	-5.49%
⚡	`basic-performance-scroll-view-100`	9.7 ms	8.9 ms	+9.01%
⚡	`basic-performance-small-css`	7.8 ms	7 ms	+11.82%

3 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports. ↩

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/react@0.114.3 ### Patch Changes - Initialize `ctxNotFoundEventListener` before each test in testing library ([#1888](#1888)) - fix: main thread functions created during the initial render cannot correctly modify `MainThreadRef`s after hydration ([#1884](#1884)) ## @lynx-js/rspeedy@0.11.7 ### Patch Changes - Bump Rsbuild v1.5.17. ([#1889](#1889)) - feat: support web preview in rspeedy dev ([#1893](#1893)) - support web preview in rspeedy dev (experimental) - Updated dependencies \[]: - @lynx-js/web-rsbuild-server-middleware@0.18.1 ## @lynx-js/web-constants@0.18.1 ### Patch Changes - Updated dependencies \[]: - @lynx-js/web-worker-rpc@0.18.1 ## @lynx-js/web-core@0.18.1 ### Patch Changes - fix: mts freeze after reload() ([#1892](#1892)) The mts may be freezed after reload() called. We fixed it by waiting until the all-on-ui Javascript realm implementation, an iframe, to be fully loaded. - Updated dependencies \[[`70a18fc`](70a18fc)]: - @lynx-js/web-mainthread-apis@0.18.1 - @lynx-js/web-worker-runtime@0.18.1 - @lynx-js/web-constants@0.18.1 - @lynx-js/web-worker-rpc@0.18.1 ## @lynx-js/web-elements@0.8.9 ### Patch Changes - fix: layoutchange event result `detail.top` and `detail.left` was `0` incorrectly ([#1887](#1887)) - textarea placeholder inherits font-size by default ([#1874](#1874)) - feat: support <x-text text="content"></x-text> ([#1881](#1881)) - Updated dependencies \[]: - @lynx-js/web-elements-template@0.8.9 ## @lynx-js/web-mainthread-apis@0.18.1 ### Patch Changes - fix: mts freeze after reload() ([#1892](#1892)) The mts may be freezed after reload() called. We fixed it by waiting until the all-on-ui Javascript realm implementation, an iframe, to be fully loaded. - Updated dependencies \[]: - @lynx-js/web-constants@0.18.1 - @lynx-js/web-style-transformer@0.18.1 ## @lynx-js/web-worker-runtime@0.18.1 ### Patch Changes - Updated dependencies \[[`70a18fc`](70a18fc)]: - @lynx-js/web-mainthread-apis@0.18.1 - @lynx-js/web-constants@0.18.1 - @lynx-js/web-worker-rpc@0.18.1 ## create-rspeedy@0.11.7 ## upgrade-rspeedy@0.11.7 ## @lynx-js/web-core-server@0.18.1 ## @lynx-js/web-elements-template@0.8.9 ## @lynx-js/web-rsbuild-server-middleware@0.18.1 ## @lynx-js/web-style-transformer@0.18.1 ## @lynx-js/web-worker-rpc@0.18.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

PupilTong added 4 commits October 15, 2025 17:24

feat: support web preview in rspeedy dev

da9aea1

ai

3c4c46b

lazy + update tests

e31d18c

remove printUrl logics

61aa18d

PupilTong self-assigned this Oct 17, 2025

PupilTong added this to Lynx for Web Oct 17, 2025

PupilTong requested a review from colinaaa as a code owner October 17, 2025 07:31

PupilTong added the platform:Web label Oct 17, 2025

coderabbitai bot reviewed Oct 17, 2025

View reviewed changes

Comment thread packages/rspeedy/core/src/plugins/dev.plugin.ts

colinaaa approved these changes Oct 17, 2025

View reviewed changes

PupilTong merged commit fc42e83 into lynx-family:main Oct 17, 2025
51 of 52 checks passed

github-project-automation bot moved this to Done in Lynx for Web Oct 17, 2025

github-actions bot mentioned this pull request Oct 16, 2025

chore: Release 2025-10-23 07:14:56 #1883

Merged

coderabbitai bot mentioned this pull request Oct 21, 2025

fix(tsconfig): add missing reference to web-rsbuild-server-middleware #1894

Merged

3 tasks

coderabbitai bot mentioned this pull request Oct 27, 2025

feat: support web preview in rspeedy dev #1891

Merged

3 tasks

coderabbitai bot mentioned this pull request Dec 3, 2025

feat(rspeedy): support lynx environment variant lynx- and web- #1969

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: support web preview in rspeedy dev#1893

feat: support web preview in rspeedy dev#1893
PupilTong merged 4 commits intolynx-family:mainfrom
PupilTong:p/hw/rspeedy-use-middleware-no-print

PupilTong commented Oct 17, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

changeset-bot bot commented Oct 17, 2025

Uh oh!

coderabbitai bot commented Oct 17, 2025 •

edited

Loading

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

codecov bot commented Oct 17, 2025 •

edited

Loading

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

relativeci bot commented Oct 17, 2025

Uh oh!

relativeci bot commented Oct 17, 2025

Uh oh!

codspeed-hq bot commented Oct 17, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

PupilTong commented Oct 17, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Checklist

Uh oh!

changeset-bot bot commented Oct 17, 2025

🦋 Changeset detected

Uh oh!

coderabbitai bot commented Oct 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Pre-merge checks and finishing touches

Uh oh!

codecov bot commented Oct 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

relativeci bot commented Oct 17, 2025

React Example

#5936 Bundle Size — 237.5KiB (0%).

Uh oh!

relativeci bot commented Oct 17, 2025

Web Explorer

#5932 Bundle Size — 364.68KiB (0%).

Uh oh!

codspeed-hq bot commented Oct 17, 2025

CodSpeed Performance Report

Merging #1893 will degrade performances by 9.68%

Summary

Benchmarks breakdown

Footnotes

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

PupilTong commented Oct 17, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Oct 17, 2025 •

edited

Loading

codecov bot commented Oct 17, 2025 •

edited

Loading