Подтвердить что ты не робот

Элемент не отображается ошибка (не удалось щелкнуть элемент)

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

HTML-код:

<div class="small-checkbox red-theme raleway-regular text-muted2 position-relative">

        <div class="city-checkbox inline-block position-relative" ng-class="{'rounded-checkbox': main.current_city_id == 1, 'mb-20': main.ifDeviceIsPhone}">
            <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect mh-20" for="mumbaiCity" ng-class="{'is-checked' : main.current_city_id == 1}">
                <input type="radio" id="mumbaiCity" class="mdl-radio__button position-relative vertical-middle" name="city" value="1" ng-click="main.setCity('Mumbai', 1)">
                <span class="mdl-radio__label position-relative font15"><img class="city-icon" src="../../../assets/img/cities/mumbai-icon.png">Mumbai</span>
            </label>
        </div>
</div>

Tesstcase:

// demo-test.js
describe('Protractor Demo App', function() {
    jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000000;

    it('check item count', function() {
        browser.get('<link>');
        element(by.id('mumbaiCity')).click();
    });

});

Этот тест проходит через ошибку:

1) Показатель счетчика демонстраций пробника Protractor

Сообщение:

Сбой: элемент не отображается

Я также пробовал:

element(by.css('[ng-click="main.setCity('Mumbai', 1)"]')).click();

Он дает ошибку:

[16:16:26] E/launcher - Ошибка: SyntaxError: отсутствует) после списка аргументов

Пожалуйста, предложите, как будет переключаться радиокнопка?

4b9b3361

Ответ 1

Это довольно распространенная проблема автоматизации тестирования с селеном.

Вот общие решения:

  • убедитесь, что элемент, который вы хотите щелкнуть, действительно отображается. Иногда вам нужно сделать дополнительные действия на странице, чтобы сделать элемент видимым. Например, откройте раскрывающийся список для появления опции или откроется меню для подменю, которое будет отображаться
  • wait для visibility элемента:

    var EC = protractor.ExpectedConditions;
    var mumbaiCity = element(by.id('mumbaiCity'));
    browser.wait(EC.visibilityOf(mumbaiCity), 5000);
    mumbaiCity.click();
    
  • существует еще один элемент с тем же самым id, который фактически невидим. В этом случае вам нужно улучшить свой локатор, чтобы он соответствовал этому конкретному элементу. Например:

    element(by.css(".city-checkbox #mumbaiCity")).click();
    element(by.css(".city-checkbox input[ng-click*=Mumbai]")).click();
    
  • Или, если у вас есть несколько элементов, соответствующих одному и тому же локатору, вы можете "filter" из видимого элемента:

    var mumbaiCity = element.all(by.id('mumbaiCity')).filter(function (elm) {
        return elm.isDisplayed().then(function (isDisplayed) {
            return isDisplayed;
        });
    }).first();
    mumbaiCity.click();
    
  • перейдите к элементу, а затем нажмите browser.actions():

    var mumbaiCity = element(by.id('mumbaiCity'));
    browser.actions().mouseMove(mumbaiCity).click().perform();
    
  • прокрутите страницу в вид, а затем нажмите:

    var mumbaiCity = element(by.id('mumbaiCity'));
    browser.executeScript("arguments[0].scrollIntoView();", mumbaiCity.getWebElement());
    mumbaiCity.click();
    
  • щелкните через javascript (остерегайтесь различий):

    var mumbaiCity = element(by.id('mumbaiCity'));
    browser.executeScript("arguments[0].click();", mumbaiCity.getWebElement());
    
  • иногда вам нужно просто увеличить окно браузера:

    browser.driver.manage().window().maximize();