question-mark
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.

[addon-knobs] Knobs Date Throws "Maximum Call Stack" Error for Angular (Conflict with addon-actions)

See original GitHub issue

Describe the bug Knobs date() throws Maximum Call Stack Exceeded error in Angular. I am able to see the output of the knobs date for a split second before the error is thrown.

To Reproduce

import { storiesOf } from '@storybook/angular';
import { date as knobDate } from '@storybook/addon-knobs/angular'; // also tried @storybook/addon-knobs

const stories = storiesOf("Simple Components|Date", module);

stories.add("Test", () => {
    const date = knobDate("test date", new Date("2019-01-01")); // this line throws the error
    return ({
        template: "<label>{{date}}</label>",
        props: {
            date
        }
    });
});

Errors:

Uncaught RangeError: Maximum call stack size exceeded
    at JSON.stringify (<anonymous>)
    at stringify (vendors~main.2918c86addf666b280ef.bundle.js:64164)
    at PostmsgTransport.send (vendors~main.2918c86addf666b280ef.bundle.js:25660)
    at handler (vendors~main.2918c86addf666b280ef.bundle.js:25841)
    at Channel.emit (vendors~main.2918c86addf666b280ef.bundle.js:25850)
    at Object.error (vendors~main.2918c86addf666b280ef.bundle.js:4340)
    at console.logger.error (vendors~main.2918c86addf666b280ef.bundle.js:12287)
    at warningWithoutStack (vendors~main.2918c86addf666b280ef.bundle.js:86139)
    at warnAboutInvalidUpdates (vendors~main.2918c86addf666b280ef.bundle.js:102979)
    at scheduleWorkToRoot (vendors~main.2918c86addf666b280ef.bundle.js:104259)
...

Uncaught RangeError: Maximum call stack size exceeded
    at Array.splice (<anonymous>)
    at Object.<anonymous> (vendors~main.2918c86addf666b280ef.bundle.js:64178)
    at JSON.stringify (<anonymous>)
    at stringify (vendors~main.2918c86addf666b280ef.bundle.js:64164)
    at PostmsgTransport.send (vendors~main.2918c86addf666b280ef.bundle.js:25660)
    at handler (vendors~main.2918c86addf666b280ef.bundle.js:25841)
    at Channel.emit (vendors~main.2918c86addf666b280ef.bundle.js:25850)
    at Object.error (vendors~main.2918c86addf666b280ef.bundle.js:4340)
    at console.logger.error (vendors~main.2918c86addf666b280ef.bundle.js:12287)
    at warningWithoutStack (vendors~main.2918c86addf666b280ef.bundle.js:86139)
...

The above error occurred in the <Context.Consumer> component:
    in Styled(div) (created by ForwardRef)
    in ForwardRef (created by DateType)
    in DateType (created by PropForm)
    in label (created by Context.Consumer)
    in Styled(label) (created by ForwardRef)
    in ForwardRef (created by Field)
...

Expected behavior Don’t throw an error

System:@storybook/addon-knobs”: “^4.1.4” “@storybook/angular”: “^4.1.4”

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:15 (3 by maintainers)

github_iconTop GitHub Comments

3reactions
eslaurentecommented, Jan 17, 2019

I get the same exact errors thrown with React with:

        "react": "^16.4.1",
        "@storybook/addon-actions": "^4.1.7",
        "@storybook/addon-console": "^1.1.0",
        "@storybook/addon-knobs": "^4.1.7",
        "@storybook/addons": "^4.1.7",
        "@storybook/react": "^4.1.7"

It seems to only occur when both @storybook/addon-knobs and @storybook/addon-actions are registered in the addons config. Removing @storybook/addon-action makes the knobs work again.

1reaction
mraxuscommented, Nov 5, 2019

Hi, I still experience this issue and have seen it both in storybook v4 and v5. Did any of you manage to figure out how to solve this issue?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Angular 7 error RangeError: Maximum call stack size exceeded
1.This error occur when there is an infinite loop. As you have mentioned that the page loads when app-heroes is commented, this might...
Read more >
@storybook/addon-actions | Yarn - Package Manager
Fast, reliable, and secure dependency management.
Read more >
storybookjs/storybook (Raised $170.00) - Issuehunt
Angular 11 error being thrown on IE11 with Storybook 6.1 and 6.2@alpha ... Addons panel not showing - but knobs are still working(?)....
Read more >
npm - Snyk
@alancnet/fantasy-names · @alexamies/chinesedict-js · @alifd/next · @alpacahq/alpaca-trade-api · @amcharts/amcharts3-angular · @amcharts/amcharts4 ...
Read more >
The Future of Continuing Education - Masterplan.com
Product; Customer Stories; Resources; About Masterplan; Contact. English ... @babel/plugin-syntax-throw-expressions plus ... @storybook/addon-knobs plus.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found