Jest React - 否则未采取路径答案

【问题标题】：Jest React - else path not takenJest React - 否则未采取路径
【发布时间】：2020-12-23 19:25:54
【问题描述】：

我正在尝试为此 React 组件添加测试覆盖率，当 if 语句后没有 else 时，我在组件上收到此消息“未采用其他路径”。

以下是带有开玩笑警告的组件。有人可以帮忙介绍这部分吗？

function CustomerSatisfaction(props: FeedbackProps) {
  const [status, setStatus] = useState<
    'idle' | 'active' | 'pending' | 'success' | 'error'
  >('idle');
  const handleSubmit = useCallback(
    async (smileyType: string, options: Record<string, string>) => {
      setStatus('pending');

      try {
        const result = await fetchWithError(() => {
          setStatus('error');
        })('/pub/feedback/feedbacks', 'POST', {
          surveyType: 'service',
          smileyType,
          comments: options.comment,
          ratings: {
            clearness: options['customer_satisfaction.clear'],
            ease: options['customer_satisfaction.easy'],
            speed: options['customer_satisfaction.fast'],
            performance: options['customer_satisfaction.perf'],
          },
          pageUrl: window.location.href,
          serviceId: props.serviceId,
          productId: props.productId,
        });

        **(else path not taken)** if (result.success) {
          setStatus('success');
        }
      } catch (e) {
        setStatus('error');
      }
    },
    [],
  );

  return (
    <CustomerSatisfactionComponent
      i18n={props.i18n}
      status={status}
      onSubmit={handleSubmit}
    />
  );
}

【问题讨论】：

用result.success === false模拟回复
@PatrickRoberts 这样工作 jest.fn().mockResolvedValue({ success: false, })

标签： reactjs jestjs ts-jest jest-fetch-mock

【解决方案1】：

如果有人遇到这个问题，这里是我的情况的解决方案

it('should render failure state', async () => {
    const component = shallow(
      <CustomerSatisfaction
        i18n={() => ({})}
        serviceId="123"
        productId="123"
      />,
    );

    (fetchWithError as jest.Mock).mockReturnValue(
      jest.fn().mockResolvedValue({
        success: false,
      }),
    );
    const onSubmit: any =
      component.find(CustomerSatisfactionComponent).prop('onSubmit') ||
      (() => {});
    await onSubmit('test', {});
    expect(component).toMatchSnapshot();
  });

【讨论】：