Translate 10.4test-utils.md to Japanese
Kohei TAKATA committed
Jul 21, 2015 at 21:04 UTC
75d04862027a323896fe023c6ba68d348b64f760
1 file changed
+183
docs/docs/10.4-test-utils.ja-JP.md
new
+183
@@ -0,0 +1,183 @@
1
+---
2
+id: test-utils
3
+title: テストユーティリティ
4
+permalink: test-utils-ja-JP.html
5
+prev: two-way-binding-helpers-ja-JP.html
6
+next: clone-with-props-ja-JP.html
7
+---
8
+
9
+`React.addons.TestUtils` は選んだテストフレームワーク（私たちは[Jest](https://facebook.github.io/jest/)を使っています）において、Reactのコンポーネントをテストすることを簡単にします。
10
+
11
+### Simulate
12
+
13
+```javascript
14
+Simulate.{eventName}(DOMElement element, object eventData)
15
+```
16
+
17
+オプションの `eventData` であるイベントデータと共に、DOMノードの上でイベントのディスパッチをシミュレートします。 **これは `ReactTestUtils` の中で最も有用なユーティリティでしょう。**
18
+
19
+使用例:
20
+
21
+```javascript
22
+var node = React.findDOMNode(this.refs.input);
23
+React.addons.TestUtils.Simulate.click(node);
24
+React.addons.TestUtils.Simulate.change(node, {target: {value: 'Hello, world'}});
25
+React.addons.TestUtils.Simulate.keyDown(node, {key: "Enter"});
26
+```
27
+
28
+`Simulate` はReactが理解出来る全てのイベントのためのメソッドを持っています。
29
+
30
+### renderIntoDocument
31
+
32
+```javascript
33
+ReactComponent renderIntoDocument(ReactElement instance)
34
+```
35
+
36
+コンポーネントをドキュメントの中で分離したDOMノードにレンダリングします。 **この関数はDOMを必要とします。**
37
+
38
+
39
+### mockComponent
40
+
41
+```javascript
42
+object mockComponent(function componentClass, string? mockTagName)
43
+```
44
+
45
+有効なダミーのReactのコンポーネントとして使われることを許可するメソッドと共にこれを増強させるためにモックとなったコンポーネントモジュールをこのメソッドに渡してください。いつものようにレンダリングされる代わりに、コンポーネントは単純で、提供された子要素はどんなものでも含む `<div>` （`mockTagName` が提供されている場合はそのタグ）になるでしょう。
46
+
47
+### isElement
48
+
49
+```javascript
50
+boolean isElement(ReactElement element)
51
+```
52
+
53
+`element` が何かしらのReactElementだった場合に `true` を返します。
54
+
55
+### isElementOfType
56
+
57
+```javascript
58
+boolean isElementOfType(ReactElement element, function componentClass)
59
+```
60
+
61
+`element` がReactの `componentClass` 型であるReactElementだった場合に `true` を返します。
62
+
63
+### isDOMComponent
64
+
65
+```javascript
66
+boolean isDOMComponent(ReactComponent instance)
67
+```
68
+
69
+`instance` がDOMのコンポーネントだった場合に `true` を返します( `<div>` や `<span>` のように)。
70
+
71
+### isCompositeComponent
72
+
73
+```javascript
74
+boolean isCompositeComponent(ReactComponent instance)`
75
+```
76
+
77
+`instance` が複合的なコンポーネントだった場合に `true` を返します（`React.createClass()` で作成されるような）。
78
+
79
+### isCompositeComponentWithType
80
+
81
+```javascript
82
+boolean isCompositeComponentWithType(ReactComponent instance, function componentClass)
83
+```
84
+
85
+`instance` が複合的なコンポーネントだった場合に `true` を返します（`React.createClass()` で作成され、型がReactの `componentClass` であるような）。
86
+
87
+### findAllInRenderedTree
88
+
89
+```javascript
90
+array findAllInRenderedTree(ReactComponent tree, function test)
91
+```
92
+
93
+`tree` の中の全てのコンポーネントや `test(component)` が `true` となる蓄積された全てのコンポーネントを検討します。これはこれだけでは有用ではありませんが、他のテストユーティリティの根本として使われます。
94
+
95
+### scryRenderedDOMComponentsWithClass
96
+
97
+```javascript
98
+array scryRenderedDOMComponentsWithClass(ReactComponent tree, string className)
99
+```
100
+
101
+レンダリングされたツリーの中で、DOMコンポーネントであり、クラス名が `className` にマッチする、コンポーネントの全てのインスタンスを見つけます。
102
+
103
+### findRenderedDOMComponentWithClass
104
+
105
+```javascript
106
+ReactComponent findRenderedDOMComponentWithClass(ReactComponent tree, string className)
107
+```
108
+
109
+`scryRenderedDOMComponentsWithClass()` に似ていますが、結果が1つであること、それを返すこと、またはマッチする個数が1個以外だった場合に例外を投げることを予期します。
110
+
111
+### scryRenderedDOMComponentsWithTag
112
+
113
+```javascript
114
+array scryRenderedDOMComponentsWithTag(ReactComponent tree, string tagName)
115
+```
116
+
117
+レンダリングされたツリーの中で、DOMコンポーネントであり、タグ名が `tagName` にマッチする、コンポーネントの全てのインスタンスを見つけます。
118
+
119
+### findRenderedDOMComponentWithTag
120
+
121
+```javascript
122
+ReactComponent findRenderedDOMComponentWithTag(ReactComponent tree, string tagName)
123
+```
124
+
125
+`scryRenderedDOMComponentsWithTag()` に似ていますが、結果が1つであること、それを返すこと、またはマッチする個数が1個以外だった場合に例外を投げることを予期します。
126
+
127
+### scryRenderedComponentsWithType
128
+
129
+```javascript
130
+array scryRenderedComponentsWithType(ReactComponent tree, function componentClass)
131
+```
132
+
133
+型名が `componentClass` と同様である、コンポーネントの全てのインスタンスを見つけます。
134
+
135
+### findRenderedComponentWithType
136
+
137
+```javascript
138
+ReactComponent findRenderedComponentWithType(ReactComponent tree, function componentClass)
139
+```
140
+
141
+`scryRenderedComponentsWithType()` と同じですが、結果が1つであること、それを返すこと、またはマッチする個数が1個以外だった場合に例外を投げることを予期します。
142
+
143
+## Shallow rendering
144
+
145
+シャローレンダリングは"第一段階の深さ"であるコンポーネントをレンダリングすることを強制し、レンダリングメソッドが返すものについての事実をアサートし、インスタンスを生成したり、レンダリングされたりしない子のコンポーネントの振る舞いについては関心しない実験的な特徴です。これはDOMを必要としません。
146
+
147
+```javascript
148
+ReactShallowRenderer createRenderer()
149
+```
150
+
151
+シャローレンダラーを作成するにはこれをテストの中で呼んでください。これをあなたがテストするコンポーネントをレンダリングする場所であると考えることができます。この場所はイベントに返答したり、これ自身を更新したりできます。
152
+
153
+```javascript
154
+shallowRenderer.render(ReactElement element)
155
+```
156
+
157
+`React.render` に同様。
158
+
159
+```javascript
160
+ReactComponent shallowRenderer.getRenderOutput()
161
+```
162
+
163
+`render` が呼ばれた後、浅くレンダリングされた出力を返します。その後、その出力に関しての事実をアサートすることができます。例えば、以下のように、コンポーネントのレンダリングメソッドが返してきた場合は、
164
+
165
+```javascript
166
+<div>
167
+ <span className="heading">Title</span>
168
+ <Subcomponent foo="bar" />
169
+</div>
170
+```
171
+
172
+以下のように、アサートできます。
173
+
174
+```javascript
175
+result = renderer.getRenderOutput();
176
+expect(result.type).toBe('div');
177
+expect(result.props.children).toEqual([
178
+ <span className="heading">Title</span>,
179
+ <Subcomponent foo="bar" />
180
+]);
181
+```
182
+
183
+シャローテスティングは現在、制限があります。はっきり言うと、参照をサポートしていません。私たちは、この特徴を早めにリリースし、これが、どのように進化していくか、Reactのコミュニティのフィードバックを評価するつもりです。