Storybook: "< />" symbols in storiesOf name cause "Maximum call stack error"

[tuchk4]

Describe the bug
"< />" symbols in storiesOf name cause "Maximum call stack error"

Screenshots

Code snippets

storiesOf('Vue <docs/>', module)
  .add('Button', () => {
    return {
      components: {
        MyButton,
      },
      template: `<my-button>My Button</my-button>`,
    };
  });

System:

• OS: macOS
• Device: [e.g. iPhoneX, Macbook Pro 2018]
• Browser: Chrome latest
• Framework: vue

[shilman]

Thanks @tuchk4 -- good one! Can confirm this is an issue in core, reproducible in our examples for every view layer,.

[Armanio]

Hi @tuchk4
Interesting issue. I can reproduce on vue and svelte. On react app all is ok.
I'll do it. 🤔

[Armanio]

I investigated this problem: look like trouble in your config:
if you add hierarchySeparator: /\./, in 'addParameters' arg problem is solved.
Of course, it's not very elegant solution, but it's working solution. 😄

[shilman]

Just got a dupe to this. @Armanio what's a better long-term solution?

[Armanio]

Sorry, guys. Honestly, I forgot about this issue. Today I'll try find better solution.

[Armanio]

Hi, guys! I'm back with a possible fix. Invite you in PR for discussion.

[shilman]

Gadzooks!! I just released https://github.com/storybooks/storybook/releases/tag/v5.1.0-alpha.35 containing PR #6607 that references this issue. Upgrade today to try it out!

Because it's a pre-release you can find it on the @next NPM tag.

Closing this issue. Please re-open if you think there's still more to do.