Проблемы при использовании Chosen Selector во внешних вспомогательных функциях - PullRequest
3 голосов
/ 08 мая 2019

Я использую Testcafe для тестирования веб-сайта, который использует плагин jquery Chosen и Я хочу сделать утверждение в своем тестовом коде в зависимости от значения, возвращаемого внешней вспомогательной функцией (getSelectedOption).

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

Когда я использую код функции в моем тесте, все работает нормально. Кажется, что функция не имеет реального состояния данных HTML и не может видеть, что элемент уже выбран.

Это фрагмент кода теста:

await t
 .click(await getOptionByText('salutation', 'Frau'))
 .expect(await getSelectedOption('gender')).eql('weiblich')

Это фрагмент из внешних функций:

export const getChosenSelectorFromName = selectName => `#${selectName}_chosen`;

        export const getSelectedOption = async selectName => {
          const selectedOptionText = await 
     Selector(getChosenSelectorFromName(selectName))
            .find('.chosen-single')
            .innerText;
          return selectedOptionText.toLowerCase().trim()
        };

        export const getOptionByText = async (selectName, optionText) => {
          const chosenSelectorString = getChosenSelectorFromName(selectName);
          await t.click(Selector(chosenSelectorString));
          return await Selector(chosenSelectorString)
            .find('.chosen-drop')
            .find('li')
            .withText(optionText);
        };

Когда я использую подобный код, например, функцию getSelectedOption внутри моего теста, все работает нормально:

const genderSelect = Selector('#gender_chosen);

.click(await getOptionByText('salutation', 'Frau'))
       .expect(genderSelect.innerText).eql('WEIBLICH')

1 Ответ

3 голосов
/ 08 мая 2019

Если вы звоните await Selector(<some value>), TestCafe немедленно повторяет данные с веб-страницы в текущий момент. Вы можете указать TestCafe повторять данные с веб-страницы, пока они не станут равны ожидаемому значению. Для этого вам нужно переместить функцию манипуляции DOM в ClientFunction:

import { Selector, ClientFunction } from "testcafe";

fixture `Fixture`
        .page('https://harvesthq.github.io/chosen/');

const getChosenSelectorFromName = selectName => `#${selectName}_chosen`;

const getSelectedOption = ClientFunction(selector => {
    var choosenDiv    = document.querySelector(selector);
    var singleValueEl = choosenDiv.querySelector('.chosen-single');

    return singleValueEl.innerText;
});


test('test', async t => {
    await t.expect(getSelectedOption('.chosen-container')).eql('Choose a Country...');
}); 
...