Allow AI setup for React Rsbuild projects#34888
Conversation
|
📝 WalkthroughWalkthroughCentralizes AI setup renderer/builder support checks into a new module with tests and integrates it into aiSetup; additionally, makes Vitest project-annotation gating builder-aware and guards adding a builder preset in core load on file existence. ChangesAI Setup Project Support Detection
Vitest plugin builder-aware gating
Core server builder preset guard
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
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. Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@code/core/src/core-server/load.ts`:
- Around line 78-81: The existsSync call is given a file:// URL-derived path,
causing false negatives; update the code that computes builderPresetDir/preset
path (where builderPresetDir and builderPreset are built) to detect file: URLs
(e.g., builderName starting with 'file:') and convert them to a filesystem path
using fileURLToPath from 'url' before joining to 'preset.js' and calling
existsSync; ensure you import fileURLToPath and apply it to builderPresetDir (or
the builderName source) so builderPreset becomes a valid local path for
existsSync to check.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 4e670b4e-ada0-44a2-932b-2f2a08b92b41
📒 Files selected for processing (2)
code/addons/vitest/src/vitest-plugin/index.tscode/core/src/core-server/load.ts
| const builderPreset = join(builderPresetDir, 'preset.js'); | ||
| if (existsSync(builderPreset)) { | ||
| corePresets.push(builderPreset); | ||
| } |
There was a problem hiding this comment.
🧩 Analysis chain
🌐 Web query:
Does Node.js fs.existsSync accept a file:///... string path directly, or should file URLs be passed as URL objects / converted with fileURLToPath?
💡 Result:
fs.existsSync does NOT accept a file:///... URL string directly as a path; pass a WHATWG URL object (e.g., new URL('file:///...')) or convert the file URL to a filesystem path with fileURLToPath(). Node’s fs API docs explicitly say the path parameter can be a WHATWG URL object using the file: protocol (not a URL string) for fs functions like fs.access() [1]. An issue discussion in the Node.js repo notes that fs APIs support URL inputs only when passed as URL objects, not plain URL strings [2]. The same issue also reflects the rationale that file systems may contain characters like : that would make treating file://... strings as paths ambiguous, implying Node keeps string inputs as plain paths [2]. Recommended pattern: 1) If you already have a file URL string: - Convert: existsSync(fileURLToPath(urlString)) 2) If you already have a URL object: - Use: existsSync(urlObject) Example: const { existsSync } = require('node:fs'); const { fileURLToPath } = require('node:url'); const fileUrlString = 'file:///C:/path/to/file.txt'; const ok = existsSync(fileURLToPath(fileUrlString)); If you pass 'file:///C:/path/to/file.txt' directly to existsSync as a string, it will be treated as a literal path string (not a URL), which won’t match real filesystem paths.
Citations:
- 1: https://nodejs.org/docs/latest-v24.x/api/fs.html
- 2: Support url *strings* in fs APIs nodejs/node#17658
Fix existsSync when builderName is a file:// URL
When builderName is a file://... URL string, the code ends up calling fs.existsSync() with a file://... string (not a filesystem path), which can false-negative and skip loading the builder preset. Convert file: URLs to paths with fileURLToPath() before building the preset.js path / calling existsSync.
Suggested fix
-import { existsSync } from 'node:fs';
+import { existsSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
@@
- const isResolved = builderName.startsWith('file:') || isAbsolute(builderName);
- const builderPresetDir = isResolved ? dirname(builderName) : resolvePackageDir(builderName);
+ const isFileUrl = builderName.startsWith('file:');
+ const isResolved = isFileUrl || isAbsolute(builderName);
+ const builderPresetDir = isResolved
+ ? isFileUrl
+ ? dirname(fileURLToPath(builderName))
+ : dirname(builderName)
+ : resolvePackageDir(builderName);
const builderPreset = join(builderPresetDir, 'preset.js');
if (existsSync(builderPreset)) {
corePresets.push(builderPreset);
}🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@code/core/src/core-server/load.ts` around lines 78 - 81, The existsSync call
is given a file:// URL-derived path, causing false negatives; update the code
that computes builderPresetDir/preset path (where builderPresetDir and
builderPreset are built) to detect file: URLs (e.g., builderName starting with
'file:') and convert them to a filesystem path using fileURLToPath from 'url'
before joining to 'preset.js' and calling existsSync; ensure you import
fileURLToPath and apply it to builderPresetDir (or the builderName source) so
builderPreset becomes a valid local path for existsSync to check.
|
is this something wanted upstream anyways? happy to close this otherwise |
|
Hi @agustiobvious, Thank you for your contribution!
|
Summary
storybook ai setupfor React projects usingstorybook-builder-rsbuildWhy
storybook ai setupcurrently exits for React + Rsbuild projects even though the generated setup prompt is not Vite-specific. The current guard only allows@storybook/builder-vite, so projects usingstorybook-react-rsbuildreceive the unsupported-project message and no setup instructions.Validation
git diff --checknpx --yes -p vitest@4.1.5 -p vite@7.0.4 vitest run --config /tmp/storybook-ai-vitest.config.mjsThe focused Vitest run used a minimal temp config because this shallow checkout did not have Yarn/Corepack dependencies installed.
Summary by CodeRabbit
New Features
Improvements