2016-05-06 17 views
2

テストコンポーネント

Jestと反応するコンポーネントについて非常に簡単なテストを実行しようとしています。私はテストする必要はありません、私のコンポーネントファイルJestがテスト時に.less importを無視するようにします。

import {} from './style.less'; 

ここでは、インポートの一番上にあるため、このラインの問題に実行していますし、理想的なテストから無視されます。 [NPMテスト]

結果テストがnpm test経由で実行されると、私は応答

FAIL tests/app_test.js ● Runtime Error SyntaxError: Unexpected token { in file 'client/components/app/style.less'.

Make sure your preprocessor is set up correctly and ensure your 'preprocessorIgnorePatterns' configuration is correct: http://facebook.github.io/jest/docs/api.html#preprocessorignorepatterns-array-string If you are currently setting up Jest or modifying your preprocessor, try jest --no-cache . Preprocessor: node_modules/jest-css-modules. Jest tried to the execute the following preprocessed code: //some .less code

しかし、私は私のテストが正しく実行少なくインポート行をコメントアウト場合を取得します。

質問

は、どのように私は冗談が、このコード行をスキップまたはこのインポートを無視して入手できますか?

+0

チェックこのソリューションhttp://stackoverflow.com/a/36137733/2765745 私のために働いた。 –

答えて

0

私はignore-styles(https://github.com/bkonkle/ignore-styles)と同じ問題を解決しました。私はこのライブラリをmochaと使いましたが、私はそれが冗談で大丈夫だろうと思います。

+0

私のために働かない。 readmeで概説されているように試してみましたが、成功しませんでした。 – vkjb38sjhbv98h4jgvx98hah3fef

1

テストの最上部にある.lessファイルを手動で嘲笑する以外に、私には少ないファイルを無視することができます。

jest.mock("../../src/styles.less",() => jest.fn()); 

はpackage.jsonに以下を追加しました:あなたのコードは、以下のファイルをインポートしようとするたびに

"jest": { 
"moduleNameMapper": { 
    ".*\\.less$": "<rootDir>/pathToDummyFile/dummy.js" 
    } 
}, 

ではなく回避します空のダミーファイルを、取得するために、インポートをリダイレクトします予期せぬトークンエラーが発生しました。

+0

これは機能しました。特筆すべきは ''という反応文書では、ファイルを指している場合、 'dummy.js'ファイルへの絶対パスを解決する' 'を使うべきです。私はこの設定を 'jest.config.js'ファイルに入れました。 –

1

あなたはまだこの問題を持っている場合は、あなたのjest.config.jsonファイルに次の設定を追加しよう:あなたのstyleMock.jsあなたはこのようなあなたの.lessファイルを変換しますtransformerを作成している中で、ここで

"transform": { "^.+\\.(css|less)$": "./styleMock.js" }

module.exports = { process() { return '' } }

+0

これは動作しません。これを行うことで、JestはReactコンポーネントのimport文について不平を言う。 '' '../App 'からアプリケーションをインポートする ^^^^^ SyntaxError:予期せぬトークンのインポート' '' –

関連する問題