2

React ストーリーブックがあり、テスト ケースとして何を使用するか

すべてのストーリーをインポートする「loader.js」があります

import sourceBasic from 'raw-loader!./Basics/foo.js?sourceMap';
import Basic from './Basics/foo';

const tree = {
  Basics:[
    {
      title:'Creating and applying a style',
      source:sourceBasic,   element:Basic
    },
    {        ....        }
  ],
  [       ....      ],
  ....
}

export default tree

raw-loaderとを使用してsourceMap、ストーリーブックの要素を含むソースを表示します

これはうまくいきます。

私の問題は、Jestでインポートしようとしたときです

FAIL  ./index.test.js
 ● Test suite failed to run

 Cannot find module 'raw-loader!./Basics/foo.js?sourceMap' from 'load.js'

   at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:179:17)
   at Object.<anonymous> (example/stories/load.js:2:34)

テストファイル

import React from 'react';
import renderer from 'react-test-renderer';
import load from './example/stories/load'

for(const groupName in load ){
  const groupArray = load[groupName];
  describe(groupName, () => {
    for(const item of groupArray ){
      test(item.title, () => {
        const elem = renderer.create(item.element);
        expect(elem.toJSON()).toMatchSnapshot();
      }) // END test
    } // END for
  }) // END describe
} // END for

ご協力いただきありがとうございます

アップデート

テストとしての更新および作業用ストロイブックは、プロジェクトのreact-outlineに実装されています。

あなたはcloneそれをすることができます(react-outline)、npm installそしてそれnpm testを実際に見ることができます。

これがtravisの出力です:)

4

1 に答える 1