javascript - imprimir - Error de elemento no visible(no se puede hacer clic en un elemento)

imprimir html con javascript

Question

Quiero hacer clic en un botón de radio, aparece en una página web. El código es el siguiente:

Código 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();
    });

});

Esta prueba atraviesa el error:

1) Cuenta de elementos de verificación de la aplicación de demostración de Protractor

Mensaje:

Falló: elemento no visible

También probé con:

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

Da error:

[16:16:26] E / launcher - Error: SyntaxError: missing) después de la lista de argumentos

Sugiera, ¿cómo se hará clic en el botón de opción?

Answer 1

Este es un problema bastante común en la automatización de pruebas con selenio.

Aquí están las soluciones comunes:

• asegúrese de que el elemento en el que desea hacer clic esté realmente visible. En ocasiones, debe realizar acciones adicionales en una página para que el elemento sea visible. Por ejemplo, abra un menú desplegable para que aparezca una opción o abra el menú para que aparezca el submenú

• wait la visibility del elemento :

  var EC = protractor.ExpectedConditions;
  var mumbaiCity = element(by.id(''mumbaiCity''));
  browser.wait(EC.visibilityOf(mumbaiCity), 5000);
  mumbaiCity.click();

• Hay otro elemento con la misma id que es realmente invisible. En este caso, debe mejorar su localizador para que coincida con este elemento específico. Por ejemplo:

  element(by.css(".city-checkbox #mumbaiCity")).click();
  element(by.css(".city-checkbox input[ng-click*=Mumbai]")).click();

• O, si tiene varios elementos que coinciden con el mismo localizador, puede "filter" un elemento visible :

  var mumbaiCity = element.all(by.id(''mumbaiCity'')).filter(function (elm) {
      return elm.isDisplayed().then(function (isDisplayed) {
          return isDisplayed;
      });
  }).first();
  mumbaiCity.click();

• mover al elemento y luego hacer clic a través de browser.actions() :

  var mumbaiCity = element(by.id(''mumbaiCity''));
  browser.actions().mouseMove(mumbaiCity).click().perform();

• desplácese a la vista del elemento y luego haga clic en:

  var mumbaiCity = element(by.id(''mumbaiCity''));
  browser.executeScript("arguments[0].scrollIntoView();", mumbaiCity.getWebElement());
  mumbaiCity.click();

• haga clic a través de javascript (aunque tenga cuidado con las differences ):

  var mumbaiCity = element(by.id(''mumbaiCity''));
  browser.executeScript("arguments[0].click();", mumbaiCity.getWebElement());

• a veces, solo necesita maximizar la ventana del navegador :

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