Question

我将react-native-testing-library与"@testing-library/jest-dom/extend-expect"一起使用。

看起来像toBeVisible只能与ReactJS一起使用：

const nameField = component.getByPlaceholder("Name");
expect(nameField).toBeVisible();

// Test Error:
● NewCustomerScreen › the basics › encountered a declaration exception

    expect(received).toBeVisible()

    received value must be an HTMLElement or an SVGElement.
    Received has type:  object
    Received has value: {"_fiber": {"_debugHookTypes": null, "_debugID": 26, "_debugIsCurrentlyTiming": false, "_debugOwner": [FiberNode], "_debugSource": null, "alternate": null, "child": [FiberNode], "childExpirationTime": 0, "contextDependencies": null, "effectTag": 133, "elementType": [Function Component], "expirationTime": 0, "firstEffect": null, "index": 1, "key": null, "lastEffect": null, "memoizedProps": [Object], "memoizedState": null, "mode": 0, "nextEffect": [FiberNode], "pendingProps": [Object], "ref": [Function ref], "return": [FiberNode], "sibling": null, "stateNode": [Component], "tag": 1, "type": [Function Component], "updateQueue": null}}

有办法使它工作吗？

Answer 1

您可以使用

Here，您可以看到与此相关的说明。

import { render } from 'react-native-testing-library';
...
const { getByPlaceholder } = render(
  <View>
    <TextInput placeholder="Name"  />
  </View>
);
..
expect(getByPlaceholder("Name")).toBeVisible();

可见的示例

<View>
  <View testID="not-empty">
    <Text testID="empty" />
  </View>
  <Text testID="visible">Visible Example</Text>
</View>;

expect(queryByTestId(baseElement, 'not-empty')).not.toBeEmpty();
expect(getByText(baseElement, 'Visible Example')).toBeVisible();

如何在React Native中使用toBeVisible匹配器

1 个答案: