Как смоделировать функции ipcRenderer.on внутри функциональных компонентов React - PullRequest
2 голосов
/ 22 сентября 2019

Я пишу приложение Electron, использую React для внешнего интерфейса и JEST + React Testing Library для запуска тестов.У меня есть следующий упрощенный код в модуле:

import React from 'react';
import { ipcRenderer } from 'electron';
import Paper from '@material-ui/core/Paper';
import LinearProgress from '@material-ui/core/LinearProgress';


const AccountCheckModule = () => {

  const [listingsCount, setListingsCount] = React.useState(0);

  React.useEffect(() => {
    ipcRenderer.on('count-listings', (event, count) => {
      setListingsCount(count);
    });

    ipcRenderer.send('count-listings');

    // Cleanup the listener events so that memory leaks are avoided.
    return function cleanup() {
      ipcRenderer.removeAllListeners('count-listings');
    };
  }, []);

  return (
    <Paper elevation={2} data-testid="paper">
        <p
          className={classes.listingsNumberTracker}
          data-testid="free-listings-counter"
        >
          Free listings: {listingsCount}/100
        </p>
        <BorderLinearProgress
          className={classes.margin}
          variant="determinate"
          color="secondary"
          value={listingsCount}
          data-testid="border-linear-progress"
        />
    </Paper>
  );
};

export default AccountCheckModule;

По сути, React.useEffect() запускается один раз, вызывает ipcRenderer.send('count-listings'); и настраивает прослушиватель для ожидания ответа от основного процесса.Основной процесс отвечает числом подсчета списков, и когда получено, используется для обновления состояния listsCount -> setListingsCount(count)

Возможно ли смоделировать эту функцию слушателя, чтобы вернуть число подсчетов, используя Jest.

ipcRenderer.on('count-listings', (event, count) => {
      setListingsCount(count);
    });

Если да, как бы вы достигли этого?

...