Столкнувшись с проблемой при написании кода селена для веб-страницы

Question

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

Когда мы выбираем параметры из первого списка, появляется второй список.https://www.mercurymagazines.com/pr1/100/10000

Я попробовал ниже в коде транспортира для выбора элемента

element(by.cssContainingText('option', '20,000-49,999')).click();
element(by.cssContainingText('option', 'Computers/Internet/Tech')).click();

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

Нужна помощь в автоматизации второй страницы сайта с использованием селена или транспортира.

Answer 1

Попробуйте следующие варианты.В приведенном ниже подходе вам не нужно нажимать на раскрывающийся список и выбирать значение.

const industry = element(by.css('div.form-group.industry > span'));
const companySize =  element(by.css('div.company-size > span'));

companySize.sendKeys('20,000-49,999');
industry.sendKeys('Computers/Internet/Tech');

Answer 2

Я не думаю, что данный код может выбрать опцию из выпадающего списка. Это выбор опции из HTML-элемента SELECT , но его размер 1 * 1 .

Он настолько мал, что селен рассматривает его как невидимый, и селен не может манипулировать невидимым элементом на веб-странице.

На самом деле расширенные параметры раскрывающегося списка после нажатия динамически добавляются приконец страницы рядом с тегом BODY .

Ваш код должен включать в себя два шага для выбора опции:

1) щелкните раскрывающийся список, чтобы расширить его параметры.

// click on Company Size drop down
element(by.css('div.form-group.company-size')).click();

2) выберите параметр из узла HTML DOM и добавьте динамически в конец страницы.

element(by.cssContainingText(
           'span.select2-container--open[style*="absolute"] li', 
           '20,000-49,999')
).click();