storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
84.16k stars 9.26k forks source link

[Feature Request]: Provider for Apollo client in Angular storybook returns undefined client #22290

Open alanhobbart opened 1 year ago

alanhobbart commented 1 year ago

Is your feature request related to a problem? Please describe

When I supply the angular apollo provider below to a story I get undefined client, but if I use applicationConfig provider it works fine. The issue is that i am then unable to supply different mocks to stories as applicationConfig provider makes it global.

This fails with client undefined

export const Deferred: Story = {
  decorators: [
    moduleMetadata({
      providers: [
        {
          provide: APOLLO_OPTIONS,
          useFactory() {
            return {
              link: mockSingleLink(deferredMock),
              cache: new InMemoryCache({}),
            };
          },
        },
      ],
    }),
  ],
}

Describe the solution you'd like

N/A

Describe alternatives you've considered

N/A

Are you able to assist to bring the feature to reality?

yes, I can

Additional context

No response

valentinpalkovic commented 1 year ago

@alanhobbart So you cannot apply applicationConfig provider to each story separately? Could you create a reproduction on stackblitz (https://storybook.new)?

valentinpalkovic commented 1 year ago

Hey @alanhobbart. I want to check whether you have tried my suggestion?

kroeder commented 7 months ago

@alanhobbart I encountered the same issue and tried to reproduce it. It seems that this is actually the intended way (see this StackBlitz)

If I use the ng add script from apollo-angular, it creates a graphqlProvider that is part of the bootstrapApplication(AppComponent, appConfig)

So, I don't understand it either since ApolloModule never needs to call forRoot but there seems to be a technical necessity to make it part of the ApplicationConfig, therefore it seems in Storybook, you need to do the same