elderfo / react-native-storybook-loader

An automatic story loader for react-native-storybooks
https://github.com/elderfo/react-native-storybook-loader
MIT License
299 stars 27 forks source link

Can't load stories from storyLoader.js file for Storyshots tests #26

Open chawax opened 7 years ago

chawax commented 7 years ago

Hi,

I try to use Storyshots with React Native in my unit tests but I can't find the way to load the stories from the generated storyLoader.js file.

In my JEST__tests__ directory I have the following test :

import initStoryShots from 'storyshots';
initStoryShots({
    configPath: 'storybook'
});

Then my storybook/config.js file :

import { configure } from '@kadira/react-native-storybook';
import { loadStories } from './storyLoader'
configure(loadStories, module);

And the generated storyLoader.js file :

function loadStories() {
    require('./../src/app/views/banks/BankItem.stories.js');
}
module.exports = {
  loadStories,
};

But when I run tests it can't find the stories :

Your test suite must contain at least one test.      
      at onResult (node_modules/jest-cli/build/TestRunner.js:192:18)

The Storyloader.js file is OK when I run Storybook, so the problem occurs only when loading the stories from JEST unit test. I could make it work by putting all the stories in the storybook but I want to keep the stories by the components, so not a solution I want to keep.

Any idea how I could do that ?

Thanks in advance,

Olivier

elderfo commented 7 years ago

I will look into this in the next few days and let you know what I find.

chawax commented 7 years ago

Hi, I removed the storybook dependency in package.json and it works well now. It caused the loader to consider the project as a React one, not React Native. And so I had to pass the configPath as storybook on initStortyshots. But since "storybook" is the default directory for React Native I can't understand why it doesn't work when I set it explicitely. Any idea ?

elderfo commented 7 years ago

Can you post your dependencies and devDependencies from package.json? I am unable to get storyshots working with the latest react-native-cli. They seem to be unrelated issues.

chawax commented 7 years ago

Yes, I had problems with latest React Native release. I think it is because it depends on React 16.0.0-alpha6 (other components have the same problem). So I had to use an older release of RN.

Here is an extract of my package.json :

  "dependencies": {
    "react": "15.5.4",
    "react-native": "0.42.3",
  },
  "devDependencies": {
    "@kadira/react-native-storybook": "^2.0.0",
    "jest": "19.0.2",
    "jest-react-native": "^18.0.0",
    "react-native-mock": "^0.3.1",
    "react-native-storybook-loader": "^1.3.1",
    "storyshots": "^3.2.2"
  },

Hope it helps !

elderfo commented 7 years ago

Thank you! I did find a prototype project of mine that had an older version of RN, but it was in really bad shape.

Anyways, thanks again, I will try to dig in to this over the weekend.

yonidavidson commented 7 years ago

Hi, Any updates ?

ktj commented 7 years ago

Found the reason: https://github.com/storybooks/storybook/blob/master/addons/storyshots/src/index.js#L27

If the dependency exists, then storyshots thinks this is a react project, no matter what the framework param is.