Пользовательские стили для тестирования UI материалов - PullRequest
0 голосов
/ 16 июня 2020

Я изо всех сил пытаюсь придумать разумный способ утверждать, что данный стиль будет добавлен в компонент Material-UI, когда задано данное свойство

import makeStyles from "@material-ui/core/styles/makeStyles";

const useStyles = makeStyles({
  myRoot: props => props.inverse && {
    border: "2px solid red",
  },
})

const MyTextInput = ({ inverse, ...otherProps }) => {
  const classes = useStyles({ inverse });
  return (
    <TextField
      label="Standard secondary"
      color="secondary"
      classes={{
        root: classes.myRoot,
      }}
    />
  );
}


// with inverse
<MyTextInput
  label="Standard secondary"
  color="secondary"
  inverse={true}
/>

// without inverse prop
<MyTextInput
  label="Standard secondary"
  color="secondary"
/>

Есть ли разумный способ проверить, что был применен правильный класс?

Я замечаю, что когда я визуализирую компонент несколько раз, className + число будет добавлено ко всем экземплярам, ​​например makeStyles-myRoot-*.

Есть ли способ подтвердить, что был применен правильный стиль?

Я использую react-testing-library, если это помогает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...