0

可以react-native-testing-library找到使用 ? 创建的警报Alert.alert()？

我的应用程序按预期创建警报，但此测试失败：

// test

const Wrapper = props => (
  <Fragment>
    <SubscriptionProductDetailScreen
      product={product}
      testID={"SUBSCRIPTION_DETAIL_SCREEN"}
      addToCart={addToCartSpy}
      {...props}
    />
  </Fragment>
);

function createWrapper(customProps) {
  const wrapper = render(<Wrapper {...customProps} />);
  return wrapper;
}

beforeEach(() => {
  wrapper = createWrapper();
});

// later, inside a describe block:

  it('should show an alert if no bars are selected', async () => {
    pressSubmitButton()
    expect(addToCartSpy).not.toHaveBeenCalled()

    // const alert = await waitForElement(
    //   wrapper.queryByText("Please select up to 4 free items.")
    // )

    const alert = wrapper.queryByText("Please select up to 4 free items.")
    expect(alert).not.toBeNull()
  });

// brief excerpt from the component (the onPress handler for the submit button)

  addToCart() {
    const freeItems = this.state.items[0]

    if (!freeItems || !freeItems.selections.length) {
      Alert.alert("Error", "Please select up to 4 free items.")
      return
    }

    const item: {...}
    this.props.addToCart(item)
  }

异步版本（waitForElement，评论）也失败了。

同样，警报在应用程序本身中起作用，并且由处理程序调用的调度操作通过的断言。

4

1 回答 1

1

Alert不在 React 应用程序堆栈中 - 它是系统功能，因此无法直接使用react-native-testing-library. 但是，您至少可以验证它是否已执行：

import { Alert } from 'react-native'

jest.mock('react-native', () => {
    const RN = jest.requireActual('react-native')

    return Object.setPrototypeOf(
        {
            Alert: {
                ...RN.Alert,
                alert: jest.fn(),
            },
        },
        RN,
    )
})


test('...', () => {
    // ...

    expect(Alert.alert).toHaveBeenCalled()
})
于 2020-04-26T21:12:33.623 回答