reactjs - 用于反应应用程序的 http-backend-mock 和 ngE2e 的替代方案

Question

目前，我一直在使用带有量角器的 ngMockE2e 和 httpbackend 模拟来制作角度页面。

现在我们正在考虑使用 react 进行开发，是否有任何替代方法可以用于模拟 http 调用的端到端测试。

Answer 1

您可以使用 chai 和 chai-http。

'use strict';

import React from 'react';
import {Provider} from 'react-redux';
import {mount} from 'enzyme';
import {expect} from 'chai';
import configureMockStore from 'redux-mock-store';

import AppCtrl from '../ui-src/components/app.ctrl';

const mockStore = configureMockStore();

describe('mount(<AppCtrl />)', () => {
  let store = mockStore({data1: {}});
  const wrapper = mount(
    <Provider store={store}>
      <AppCtrl />
    </Provider>
  );
  expect(wrapper.find(AppCtrl).length).to.equal(1);
  const container = wrapper.find(AppCtrl);
  it('checks div count', () => {
    expect(container.find('div').length).to.equal(4);
  });
  it('checks br count', () => {
    expect(container.find('br').length).to.equal(6);
  });
  it('checks props.Data1', () => {
    expect(container.props('Data1')).to.be.empty;
  });
  it('checks text contains', () => {
    expect(container.text()).to.contain('React Version');
  });
});

'use strict';

import chai, {expect} from 'chai';
import chaiHttp from 'chai-http';
// import sinon from 'sinon';

chai.use(chaiHttp);

describe('server test with chai-http', () => {
  it('checks get /', () => {
    chai.request('../js/server').get('/')
      .end(function (err, res) {
         expect(err).to.be.null;
         expect(res).to.have.status(200);
      });
  });
  it('checks get /routes/getData', () => {
    chai.request('../js/server').get('/routes/getData')
      .end(function (err, res) {
        expect(err).to.be.null;
        expect(res).to.have.status(200);
        expect(res).to.have.header('content-type', 'application/json; charset=utf-8');
        expect(res).to.have.header('content-length', '93');
        expect(res).to.be.json;
        console.log('res: ', res.headers);
      });
  });
});