Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Angular source code view unavailable until control toggled

See original GitHub issue

Describe the bug In the Docs tab the “Show code” option is disabled and shows “No code available”. Simply clicking a control enables the ability to Show code

To Reproduce Steps to reproduce the behavior:

Create a new angular cli project
npx sb@next init in the project
npm run storybook
Click on Primary button and click the Docs tab
Note the disabled option to view code
Click primary toggle switch
Note the Show code option is now enabled

Expected behavior Show code should be immediately available when page loads

Screenshots

Disabled on load

Enabled after clicking primary

System System: OS: macOS 11.2.2 CPU: (12) x64 Intel® Core™ i7-9750H CPU @ 2.60GHz Binaries: Node: 14.15.5 - ~/.nvm/versions/node/v14.15.5/bin/node Yarn: 1.22.10 - ~/.nvm/versions/node/v14.15.5/bin/yarn npm: 6.14.11 - ~/.nvm/versions/node/v14.15.5/bin/npm Browsers: Chrome: 89.0.4389.82 Edge: 88.0.705.81 Firefox: 86.0 Safari: 14.0.3 npmPackages: @storybook/addon-actions: ^6.2.0-beta.12 => 6.2.0-beta.12 @storybook/addon-essentials: ^6.2.0-beta.12 => 6.2.0-beta.12 @storybook/addon-links: ^6.2.0-beta.12 => 6.2.0-beta.12 @storybook/angular: ^6.2.0-beta.12 => 6.2.0-beta.12

┆Issue is synchronized with this Asana task by Unito

Issue Analytics

State:
Created 3 years ago
Reactions:5
Comments:43 (23 by maintainers)

Top GitHub Comments

5reactions

bmayencommented, May 26, 2021

With v6.3 now in beta, could this get a bump in priority? Would love to upgrade and test newer releases, but this is a blocker for us and is keeping us pinned to 6.2.0-rc.7. We have multiple teams, both internal and external contractors, using Storybook daily to reference canonical code samples and we can’t tell them all to use this hack every time they view it.

5reactions

pravbesedacommented, Apr 14, 2021

I have the same problem (angular 11)

ng new test-app
cd test-app
npx -p @storybook/cli sb init
npm run storybook

On Docs tab of predefined Stories I see “No code available”. The “Show code” button is unlocked after clicking on “Reset controls” or after some switching between Stories.

The problem is reproducible on versions 6.2.1-6.2.8.

And inline mode does not solve the problem.

Top Results From Across the Web

Angular toggling content display issue - Stack Overflow

I am working on a mobile web app in AngularJS and I am stuck on a problem involving hidden content I want to...

Built-in directives - Angular

Displaying and updating properties with ngModel link ... Use the NgModel directive to display a data property and update that property when the...

Why your Angular App is not Working: 11 common Mistakes

1. Import required Angular Modules · 2. Don't use DOM references before they exist (@ViewChild) · 3. Don't manipulate the DOM directly -...

Debug Angular apps in production without revealing source ...

When our app gets deployed to production, we often encounter different code than we edited during development. Our code gets modified and optimized...

ngShow - AngularJS: API

.ng-hide CSS class onto the element. The ;.ng-hide CSS class is predefined in AngularJS and sets the display style to none (using an...