Skip to content

Commit bfc5f89

Browse files
committed
docs(ja): translate testing.md
1 parent 91286a5 commit bfc5f89

File tree

1 file changed

+24
-24
lines changed

1 file changed

+24
-24
lines changed

docs/ja/testing.md

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
# Testing
1+
# テスト
22

3-
Mutations are very straightforward to test, because they are just functions that completely rely on their arguments. Actions can be a bit more tricky because they may call out to external APIs. When testing actions, we usually need to do some level of mocking - for example, we can abstract the API calls into a service and mock that service inside our tests. In order to easily mock dependencies, we can use Webpack and [inject-loader](https://github.com/plasticine/inject-loader) to bundle our test files.
3+
ミューテーションは完全に引数に依存しているだけの関数であるため、テストするのがとても簡単です。アクションは外部の API を呼び出す可能性があるためより少し注意が必要です。アクションをテストするとき、通常モックのいくつかのレベルで実行する必要があります。例えば、サービスでの API 呼び出しを抽象化することができ、そしてテスト内部でサービスをモックにすることができます。簡単に依存を真似るために、Webpack [inject-loader](https://github.com/plasticine/inject-loader) をテストファイルにバンドルして使用することができます。
44

5-
If your mutations and actions are written properly, the tests should have no direct dependency on Browser APIs after proper mocking. Thus you can simply bundle the tests with Webpack and run it directly in Node. Alternatively, you can use `mocha-loader` or Karma + `karma-webpack` to run the tests in real browsers.
5+
ミューテーションやアクションが適切に書かれている場合は、テストは適切なモック後、ブラウザの API に直接依存関係を持つべきではありません。したがって、単純に Webpack でテストをバンドルでき、それを直接 Node で実行できます。別の方法として、本当のブラウザでテストを実行するためには、`mocha-loader` または Karma + `karma-webpack` を使用できます。
66

7-
Example testing a mutation using Mocha + Chai (you can use any framework/assertion libraries you like):
7+
Mocha + Chai を使用してミューテーションをテストする例です (好きな任意のフレームワーク/アサーションライブラリを使用できます):
88

99
``` js
1010
// mutations.js
@@ -18,11 +18,11 @@ import { INCREMENT } from './mutations'
1818

1919
describe('mutations', () => {
2020
it('INCREMENT', () => {
21-
// mock state
21+
// モックステート
2222
const state = { count: 0 }
23-
// apply mutation
23+
// ミューテーションを適用
2424
INCREMENT(state)
25-
// assert result
25+
// 結果を検証
2626
expect(state.count).to.equal(1)
2727
})
2828
})
@@ -45,27 +45,27 @@ export const getAllProducts = ({ dispatch }) => {
4545
``` js
4646
// actions.spec.js
4747

48-
// use require syntax for inline loaders.
49-
// with inject-loader, this returns a module factory
50-
// that allows us to inject mocked dependencies.
48+
// inline loader に対して require 構文を使用する
49+
// inject-loader は、真似られた依存関係を注入できるようにする
50+
// モジュールファクトリを返す
5151
import { expect } from 'chai'
5252
const actionsInjector = require('inject!./actions')
5353

54-
// create the module with our mocks
54+
// モックによってモジュールを作成する
5555
const actions = actionsInjector({
5656
'../api/shop': {
5757
getProducts (cb) {
5858
setTimeout(() => {
59-
cb([ /* mocked response */ ])
59+
cb([ /* 真似られたスポンス */ ])
6060
}, 100)
6161
}
6262
}
6363
})
6464

65-
// helper for testing action with expected mutations
65+
// ミューテーションによって予期されたアクションをテストするためのヘルパー
6666
const testAction = (action, state, expectedMutations, done) => {
6767
let count = 0
68-
// mock dispatch
68+
// モックディスパッチ
6969
const dispatch = (name, payload) => {
7070
const mutation = expectedMutations[count]
7171
expect(mutation.name).to.equal(name)
@@ -77,7 +77,7 @@ const testAction = (action, state, expectedMutations, done) => {
7777
done()
7878
}
7979
}
80-
// call the action with mocked store
80+
// 真似られた store によってアクションを呼び出す
8181
action({
8282
dispatch,
8383
state
@@ -88,15 +88,15 @@ describe('actions', () => {
8888
it('getAllProducts', done => {
8989
testAction(actions.getAllProducts, {}, [
9090
{ name: 'REQUEST_PRODUCTS' },
91-
{ name: 'RECEIVE_PRODUCTS', payload: [ /* mocked response */ ] }
91+
{ name: 'RECEIVE_PRODUCTS', payload: [ /* 真似られたレスポンス */ ] }
9292
], done)
9393
})
9494
})
9595
```
9696

97-
### Running in Node
97+
### Node での実行
9898

99-
Create the following webpack config:
99+
以下のような webpack の設定を作成します:
100100

101101
``` js
102102
module.exports = {
@@ -120,16 +120,16 @@ module.exports = {
120120
}
121121
```
122122

123-
Then:
123+
その後、下記コマンドを実行します:
124124

125125
``` bash
126126
webpack
127127
mocha test-bundle.js
128128
```
129129

130-
### Running in Browser
130+
### ブラウザでの実行
131131

132-
1. Install `mocha-loader`
133-
2. Change the `entry` from the Webpack config above to `'mocha!babel!./test.js'`.
134-
3. Start `webpack-dev-server` using the config
135-
4. Go to `localhost:8080/webpack-dev-server/test-bundle`.
132+
1. `mocha-loader` をインストール
133+
2. 上記 Webpack 設定から `entry` `'mocha!babel!./test.js'` に変更
134+
3. 設定を使用して `webpack-dev-server` を開始
135+
4. `localhost:8080/webpack-dev-server/test-bundle` に移動

0 commit comments

Comments
 (0)