[React Testing] Children with Shallow Rendering
When testing React components, we often want to make sure the rendered output of the component matches what we expect. With the React Shallow Renderer, we can check the entire rendered output of a component, the children prop, or a subset of the children prop. We can also use 3rd party libraries to check that this element tree includes a specific piece. In this lesson we will walk through examples of each.
import React from 'react';
import expect from 'expect';
import expectJSX from 'expect-jsx';
expect.extend(expectJSX);
import TestUtils from 'react-addons-test-utils';
import LikeCounter from './likeCounter'; describe('like counter', ()=>{ it('should render the like count correctly', ()=>{
const renderer = TestUtils.createRenderer();
renderer.render(<LikeCounter count={5} />);
const actual = renderer.getRenderOutput();
const expected = "Like: 5";
expect(actual).toIncludeJSX(expected);
});
});
[React Testing] Children with Shallow Rendering的更多相关文章
- [React Testing] Intro to Shallow Rendering
In this lesson, we walk through how to use one of React's Test Utilities (from thereact-addons-test- ...
- [React Testing] className with Shallow Rendering
The React Shallow Renderer test utility lets us inspect the output of a component one level deep. In ...
- [React Testing] JSX error diffs -- expect-jsx library
When writing React component tests, it can be hard to decipher the error diffs of broken tests, sinc ...
- 如何使用TDD和React Testing Library构建健壮的React应用程序
如何使用TDD和React Testing Library构建健壮的React应用程序 当我开始学习React时,我努力的一件事就是以一种既有用又直观的方式来测试我的web应用程序. 每次我想测试它时 ...
- React Testing All in One
React Testing All in One React 测试 https://reactjs.org/docs/testing.html jest 26.4 https://jestjs.io/ ...
- [React Testing] Element types with Shallow Rendering
When you render a component with the Shallow Renderer, you have access to the underlying object. We ...
- [React Testing] Conditional className with Shallow Rendering
Often our components have output that shows differently depending on the props it is given; in this ...
- [React & Testing] Simulate Event testing
Here we want to test a toggle button component, when the button was click, state should change, styl ...
- [React & Testing] Snapshot testings
For example we have a React comonent: -- A toggle button, we want to test. When it si toggle on, the ...
随机推荐
- 武汉科技大学ACM :1002: 零起点学算法66——反话连篇
Problem Description 把输入的字符按照反着顺序输出 Input 多组测试数据 每组一行(每组数据不超过200个字符) Output 按照输入的顺序反着输出各个字符 Sample I ...
- 高放的python学习笔记之基本语法
python与c++的不同之处 python的语句块不是用{}括起来的而是冒号后面跟一些与比当前语句多一的tab缩进的语句. 1.定义变量 python的变量类型不需要人为指出,会根据赋值的类型决定此 ...
- c++模板类被继承时他的成员不能被子类看到
c++模板类被继承时他的成员不能被子类看到,必须用限定的符号 this->foo 或者 baseclass::foo,或者using bassclass::foo. msvc不提示错误,gcc ...
- GetTextMetrics
该函数的参数要求是一个TEXTMETRIC结构体的指针 也就是说我们可以定义一个结构类型的变量 将该变量的地址传递进来 通过该函数就能得到当前字体的信息来填充这个结构体 int CXuexi2View ...
- 命令passwd报错因inode节点处理记录
命令passwd报错因inode节点处理记录故障现象:1.修改密码时报错 passwd: Authentication token manipulation error2.添加用户报错:unable ...
- php代码的一些高效写法
用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量,单引号则不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的“函数”(译注:PHP手册中说 ...
- Properties配置文件
package file; import java.io.FileOutputStream; import java.io.FileReader; import java.io.FileWriter; ...
- d029: 求出2-100之间的所有质数(素数)
内容: 求出2-100之间的所有质数(素数) 输入说明: 无 输出说明: 一行一个素数 /* 质数又称素数.指在一个大于1的自然数中,除了1和此整数自身外,不能被其他自然数(不包括0)整除的数. */ ...
- 《head first python》第一章《初识python》总结
该章主要介绍了python的安装和列表相关 列表主要用了movies做介绍: 1.列表及嵌套列表:movies=["the hodaliy",1975,"zhangyim ...
- UNIX网络进程间通信漫谈(1)
进程间通信 IPC是进程间通信的简称,指的是运行在某个操作系统上的不同进程间各种消息传递方式,在Unix操作系统过去30年的演变史中,消息传递经历了如下几个阶段: 管道,管道是第一个广泛使用的IPC形 ...