3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Reactでとりあえずテストを書いてみる

Posted at

Reactjsのテスト

RailsでもテストコードがあるようにReactjsにもテストを書くことができる。
ReactではJestと呼ばれるJavaScriptsテストフレームワークがあるのでこれを使ってみる。

準備

今回はnpmを使用していることを想定して記述していく

npm i -g jest-cli
npm i --save-dev babel-jest react-addons-test-utils

package.jsonに以下を付け加える

package.json
/* ... */

  "jest": {
     "unmockedModulePathPatterns": [
         "node_modules/react",
         "node_modules/react-dom",
         "node_modules/react-addons-test-utils",
         "node_modules/fbjs"
      ]
  },

/* ... */

これでJestを使ったテストが行うようになる

jest テスト名.js

実際にテストを書いてみる

Jestは、__tests__ディレクトリからテストコードを探そうとしている
そのため__tests__ディレクトリにコードを書き、実行するという形になる

次に、簡単なテストを書いてみる

__tests__/dummy-test.js
describe('a suite',  () = >{
    it('is a spec' , () => {
        expect(1).toBe(1);
    });
});

これでテストをすると通るはずです。
英語的な記述のためテストコードが書きやすいと言われております。

参考文献

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?