Нажатие раскрывающегося списка в тест-кафе - PullRequest
Новая
       7

Нажатие раскрывающегося списка в тест-кафе

1 голос
/ 23 апреля 2020

Я использую testcafe в приложении React, и у меня возникают некоторые проблемы с тем, чтобы testcafe щелкнул опцию раскрывающегося меню в раскрывающемся меню Reach.

Я могу получить доступ к этой опции с помощью Selector после нажатия на кнопку кнопка, которая активирует выпадающее меню, но щелчок нужной опции, похоже, ничего не делает.

Однако действие запускается, если я достигаю эту опцию с помощью клавиш. 

//This works
await t
    .click('[testid="menuButton"]')
    .pressKey('down')
    .pressKey('down')
    .pressKey('enter'); 

//This doesn't
  await t
    .click('[testid="menuButton"]')
    .click('[data-reach-menu-item]:nth-of-type(3)');

Я убедился, что выбор сделан правильно во втором случае, так что это не проблема.

Есть мысли?

Спасибо!

1 Ответ

2 голосов
/ 23 апреля 2020

Этот тест успешно выполнен на моей стороне: 

import { Selector } from 'testcafe';

fixture `fixture 1`
    .page `https://reacttraining.com/reach-ui/menu-button/`
test('test', async t => {
    await t
        .click('[data-reach-menu-button]')
        .click('[data-reach-menu-item]:nth-of-type(3)');
})

Возможно, на вашей странице более одной кнопки меню, поэтому '[data-reach-menu-item]: nth-of- Тип (3) 'селектор указывает на невидимый элемент. Чтобы проверить это, вставьте .debug () после .click ('[testid = "menuButton"]') в свой код: 

  await t
    .click('[testid="menuButton"]')
    .debug()
    .click('[data-reach-menu-item]:nth-of-type(3)');

После того, как тестовый код остановится на debug (), откройте разработку браузера консоли, выполните команду document.querySelectorAll('[data-reach-menu-item]:nth-of-type(3)') и проверьте, соответствует ли первый возвращаемый узел третьему элементу в раскрывающемся меню.

...