测试组件中的条件-JEST + React Testing Library

Question

我为已集成到另一个组件中的React组件编写一些单元测试。结构是ParentComponent，而我要测试的组件是Notice组件。 Notice内部的文本是有条件的。该组件的其他部分未被测试覆盖，我不知道如何覆盖它。

代码

<Notice
            content={
              <span style={{ display: 'block', marginBottom: '30px' }}>
                {i18n('cardRenewal.success.message.referenceText')}{' '}
                <b>{props.renewalSuccess.applicationReferenceNumber}</b>
                {` - `}
                {i18n('cardRenewal.success.message.statusText')}
                <b>
                  {props.locale === 'en'
                    ? props.renewalSuccess.StatusDescriptionEn
                    : props.renewalSuccess.StatusDescriptionAr}
                </b>
              </span>
            }
            // icon="auto"
            status={props.type}
            // props.renewalSuccess
            title={
              i18n('cardRenewal.success.message.part1') +
              props.selectedCardForRenewal.cardNo +
              i18n('cardRenewal.success.message.part2')
            }
            tags={props.paymentDetails}
          />

  

props.locale === 'en'的第一部分已覆盖，但第二部分未覆盖。

我已经编写了测试

  it('Text should be arabic when locale = ar', async () => {
    props.locale = 'ar';
    const { container, getByText } = render(
      <MemoryRouter>
        <ViewportProvider>
          <Viewport sm md lg xl>
            <FormTemplate {...props} />
          </Viewport>
        </ViewportProvider>
      </MemoryRouter>,
    );
    await sleep();
    // expect(container.querySelector('.container')).toBeInTheDocument();
    expect(getByText(/Notice/)).toBeInTheDocument();
  });