test: change button border radius for chromatic test#2
test: change button border radius for chromatic test#2serafim-san wants to merge 4 commits intonextfrom
Conversation
|
Note
|
| Cohort / File(s) | Summary |
|---|---|
Button Component Styling src/lib/ui/core/Button/Button.svelte |
Updated Tailwind-T Variants base border-radius from rounded-md to rounded-xl. |
Storybook Vite Config .storybook/main.ts |
Removed injection of WebkitSvg() from the viteFinal hook (plugin no longer added to merged Vite config). |
CI Workflow .github/workflows/ci.yml |
Removed the ci job; modified chromatic job to add pnpm exec svelte-kit sync and a pnpm exec tsx inline step that imports ./plugins/vite.ts, creates WebkitSvg, and runs buildStart() to generate SVG sprite assets before Chromatic. |
Estimated code review effort
🎯 3 (Moderate) | ⏱️ ~20 minutes
🚥 Pre-merge checks | ✅ 2 | ❌ 1
❌ Failed checks (1 warning)
| Check name | Status | Explanation | Resolution |
|---|---|---|---|
| Description check | The description is severely incomplete, providing only 'Test' instead of following the required template with Summary and optional Screenshots sections. | Expand the description to include the Notion ticket link, a detailed summary of changes (button border radius update and CI modifications), and any relevant screenshots or videos. |
✅ Passed checks (2 passed)
| Check name | Status | Explanation |
|---|---|---|
| Title check | ✅ Passed | The title refers to a button border radius change for Chromatic testing, which aligns with the main changes (Button component style update and CI workflow adjustments for Chromatic). |
| Docstring Coverage | ✅ Passed | No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. |
✏️ Tip: You can configure your own custom pre-merge checks in the settings.
✨ Finishing Touches
🧪 Generate unit tests (beta)
- Create PR with unit tests
- Commit unit tests in branch
test/chromatic
Comment @coderabbitai help to get the list of available commands and usage tips.
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.storybook/main.ts:
- Line 25: Update the dynamic import in .storybook/main.ts so it points to the
actual TypeScript file: replace the import of '../plugins/vite.js' with the
correct module path to the TypeScript file (plugins/vite.ts) where WebkitSvg is
exported, i.e., update the import that assigns { WebkitSvg } to reference
'../plugins/vite.ts' so the module resolution finds the existing export.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 589a4256-28c5-4bfb-84f3-9e109cf0aba0
📒 Files selected for processing (1)
.storybook/main.ts
.storybook/main.ts
Outdated
| }, | ||
|
|
||
| async viteFinal(config) { | ||
| const { WebkitSvg } = await import('../plugins/vite.js') |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Verify Storybook dynamic import target and actual plugin files (read-only)
set -euo pipefail
echo "== Import line in .storybook/main.ts =="
rg -n "await import\\(" .storybook/main.ts
echo
echo "== Candidate plugin files under plugins/ =="
fd -a "vite\\.(ts|js)$" plugins
echo
echo "== Existence check for expected paths =="
python - <<'PY'
import os
paths = [
"plugins/vite.ts",
"plugins/vite.js",
".storybook/plugins/vite.ts",
".storybook/plugins/vite.js",
]
for p in paths:
print(f"{p}: {'exists' if os.path.exists(p) else 'missing'}")
PYRepository: serafim-san/kit
Length of output: 405
Fix the import path to match the actual file extension.
Line 25 imports ../plugins/vite.js, but the file is plugins/vite.ts. This breaks the Storybook build (CI error: ERR_MODULE_NOT_FOUND).
Fix
- const { WebkitSvg } = await import('../plugins/vite.js')
+ const { WebkitSvg } = await import('../plugins/vite.ts')📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const { WebkitSvg } = await import('../plugins/vite.js') | |
| const { WebkitSvg } = await import('../plugins/vite.ts') |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In @.storybook/main.ts at line 25, Update the dynamic import in
.storybook/main.ts so it points to the actual TypeScript file: replace the
import of '../plugins/vite.js' with the correct module path to the TypeScript
file (plugins/vite.ts) where WebkitSvg is exported, i.e., update the import that
assigns { WebkitSvg } to reference '../plugins/vite.ts' so the module resolution
finds the existing export.
Summary
Test
Summary by CodeRabbit
Style
Chores