8.

5 使用Enzyme测试基本的React组件 237

),
item:
））；

）；

最后看按钮：
testing/react-basics/src/App.js
<button
className=,ui button'
type='submit'
disab1ed=(submitDisabled]

Add item
</button>

我们在按钮上设置了 disabled属性。submitDisabled变量在render（）函数的顶部定义，它的
值取决于输入字段是否被填充：
testing/react-basics/src/App.js
render() (
const submitDisabled = !this .state. iz;em;
return(
9
8.5.3 App组件的第一个用例
为了编写第一个用例，需要有两个库：J2和Enzymeo
在上一章中，我们注意到create-react-app在package . json中设置了一些命令，其中一个
就是testo
react-scripts已将Jest指定为依赖项〉要启动Jest,只需运行npm test命令。与create-
react-app创建的其他命令一样，test在ireact-scripts中运行了一个脚本。该脚本配置并执
行 Jesto

若要查看 react-scripts 包含的所有的包，请看./node_modules/react-scripts/

O package. json 文件。

create-react-app 在 App.test. js 中为我们设置了一个虚拟测试°下面从 testing/react-basics

文件夹内部执行Jest,并看看会发生什么c
$ npm test

Jest运行，生成了一个格式良好的测试套件的结果报告 （见图8-9）。