如何访问react-testing-library中的prop值

Question

我一直在为我的alert.js 编写测试。我需要访问 prop 值来测试其严重性。我尝试了很多事情。但每次都失败了。

import React from 'react';
import PropTypes from 'prop-types';
import { Snackbar } from '@material-ui/core';
import { Alert as MuiAlert } from '@material-ui/lab';

const Alert = (props) => {
    return (
        <Snackbar
            open={props.open}
            autoHideDuration={3000}
            onClose={props.onClose}
            data-testid='component-alert'
        >
            <MuiAlert
                onClose={props.onClose}
                severity={props.severity}
                data-testid='alert-message'
            >
                {props.message}
            </MuiAlert>
        </Snackbar>
    );
};

Alert.propTypes = {
    message: PropTypes.string.isRequired,
    severity: PropTypes.oneOf(['error', 'warning', 'info', 'success'])
        .isRequired,
    open: PropTypes.bool.isRequired,
    onClose: PropTypes.func.isRequired,
};

export default Alert;

从'@testing-library/react'导入{渲染，清理}；从“../Alert”导入警报；

const mockFunc = jest.fn(); const defaultProps = { 消息：'abc'，严重性：'错误'，打开：true，onClose：mockFunc，};

test('render correct severity', () => {
    render(<Alert {...defaultProps}/>)
    //How to access severity prop value here
});

});

Answer 1

您无法访问属性

React 测试库用于像人类一样与 React 组件进行交互。人类看到的只是 React 组件渲染的 HTML

您必须查找 HTML 元素来检查严重性