zoukankan      html  css  js  c++  java
  • [React] Use Jest's Snapshot Testing Feature

    Often when testing, you use the actual result to create your assertion and have to manually update it as you make changes to the feature. With Jest snapshot testing, you can let Jest do this part for you and write more tests and features faster and with more confidence. Let's learn about how you can use Jest snapshot testing to improve your own workflow.

    Using different renderer lib:

    import React from 'react'
    import TestUtils from 'react-addons-test-utils';
    import renderer from 'react-test-renderer'
    
    test('jsx', () => {
        const renderer = TestUtils.createRenderer();
        renderer.render(<MyComponent name="John" />);
        const component = renderer.getRenderOutput();
        expect(component).toMatchSnapshot()
    });
    
    test('jsx: example2', () => {
        const component = renderer.create(<MyComponent name="John" />)
        expect(component).toMatchSnapshot()
    })

    So first test eusing 'react-addons-test-utils' lib and second test using 'react-test-renderer' lib.

    Sometime you might will 'expect' lib form npm, but Jest also include global 'expect' function, so to avoid conflict:

    import React from 'react';
    import TestUtils from 'react-addons-test-utils';
    import expectLib from 'expect';
    import expectJSX from 'expect-jsx';
    
    import Box from '../components/Box';
    
    Object.assign({}, expect, expectLib, expectJSX);
    
        it('should rendering the string', () => {
           const renderer = TestUtils.createRenderer();
           renderer.render(<Box color="green" id="2" />);
           const result = renderer.getRenderOutput();
           expect(result).toMatchSnapshot()
        });

    So later if you change the Box component, the test will faild. Because the snapshots are not updated, you can simply type 'u' in command line to update the snapshots, then the tests will pass.

  • 相关阅读:
    sudo rm /var/cache/apt/archives/lock sudo rm /var/lib/dpkg/lock
    redis常用命令大全
    MySQL explain使用
    rabbitmq添加user及vhost
    Make sure you've included captcha.urls as explained in the INSTALLATION section on
    django.db.migrations.exceptions.InconsistentMigrationHistory: Migration admin.0001_initial is applie
    ARM实验5 —— 按键中断实验
    ARM实验4—按键轮询实验
    ARM实验3 ——串口实验
    ARM实验2 —— 蜂鸣器实验
  • 原文地址:https://www.cnblogs.com/Answer1215/p/6375828.html
Copyright © 2011-2022 走看看