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

[Bug]: spyOn on Angular's services methods stopped working after upgrade to Stroybook 8 #28419

Closed
dmy-leanix opened this issue Jul 2, 2024 · 2 comments · Fixed by #28445
Closed

Comments

@dmy-leanix
Copy link

Describe the bug

Currently I'm trying to upgrade to Storybook 8 my Angular's app storybook with interaction tests. In some cases I have in play function the following - getting injector, finding needed service and spying on some methods:

const injector = args.getInjector();
const service = injector.get(MyService);
const spy = spyOn(service, 'test');

// ... some UI actions which should call that service's method

expect(spy).toHaveBeenCalled();

What's wrong, service's method losts his scope to null, so any this usage will cause errors inside that method

In Storybook 7 it was working correctly

Reproduction link

https://stackblitz.com/edit/github-ex87bm

Reproduction steps

No response

System

System:
    OS: macOS 14.4.1
    CPU: (8) arm64 Apple M1 Pro
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.17.1 - ~/.nvm/versions/node/v18.17.1/bin/node
    npm: 9.6.7 - ~/.nvm/versions/node/v18.17.1/bin/npm <----- active
  Browsers:
    Chrome: 126.0.6478.127
    Safari: 17.4.1
  npmPackages:
    @storybook/addon-a11y: 8.1.7 => 8.1.7 
    @storybook/addon-actions: 8.1.7 => 8.1.7 
    @storybook/addon-backgrounds: 8.1.7 => 8.1.7 
    @storybook/addon-controls: 8.1.7 => 8.1.7 
    @storybook/addon-docs: 8.1.7 => 8.1.7 
    @storybook/addon-essentials: 8.1.7 => 8.1.7 
    @storybook/addon-interactions: 8.1.7 => 8.1.7 
    @storybook/addon-knobs: ^8.0.1 => 8.0.1 
    @storybook/addon-mdx-gfm: 8.1.7 => 8.1.7 
    @storybook/addon-measure: 8.1.7 => 8.1.7 
    @storybook/addon-outline: 8.1.7 => 8.1.7 
    @storybook/addon-toolbars: 8.1.7 => 8.1.7 
    @storybook/addon-viewport: 8.1.7 => 8.1.7 
    @storybook/angular: 8.1.7 => 8.1.7 
    @storybook/blocks: 8.1.7 => 8.1.7 
    @storybook/core-events: 8.1.7 => 8.1.7 
    @storybook/core-server: 8.1.7 => 8.1.7 
    @storybook/preview-api: 8.1.7 => 8.1.7 
    @storybook/test: 8.1.7 => 8.1.7 
    @storybook/test-runner: ^0.19.0 => 0.19.0 
    @storybook/types: 8.1.7 => 8.1.7 
    eslint-plugin-storybook: ^0.8.0 => 0.8.0

Additional context

No response

@dmy-leanix
Copy link
Author

Can it be related to this line in spy.ts?

const originalMockImplementation = reactive.mockImplementation.bind(null);

@bawjensen
Copy link

yeah, it's either that line in fn() or this line in listenWhenCalled():

const impl = state.impl?.bind(null);

We've been suffering from the latter (found through debugging/looking at the stack trace), which was introduced here: 6ea5bd8#diff-7e286e50b9508a96cb4512909ee1c653b07ebd3dc930d381b7b06115975d4effR44 (same commit you linked, just a few lines lower)

I believe @kasperpeulen confirmed this appears to be a bug, and it ought to be binding an appropriate this

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

Successfully merging a pull request may close this issue.

4 participants