Jest.js getAllByRole在react本机测试库中找不到输入元素

imzjd6km 于 12个月前发布在 Jest

关注(0)|答案(1)|浏览(130)

我有一个简单的组件，有两个输入和一个按钮。我能够用getAllByRole func测试按钮的代码。但是当我想找到输入元素时，我得到了下面的错误：

Unable to find an element with role: "textbox"

这是我的代码：

import React from "react";
import { View, TextInput, Button } from "react-native";

const ListComp = () => {
    return (
        <View>
            <TextInput />
            <TextInput />
            <Button title="Test"/>
        </View>
    )
}

export default ListComp;

这是测试文件：

import React from 'react';
import ListComp from './ListComp';
import {
    render,
    screen,
} from '@testing-library/react-native';

test('renders correctly', () => {
    render(<ListComp />);
    expect(screen.getAllByRole('textbox')).toHaveLength(2);
});

jestjs

来源：https://stackoverflow.com/questions/77204000/getallbyrole-does-not-find-input-element-in-react-native-testing-library

1条答案

按热度按时间

5gfr0r5j1#

GetByRole使用prop“accessibilityRole”。你的TextInputs似乎没有一个，所以它不会工作。按钮默认情况下有一个，但这并不适用于每个元素。添加accessibilityRole应该可以解决您的问题。然而，根据文档，似乎没有“textBox”的作用：https://reactnative.dev/docs/accessibility .您可以添加accesibilityLabel并使用getAllByLabelText：

const ListComp = () => {
    return (
        <View>
            <TextInput accessibilityLabel ="textbox" />
            <TextInput accessibilityLabel ="textbox" />
            <Button title="Test"/>
        </View>
    )
}

尽管你可能想考虑添加一个placeHolderText并通过它来实现：screen.getByPlaceholderText()。

赞(0）回复(0）举报 12个月前

我来回答

Jest.js getAllByRole在react本机测试库中找不到输入元素

1条答案

相关问题

热门标签

最新问答