Conflict between shouldExtractLiteralValuesFromEnum and shouldRemoveUndefinedFromOptional

[theAdhocracy]

In the latest version of Storybook (6.2), props with an enum/string literal typing are incorrectly displaying undefined on the Controls panel (what used to be the Knobs addon).

It looks like the culprit is a conflict between the shouldExtractLiteralValuesFromEnum and shouldRemoveUndefinedFromOptional option flags. Storybook currently has both set to true, but the conversion to enum is outputting a value that takes priority over the string with undefined removed.

Honestly, I'm over my head debugging this (😅) but it seems to me that this part of parser.ts:

value: propType.types.map(type => ({
   value: this.getValuesFromUnionType(type)
}))

Could have a conditional that checks whether shouldRemovedUndefinedFromOptional is true and then filters out undefined values from the enum.

Related issue on Storybook for full context: storybookjs/storybook#14523

[michelengelen]

I will have a look next week (probably monday) ... should be a relatively easy fix

[michelengelen]

Soooo ... I had a look and the problem is, that I could not find a single case where "undefined" gets added to the propTypeString in the tests. So I created a new component and tested some things out ... turns out that the package itself does not add the | undefined by default.

You were right with the code block you mentioned. I can only suspect, that there is some kind of edge-case in the storybook implementation.

I will continue looking into this though. 🚀

[pvasek]

This should be fixed in v2.0.0 release.