Ninosaurier/LUNA-Charts
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Storybook does not detect Stencil changes without restart' #42

New Issue
Closed
opened 2026-09-24 16:15:00 +00:00 by Ninosaurier · 3 comments
Ninosaurier commented 2026-09-24 16:15:00 +00:00
Owner
Copy Link
Copy Source

Description

Storybook fails to detect changes made to Stencil components in real-time. Hot Module Replacement (HMR) or watch-mode compilation is breaking, forcing developers to manually stop and restart the Storybook server every time a stencil component is updated to see the changes.

Steps to Reproduce

  1. Run the Stencil compiler in watch mode: pnpm run build --watch
  2. In a separate terminal, start Storybook: pnpm run storybook.
  3. Open Storybook in the browser and verify the component renders correctly.
  4. Make a visible change (e.g., change a text string or CSS style) in the Stencil component source file (.tsx or .css).
  5. Observe that Stencil recompiles, but Storybook does not update the browser or reflect the change.
  6. Stop the Storybook process and run pnpm run storybook again. The change is now visible.

Expected Behavior

Storybook should automatically detect the recompiled Stencil outputs and update the component via HMR (or trigger a browser refresh) without requiring a manual server restart.

Actual Behavior

Storybook completely misses the updates. It stays stuck on the initial build state until the process is killed and restarted.

## Description **Storybook fails to detect changes made to Stencil components** in real-time. Hot Module Replacement (HMR) or watch-mode compilation is breaking, forcing developers to **manually stop and restart the Storybook server** every time a stencil component is updated to see the changes. ## Steps to Reproduce 1. Run the Stencil compiler in watch mode: `pnpm run build --watch` 2. In a separate terminal, start Storybook: `pnpm run storybook`. 3. Open Storybook in the browser and verify the component renders correctly. 4. Make a visible change (e.g., change a text string or CSS style) in the Stencil component source file (`.tsx` or `.css`). 5. Observe that Stencil recompiles, but Storybook does not update the browser or reflect the change. 6. Stop the Storybook process and run `pnpm run storybook` again. The change is now visible. ### Expected Behavior Storybook should automatically detect the recompiled Stencil outputs and update the component via HMR (or trigger a browser refresh) without requiring a manual server restart. ### Actual Behavior Storybook completely misses the updates. It stays stuck on the initial build state until the process is killed and restarted.
Ninosaurier added the Kind/BugPriority/HighStatus/Verified labels 2026-09-24 16:15:00 +00:00
Ninosaurier self-assigned this 2026-09-24 16:15:00 +00:00
Ninosaurier added reference fix/#42-add-hot-reload-in-storybook-for-stencil 2026-10-05 15:54:27 +00:00
Ninosaurier commented 2026-10-05 15:57:24 +00:00
Author
Owner
Copy Link
Copy Source

Hot reload works. Also expanded the readme.md and the package.json:

  • readme.md: Starting the stencil development server ist in the readme.md is written
  • package.json: The stencil development server can be started from the root directory.
Hot reload works. Also expanded the **readme.md** and the **package.json**: - **readme.md**: Starting the stencil development server ist in the readme.md is written - **package.json**: The stencil development server can be started from the root directory.
Ninosaurier added the Status/Awaiting Release label 2026-10-05 17:30:18 +00:00
Ninosaurier commented 2026-10-05 17:30:18 +00:00
Author
Owner
Copy Link
Copy Source

Problem is solved. Solution is implemented and merged into Dev branch. Issue will be closed, when milestone v0.3.0 is reached.

Problem is solved. Solution is implemented and merged into **Dev** branch. Issue will be closed, when milestone v0.3.0 is reached.
Ninosaurier commented 2026-10-07 09:57:11 +00:00
Author
Owner
Copy Link
Copy Source

Update: I've decided to revise the previous plan and merge this fix directly into main immediately.
There are two main reasons for this:

• Developer Experience (DX): Since this bug actively breaks the Storybook workflow, leaving it unresolved on main slows down daily development unnecessarily. Merging it now unblocks everyone immediately.

• Branch Management: Merging the solution straight away prevents potential merge conflicts down the road as other features move forward toward the v0.3.0 milestone.

Update: I've decided to revise the previous plan and merge this fix directly into main immediately. There are two main reasons for this: • Developer Experience (DX): Since this bug actively breaks the Storybook workflow, leaving it unresolved on main slows down daily development unnecessarily. Merging it now unblocks everyone immediately. • Branch Management: Merging the solution straight away prevents potential merge conflicts down the road as other features move forward toward the v0.3.0 milestone.
Ninosaurier removed the Status/Awaiting Release label 2026-10-07 09:57:20 +00:00
Sign in to join this conversation.
fix/#42-add-hot-reload-in-storybook-for-stencil
Branches Tags
Labels
Clear labels
Community/Good First Issue
Suitable for newcomers making their first contribution.
 Community/Question
General questions or discussions without implementation work.
 Kind/Bug
Something is not working correctly.
 Kind/Documentation
Documentation changes or improvements.
 Kind/Enhancement
Improves existing functionality.
 Kind/Feature
Introduces new functionality.
 Kind/Refactoring
Improves internal implementation without changing external behavior.
 Kind/Testing
Related to tests or testing infrastructure.
 Priority/High
High priority.
 Priority/Low
Low priority.
 Priority/Medium
Normal priority.
 Status/Awaiting Release
Fix has been merged into the development branch but not yet released to production/main. Will be closed once included in a release.
 Status/Blocked
Progress is blocked by another dependency or issue.
 Status/Needs Information
More details or steps to reproduce are required from the author before proceeding.
 Status/Needs Review
Waiting for maintainer or reviewer feedback.
 Status/Verified
The issue has been verified and confirmed.
No labels Kind/Bug Priority/High Status/Verified
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
sven Ninosaurier (Antonino Provenzano)
No Assignees Ninosaurier
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Ninosaurier/LUNA-Charts#42