测试用例React with Node js

时间:2019-09-20 10:48:51

标签: node.js reactjs mocha enzyme

我的网站正在使用react和node。为此,我在反应端使用酶创建了测试用例,并从服务器站点使用了Mocha。当我使用终端命令(npm测试)时,两者都正常工作,其显示失败和成功结果。但是我想从ui接口进行测试用例。

基本上我想使用一个命令来支持(nodejs)函数,现在我的测试用例在不同的终端上工作例如,对于react,我在一个终端中打开,对于节点侧测试用例,我选择了另一个终端。

这是我的节点端代码:-

const request = require('supertest');
const expect = require('chai').expect;
const req = 'http://localhost:3000';
 this.user_id = '';

describe('Register form', function() {
    it('User saved successfully in database', function(done) {
        request(req)
           .post('/users/register')
           .set('Accept', 'application/json')
           .set('Content-Type', 'application/json')
           .send({user:{disabled: false,
                    email: "dineshsharma.developer@gmail.com",
                    firstName: "test",
                    lastName: "test",
                    password: "24234234ds",
                    roles: "hr",
                    status: "verified"}})
           .expect(200)
           .expect('Content-Type', /json/)
           .expect(function(response) {
           })
           .end(done);
    }); 
});

这是响应代码:-

import React from 'react';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import Select from 'react-select'
import config from 'config';
import { Alert } from 'reactstrap';
import { userActions } from '../../../src/actions';

import Enzyme, {shallow,mount,render,unmount} from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import RegisterPage from '../../../src/features/RegisterPage/RegisterPage';
import { MemoryRouter } from 'react-router-dom';

Enzyme.configure({adapter: new Adapter()});

describe('In register page check react syntex', () => {
  it('Should RegisterPage shallow correctly in "debug" mode', () => {
    const component = (<RegisterPage debug />);
    expect(component).toMatchSnapshot();
  });
}); 

describe('On register page count input filed', () => {
     it('Total text filed', () => {
      expect(shallow(<RegisterPage />).find('input[type="text"]').length).toEqual(2)
     })
    it('Total email filed', () => {
      expect(shallow(<RegisterPage />).find('input[type="email"]').length).toEqual(1)
     })
    it('Total checkbox filed', () => {
      expect(shallow(<RegisterPage />).find('input[type="checkbox"]').length).toEqual(1)
     })
    it('Total radio filed', () => {
      expect(shallow(<RegisterPage />).find('input[type="radio"]').length).toEqual(2)
     })
}); 


describe('On Register page check firstname , lastname or email address vaildation', () => {  
  it('Check first name in registerpage ', () => {
   const wrapper = mount(<RegisterPage />);
   wrapper.find('input[name="firstName"]').simulate('change', {target: {name: 'firstName', value: 'dinesh'}}); 
   expect(wrapper.state().user.firstName).toEqual('dinesh');    
  })

  it('Check lastname in register page ', () => {
   const wrapper = mount(<RegisterPage />);
   wrapper.find('input[name="lastName"]').simulate('change', {target: {name: 'lastName', value: 'Sharma'}});
   expect(wrapper.state().user.lastName).toEqual('Sharma');   
  })

  it('Check email address in register page', () => {
  const wrapper = mount(<RegisterPage />);
  wrapper.find('input[name="email"]').simulate('change', {target: {name: 'email', value: 'dineshsharma.developer@gmail.com'}});
  expect(wrapper.state().user.email).toEqual('dineshsharma.developer@gmail.com');   
  })

})

1 个答案:

答案 0 :(得分:1)

如果要在一个终端中同时运行前端和后端测试,则可以修改package.json脚本部分,使其看起来像这样。

{
    "scripts": {
        "test": "mocha <path to node test files> && jest <path to react test files>"
    }
}

每次运行npm test时,两组测试都会运行。