Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

@storybook/angular@5.1 moduleMetadata is not rerendering scene #7002

Closed
alexan opened this issue Jun 7, 2019 · 11 comments
Closed

@storybook/angular@5.1 moduleMetadata is not rerendering scene #7002

alexan opened this issue Jun 7, 2019 · 11 comments

Comments

@alexan
Copy link
Contributor

alexan commented Jun 7, 2019

Describe the bug
I'm using moduleMetadata to mock some services in angular stories via knobs. After updating to storybook 5.1, storybook does update the value from the knob via the service

To Reproduce
I prepared a repo containing a story wich works with storybook 5.0.11 but doesn't with 5.1.3
https://github.com/alexan/storybook-module-metadata
https://github.com/alexan/storybook-module-metadata/tree/storybook-5.0

  • checkout repository
  • run npm ci
  • run npm run storybook
  • uncheck isActive knob
  • observe isActive is not changing in mocked service
  • checkout storybook-5.0 branch
  • run npm ci
  • run npm run storybook
  • uncheck isActive knob
  • isActive is changing in booth service and prop

Expected behavior
storybook 5.1 should behave a 5.0.x

Screenshots
Storybok 5.1.x:
Bildschirmfoto 2019-06-07 um 11 06 40

Storybook 5.0.x:
Bildschirmfoto 2019-06-07 um 11 04 55

Code snippets
here is the story used in the repository

@Injectable({
  providedIn: 'root'
})
export class AppService {
  isActive() {
    return false;
  }
}


@Component({
  selector: 'app-root',
  template: `
    Service active: {{ appService.isActive() }}
  `,
})
export class AppComponent {
  constructor(public appService: AppService) {}
}


storiesOf('app', module)
  .addDecorator(withKnobs)
  .addDecorator(
    moduleMetadata({
      declarations: [
        AppComponent
      ]
    })
  )
  .add('showcase', () => {
    const isActive = boolean('isActive', true);

    return {
      template: `
        <app-root></app-root><br>
        Prop active: {{ isActive }}
      `,
      props: {
        isActive
      },
      moduleMetadata: {
        providers: [
          {
            provide: AppService,
            useValue: {
              isActive() {
                return isActive;
              }
            }
          }
        ]
      }
    };
  });

System:

  • Framework: angular
  • Addons: knobs
  • Version: 5.1.3
@alexan alexan changed the title angular 5.1 moduleMetadata is not rerendering scene @storybook/angular@5.1 moduleMetadata is not rerendering scene Jun 7, 2019
@alexan
Copy link
Contributor Author

alexan commented Jun 11, 2019

can I implement the story in a different way? Is this unintended behaviour?

@alexan
Copy link
Contributor Author

alexan commented Jun 13, 2019

this is still present in 5.1.4

@stale stale bot added the inactive label Jul 4, 2019
@alexan
Copy link
Contributor Author

alexan commented Jul 4, 2019

can anybody provide feedback for this one?

@stale stale bot removed the inactive label Jul 4, 2019
@stale stale bot added the inactive label Jul 25, 2019
@storybookjs storybookjs deleted a comment from stale bot Jul 25, 2019
@stale stale bot removed the inactive label Jul 25, 2019
@storybookjs storybookjs deleted a comment from stale bot Jul 25, 2019
@stale
Copy link

stale bot commented Aug 15, 2019

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

@stale stale bot added the inactive label Aug 15, 2019
@alexan
Copy link
Contributor Author

alexan commented Aug 15, 2019

where can I start to look for a change wich introduced this behavior. I'm not understanding the codebase enough to fix this myself

@stale stale bot removed the inactive label Aug 15, 2019
@shilman
Copy link
Member

shilman commented Aug 16, 2019

@alexan You can look in the CHANGELOG to see every Agnular-related change that's been merged https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md

@alexan
Copy link
Contributor Author

alexan commented Aug 22, 2019

ok I checked the versions and #6094 introduced this behavior. I will investigate further. My code relies on angular re rendering the scene. I will investigate further.

@alexan
Copy link
Contributor Author

alexan commented Aug 22, 2019

@jonrimmer do you think it would be possible to add a parameter to a knob which tells storybook to rerender the sceene on change or not?

switching this parameter did not change anything

{
    knobs: {
      disableDebounce: false/true
    }
  }

I also experimented with forceReRender() but did not figure out anything useful

@andrei-ilyukovich
Copy link

@alexan you are not alone) I'm also experiencing the exactly same issue. And can confirm that calling forceReRender() doesn't have any impact of the story. I've tried to invoke it inside button knob

 button: button("Update Story", () => {
           forceReRender();
 })

@stale
Copy link

stale bot commented Sep 24, 2019

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

@stale stale bot added the inactive label Sep 24, 2019
@stale
Copy link

stale bot commented Oct 24, 2019

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants