eslint-plugin-storybook icon indicating copy to clipboard operation
eslint-plugin-storybook copied to clipboard

Use string literal names rule

Open Dschungelabenteuer opened this issue 2 years ago • 3 comments

Issue: #111

What Changed

  • Added ESLint rule to enforce string literals to override Story names.
  • This supports both the following patterns:
export const MyStory = {…, name}
const MyStory = {…, name}
export { MyStory }

Documentation and any plain english content may need to be rephrased.

Checklist

Check the ones applicable to your change:

  • [X] Ran yarn update-all
  • [X] Tests are updated
  • [X] Documentation is updated

Change Type

Indicate the type of change your pull request is:

  • [ ] maintenance
  • [ ] documentation
  • [ ] patch
  • [X] minor
  • [ ] major

Dschungelabenteuer avatar Jan 17 '23 21:01 Dschungelabenteuer

This is fantastic @Dschungelabenteuer ! I made a few tweaks and added a few more test cases which we need to support. Can you take a look?

yannbf avatar Jan 25 '23 08:01 yannbf

@yannbf It looks good to me, ~~should I go green?~~ I'll work something out :)

Dschungelabenteuer avatar Jan 25 '23 18:01 Dschungelabenteuer

Sorry for being that long to address these cases @yannbf, I've been a bit busy lately!

While taking a look at some other issues (including #28 and #67 you mentioned on Discord), I ended up being a bit more ambitious than just addressing the original issue and its test cases.

I definitely wanted to have a generic, easy and re-usable way of restricting validation logic to stories and their properties. I came up with some wrapper function which abstracts the whole process of "figuring out whether we're in a Story context" and exposes a very simple API to get stories and story properties. You can even filter them, which can come handy as illustrated by the use-string-literal-names rule, which specifically targets both name and storyName properties. A few notes:

  • It should work with the test cases you provided (including the "spread" scenario)
  • Code mentions "properties" instead of "parameters" so that it does not create any confusion with the actual parameters property of a Story.

I believe this could make writing new rules much easier, and bring in a bit of confidence about what's going on under the hood. The rule I've wrote to address the original issue now just holds in <50 LOC! However, I could not come up with any good approach on how to unit test the wrapper, which kind of upsets me!

I'd love to get your insight!

Dschungelabenteuer avatar Feb 04 '23 15:02 Dschungelabenteuer