#Storybook picks up test files adjacent to stories

51 messages · Page 1 of 1 (latest)

hexed pike
#

Upgrading from 6.5 to 7.

I have a Checkbox folder with a checkbox component file and associated story and unit tests. This component exists in a separate package, alongside a story and a test file, in a monorepo. Storybook is run from the root of the monorepo.

These packages have their own path definitions for testUtils for various mocking utilities.

However Storybook insists on compiling the Checkbox.test.tsx file even though it is not linked anywhere., causing it to fail, because it has no notion of the local path resolutions.

Any ideas as to why it would do that? *.test.* files are only used as Jest unit tests,

#

or a way to ignore *.test.* files?

#

From my .storybook/main.js:

stories: [
'../packages/components/src/atoms/Checkbox/Checkbox.stories.tsx'
]```
sonic grove
#

That seems very strange. Is the test file imported in the stories file or a related component file?

lethal bay
#

what else is in your main.js?

hexed pike
#

no references to the test file in either component or story. the file just exists next to the story and component file.

#

two sec, just gotta remove any incriminating information in that file 😄

#

it used to be a CRA app once upon a time, but i can't find anything in the CRA sources that would introduce it either.

#

Removing Checkbox.test.tsx makes stuff work.

lethal bay
#

hmm my guess is that its including the package in the transpilation step with the babel-loader and then fails to process it

#

maybe its happening in addon-react-native-web since theres an extra babel loader there

#

you could edit the node_modules and change the babel loader to ignore test files maybe

#

kinda weird that it would include that stuff in a separate package though

#

where do you run the command from? from the folder where storybook lives or at the mono repo root?

hexed pike
#

good catch! imma check it out 🙂

  1. the storybook config resides in root, and the command is run from root.
#

so it's one storybook for all the packages.

#

okay, so we're definitely on to something. however, if i ignore the .test. files, (it is provided as a filename to the function you linked) it now says that there is no loader for that test file.

#

from builder-webpack5

#

so that's the preview.

hexed pike
#

i should really just burn this monorepo to the ground 😄

hexed pike
#

okay, so if i explicitly use the file extension of the file i'm importing in the story, the problem also goes away.

#

import { Checkbox } from './Checkbox.tsx'

#

instead of import { Checkbox } from './Checkbox'.

lethal bay
#

hmm interesting I guess that makes sense since the loader test would match both file extensions

hexed pike
#

it may be that this project will never make it to 7.

lethal bay
#

does this only happen on v7?

hexed pike
#

yes

#

6.5 is okay.

#

no other changes than the migrations for main.js

lethal bay
#

well it might be that in v7 it takes your babel config from the project root

#

I wonder if that could cause these kinds of things

hexed pike
#

hm, there is no babel config at root atm.

#

only per package, in package.json, using the react-app preset.

lethal bay
#

maybe you could generate the one that used to come with it

#

though if there was no babel at all you would expect it to fail

hexed pike
#

Note: If you are using @storybook/react-webpack5 with the @storybook/preset-create-react-app package, you don't need to do anything. The preset already provides the babel configuration you need.

#

but will generate.

#

i need to get rid of all this CRA junk anyway

#

thank you for all your help. 🙇

lethal bay
#

no problem 🙂

hexed pike
#

no joy 🙂

#

trying to remove CRA presets.

#

still no joy.

lethal bay
#

😢 needs more joy

#

do you think its reproducable?

#

if you could reproduce it in a public repo I'd be happy to try debug it

hexed pike
#

i have to move this code manually from one pc to this with USB 😄 for now 6.5 works, these are just symptoms of much more problematic things going on with the setup of the repo.