Protractor translate3d How to?


#1

Hello. I’ve started to write tests for IONIC project. I use protractor. I can not catch the transitions the proper way. Condition Expectorations are implicit(isPreset, IsVisible). Class anchors do not help. Share with your experience.

Regards. Viktor.


#2

This what I’ve done. It does not work as it is designed.

var clickSideMenu = function() {
      var EC = protractor.ExpectedConditions;
      var body = element(by.css('body'));
      return helpers.hasClass(body, 'menu-open')
        .then(function(contains) {
          if (contains) {
            var waitFor = EC.not(function() {
              return helpers.hasClass(body, 'menu-open');
            });
            console.log('+present');
          }
          else {
            var waitFor = function() {
              return helpers.hasClass(body, 'menu-open');
            };
            console.log('not present');
          }
          var link = element(by.css('.ion-navicon'));
          var linkIsClickable = EC.elementToBeClickable(link);
          return browser.wait(linkIsClickable, 100000)
            .then(function() {
              link.click();
              return browser.wait(waitFor, 5000);
            });
        });
    };

#3

what do you want to test?

first keep in mind that unit tests are more important than e2e-test.
i would run protractor tests only for basic functionalities and maybe check if all navigation-conzepts are working (linking in a sidemenu and so on).

your code looks a little complex.
If you want to wait for an animation to finish… i would set a timeout or browser sleep maybe for 3 seconds… and then simple run my test if i can click the button.

Think simple :wink:


#4

I agree that it should be simple. browser.sleep() does not help. I know that it is unsynchronized. So I used promises also.
I also checked by console. I could not invoke the command - click twice.

element(by.css('.ion-navicon')).click();

waited for 5 seconds

element(by.css('.ion-navicon')).click();

I received:

UnknownError: unknown error: Element is not clickable at point (297, 21). Other element would receive the click: <ion-nav-view name="main" class="view-container" nav-view-transition="ios" nav-view-direction="none" nav-swipe="">...</ion-nav-view>

I see the button, it is visible but not click-able. I also tried.

EC.elementToBeClickable

It had passed, but the error was invoked.


#5

Are you using viewcaching?
Maybe your selector is wrong or your preselected element is placed in a cachend nav-view-element, now?

I’ve got such error because of view caching… protractor search the element in the wrong nav-view or ion-view


#6

Maybe.
I tried to get different object with same locator, and the common object for two calls. But same errors are displayed. I used by.css. I hope it looks in the DOM. I heard that IONIC had own cache system of views.


#7

I guess that the driver does not call the click event. It moves an arrow and click. It sends coordinates of the button. But the button has been moved to another place.
I tried also:

browser.actions().mouseMove(link).click();

The same error.


#8

I’ve the related issue with protractor. https://github.com/angular/protractor/issues/1530


#9

nice keep me up to date