Как написать модульный тест для ipcRenderer.on и ipcRenderer.send в Jest? - PullRequest
0 голосов
/ 27 января 2020

Привет, я разрабатываю проект с использованием Electron и React,

У меня есть форма на стороне реакции, которая при отправке вызывает метод ipcRenderer.on an ipcRenderer.send.

У меня есть сложность написания кода модульного теста для функции отправки формы. функция выглядит следующим образом.

  handleFormSubmit = () => {
    const ethData = this.state.data;
    ipcRenderer.on('asynchronous-reply', (event, arg) => {
      if (arg === 'success') {
        this.setState({ status: true });
      }
    });
    ipcRenderer.send('update', value);
  }

Сначала я просто хотел проверить, что при нажатии кнопки сохранения вызывается функция handleFormSubmit. Я написал следующее:

it('calls handleFormSubmit method when the form is submitted', () => {
  const instance = wrapped.instance();
  wrapped.find('button').simulate('click');
  expect(instance.handleFormSubmit()).toHaveBeenCalled();
});

Я получаю ошибку:

Ошибка типа: не удается прочитать свойство 'on' из неопределенного.

1 Ответ

1 голос
/ 27 января 2020

Вот решение для модульного теста:

index.jsx:

import React, { Component } from 'react';
const { ipcRenderer } = require('electron');

class SomeComponent extends Component {
  constructor(props) {
    super(props);
    this.state = { data: '', status: false };
  }
  handleFormSubmit = () => {
    const ethData = this.state.data;
    const value = 'value';
    ipcRenderer.on('asynchronous-reply', (event, arg) => {
      if (arg === 'success') {
        this.setState({ status: true });
      }
    });
    ipcRenderer.send('update', value);
  };
  render() {
    return <form onSubmit={this.handleFormSubmit}></form>;
  }
}

export default SomeComponent;

index.test.jsx:

import { shallow } from 'enzyme';
import React from 'react';
import SomeComponent from '.';
const { ipcRenderer } = require('electron');

jest.mock(
  'electron',
  () => {
    const mElectron = { ipcRenderer: { on: jest.fn(), send: jest.fn() } };
    return mElectron;
  },
  { virtual: true },
);

describe('59934084', () => {
  let wrapper;
  beforeEach(() => {
    wrapper = shallow(<SomeComponent></SomeComponent>);
  });
  it('should render', () => {
    expect(wrapper.exists).toBeTruthy();
  });

  it('should handle submit, set status to true', () => {
    ipcRenderer.on.mockImplementationOnce((event, callback) => {
      callback(event, 'success');
    });
    wrapper.find('form').simulate('submit');
    expect(wrapper.state('status')).toBeTruthy();
    expect(ipcRenderer.on).toBeCalledWith('asynchronous-reply', expect.any(Function));
    expect(ipcRenderer.send).toBeCalledWith('update', 'value');
  });
  it('should handle submit without setting status to true', () => {
    ipcRenderer.on.mockImplementationOnce((event, callback) => {
      callback(event, 'failure');
    });
    wrapper.find('form').simulate('submit');
    expect(wrapper.state('status')).toBeFalsy();
    expect(ipcRenderer.on).toBeCalledWith('asynchronous-reply', expect.any(Function));
    expect(ipcRenderer.send).toBeCalledWith('update', 'value');
  });
});

Результаты модульного теста со 100% покрытием:

 PASS  src/stackoverflow/59934084/index.test.jsx (14.089s)
  59934084
    ✓ should render (22ms)
    ✓ should handle submit, set status to true (14ms)
    ✓ should handle submit without setting status to true (4ms)

-----------|----------|----------|----------|----------|-------------------|
File       |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
-----------|----------|----------|----------|----------|-------------------|
All files  |      100 |      100 |      100 |      100 |                   |
 index.jsx |      100 |      100 |      100 |      100 |                   |
-----------|----------|----------|----------|----------|-------------------|
Test Suites: 1 passed, 1 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        16.114s, estimated 19s

Вам не нужно передавать опции { virtual: true } методу jest.mock(), если вы установили модуль узла electron. Просто удали это. Причина, по которой я использую эту опцию, заключается в том, что я не устанавливаю модуль узла electron и делаю пример для вас.

Исходный код: https://github.com/mrdulin/jest-codelab/tree/master/src/stackoverflow/59934084

...