как отключить все переходы в пользовательском интерфейсе материала во время тестирования - PullRequest
Новая
       10

как отключить все переходы в пользовательском интерфейсе материала во время тестирования

0 голосов
/ 22 сентября 2019

Я поддерживаю приложение реагирования, которое использует Material UI и набор тестов BDD на основе селена поверх приложения.Я обнаружил, что некоторые из моих тестов периодически терпели неудачу на отсутствующих / сломанных селекторах CSS, которые предназначались для элементов, которые не присутствовали сразу из-за материальных компонентов пользовательского интерфейса, выполняющих переходы при открытии.

Я смог отключить переходы, тольково время тестирования, используя довольно простое решение.Вы не поверите ответ ...

1 Ответ

0 голосов
/ 22 сентября 2019

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

const theme = {
    transitions: { create: () => 'none' }
}
  • В наборе BDD я установил определенный пользовательский агент.
  • В файл, который создает тему Material UI, я просто добавляю строку отключения, если пользовательский агент указывает, что это тест BDD.

Так что соберите все это вместе в файле, где вы определяете свой Matuerial UItheme: 

import { createMuiTheme } from '@material-ui/core/styles'

const bddUserAgentString = 'BDD Test'
const isBddRunning = () => global.navigator.userAgent === bddUserAgentString

const theme = createMuiTheme({
  palette: '... omitted ...',
  shadows: '... omitted ...',
  spacing: '... omitted ...',
  typography: '... omitted ...',
  ...(isBddRunning() && { transitions: { create: () => 'none' } }),
})

export default theme

Если этот синтаксис оператора распространения '...' сбивает с толку, посмотрите здесь: Справочник по синтаксису ES6: используйте распространение и логическое короткое замыкание для условного добавления полей в объект во время объявления

...