You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I just updated to the latest Angular (18.2.9) and Storybook (8.3.6) and was surprised to find that it doesn't support signals
I found a lot of discussions, but they all talk about input and output signals. I'm talking about a simple signal(...)
I found this and this.
And I even see that you supported model().
But I don't understand why regular singal(...) is not supported?
Storybook has always allowed you to work with component fields without requiring you to make them inputs.
this makes sense because public fields are what html uses. But inputs are a contract with the outside world.
let's say I have a component with a field.
this field can be updated asynchronously. Previously I had to use BehaviorSubject for this and I could override the value from Storybook.
now I want to use signal().
Storybook does not work with signal, but it works with model
@Component({selector: 'signal-ex',standalone: true,imports: [CommonModule],template: `Field: {{ field }} <br> Signal: {{ signalField() }} <br> Model: {{ modelField() }}`,styleUrls: [],})exportclassSignalExComponent{field=false;// <- we can't use fields with ChangeDetection.OnPushfield$=newBehaviorSubject<boolean>(false);fieldSignal=signal(false);fieldModel=model(false);toggle(){this.field=true;this.field$.next(true);this.fieldSignal.set(true);this.fieldModel.set(true);}}
Describe the bug
I just updated to the latest Angular (18.2.9) and Storybook (8.3.6) and was surprised to find that it doesn't support signals
I found a lot of discussions, but they all talk about input and output signals. I'm talking about a simple
signal(...)
I found this and this.
And I even see that you supported
model()
.But I don't understand why regular
singal(...)
is not supported?Storybook has always allowed you to work with component fields without requiring you to make them inputs.
this makes sense because public fields are what html uses. But inputs are a contract with the outside world.
Reproduction link
https://stackblitz.com/edit/github-mbwd5e-mebzvr?file=src%2Fapp%2Fsignal-ex%2Fsignal-ex.stories.ts
Reproduction steps
example: https://stackblitz.com/edit/github-mbwd5e-mebzvr?file=src%2Fapp%2Fsignal-ex%2Fsignal-ex.stories.ts
let's say I have a component with a field.
this field can be updated asynchronously. Previously I had to use
BehaviorSubject
for this and I could override the value from Storybook.now I want to use
signal()
.Storybook does not work with
signal
, but it works withmodel
story:
System
Storybook Environment Info:
System:
OS: Windows 11 10.0.22631
CPU: (20) x64 13th Gen Intel(R) Core(TM) i7-13700H
Binaries:
Node: 20.11.1 - C:\Program Files\nodejs\node.EXE
npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD <----- active
Browsers:
Edge: Chromium (129.0.2792.79)
npmPackages:
@storybook/addon-a11y: ^8.3.5 => 8.3.6
@storybook/addon-actions: ^8.3.5 => 8.3.6
@storybook/addon-essentials: ^8.3.5 => 8.3.6
@storybook/addon-interactions: ^8.3.5 => 8.3.6
@storybook/addon-links: ^8.3.5 => 8.3.6
@storybook/addons: ^7.6.17 => 7.6.17
@storybook/angular: ^8.3.5 => 8.3.6
@storybook/core-server: 8.3.5 => 8.3.5
@storybook/testing-library: 0.2.2 => 0.2.2
chromatic: ^11.12.5 => 11.16.1
msw-storybook-addon: 2.0.3 => 2.0.3
storybook: 8.3.6 => 8.3.6
storybook-addon-pseudo-states: ^4.0.2 => 4.0.2
Additional context
No response
The text was updated successfully, but these errors were encountered: