Numerous issues with Angular Compodoc since v6.4.0-alpha.34

[decline]

I'm experiencing numerous issues with Angular in newer versions of Storybook. It seems they are all related to Compodoc. These issues include:

• Arrays are interpreted as strings
• Enums are not correctly interpreted
• EventEmitters throw errors

I tracked down the version when this started happening and I found out that these issues started to occur in v6.4.0-alpha.34 (in v6.4.0-alpha.33 everything is fine). I assume it is related to this pull request: #15744

Note: These issues are also still present in latest 6.5.0-alpha.26

Reproduce:

Clone this repository: https://github.com/decline/storybook-angular-issues

There are 3 stories that describe what is going wrong.

See errors in v6.4.0-alpha.34:

yarn && yarn storybook

See it working in v6.4.0-alpha.33:

git checkout 6.4.0-alpha.33
yarn && yarn storybook

As soon as you remove the setCompodocJson(docJson); line in .storybook/preview.js it will also work in v6.4.0-alpha.34, but then you will also lose Compodoc support 😕

I also recorded a video that shows the comparison between the two versions:

storybook-angular-isues.mov

Environment Info:

  System:
    OS: macOS 11.6.3
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
  Binaries:
    Node: 14.17.5 - ~/.nvm/versions/node/v14.17.5/bin/node
    Yarn: 3.1.1 - /usr/local/bin/yarn
    npm: 6.14.14 - ~/.nvm/versions/node/v14.17.5/bin/npm
  Browsers:
    Chrome: 97.0.4692.99
    Firefox: 96.0.2
    Safari: 15.3
  npmPackages:
    @storybook/addon-actions: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/addon-docs: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/addon-essentials: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/addon-links: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/angular: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/builder-webpack5: 6.4.0-alpha.34 => 6.4.0-alpha.34 
    @storybook/manager-webpack5: 6.4.0-alpha.34 => 6.4.0-alpha.34 

Additional context:

Issue #17302 is related to this one, I will close that issue in favour of this new one here.

[shilman]

@decline it could also be related to this PR which also went out in v6.4.0-alpha.34 #15881

Thanks for tracking this down!

[manisankar92]

is this issue resolved or do we need to downgrade story book version?

[AlbertJohansson]

Video seems to exhibit the same symptoms identified in this issue #17004 where all the inputs become stringified.

[amaino]

@decline it could also be related to this PR which also went out in v6.4.0-alpha.34 #15881

Thanks for tracking this down!

I have looked into #17004 and it is connected to the removal of eval. I have created a PR to fix this but having some problem with tests #17353

[rajeshkannan31]

Hi,

Any plans to fix this issue. Thank you.

[keliel]

Bumping this instead of creating a new issue. I am facing the aforementioned issue about @Output() handling. As described in #18578, the example given is "fixable", by not declaring the type in addition to assigning it. This pattern of both declaring and assigning is not used in my application, so I never faced the problem.

However, my issue is similar in that it also results in compodoc messing up the automatic action assignments that Storybook usually sets for outputs.
I am not defining my output as an EventEmitter, but rather follow an example from Angular itself on using pipes on outputs.

In that case I am running into the same/similar issue where the default value is simply stringified, resulting in the automatically generated template throwing an error.

I think this might have something to do with the type property in compodocs documentation.json being set to not just "EventEmitter", as it would be, when you don't also declare the type and just assign the output member with new EventEmitter<someType>().

[swiner-dlpx]

Are there any plans to fix this? This is impacting one of our libraries - where we have set up linting to require type definitions on all properties, including EventEmitters.