Re: how to test if an element exists in DOM in E2E tests

4,742 views
Skip to first unread message

Amir H. Hajizamani

unread,
Apr 30, 2013, 2:09:50 PM4/30/13
to ang...@googlegroups.com
Try:

expect(element(".logout-button:visible").count()).toBeGreaterThan(0)

Full list of E2E DSL matchers here: https://github.com/angular/angular.js/blob/master/src/ngScenario/matchers.js

On Tuesday, 30 April 2013 16:26:49 UTC+1, Kailuo Wang wrote:

In my angular e2e test I would like to be able to tell if an element exists on the DOM, it's not an test expectation, just a condition I need.

I tried to do

 element(".logout-button:visible").count() > 0

but count() returns a future and won't work outside an expect(). It seems that there is no way to add a callback when it resolves.

I tried to do

element(".logout-button:visible").query(element, callback)

But this one throws an exception when the element does not exist without bothering to go into my callback function. So how should I achieve this rather simple task?

Thanks!

Kailuo Wang

unread,
Apr 30, 2013, 2:25:51 PM4/30/13
to ang...@googlegroups.com
Thanks for the reply, Amir. Sorry I didn't make it clear, but I don't want to run this in a expectation. In my test, this element(".logout-button:visible")could be hidden, and that's fine, I just need to do something else in that scenaria rather than having a exception or expectation fail. 
I would like to do something like 
if element(".logout-button:visible").count() > 0
  doSomething()
else
  doSomethingElse()

But that  element(".logout-button:visible").count() doest not return the value outside a expect(), it is a future.
any ideas?




--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/8Xouya_8lB4/unsubscribe?hl=en-US.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Amir H. Hajizamani

unread,
Apr 30, 2013, 2:45:56 PM4/30/13
to ang...@googlegroups.com
Ah, sorry, didn't read your post properly! 

I've had similar problems in my tests and solved most of them using the query API. How about this:  if that element is always on the page but just sometimes hidden, make your selection pick it out regardless of visibility ( so element('.logout-button')) and then use the native API of the DOM element that gets passed to your callback to perform your conditional. So something like:

element('.logout-button').query(function(buttonElement, done) {

  // buttonElement is nothing special, a pure DOM element object so ...
  if (buttonElement.style.display === 'none') { // Or other test, depending on how your element becomes invisible
    actionForHidden();
  else {
    actionForVisible();
  }

  done();  // required boilerplate for query

});

Kailuo Wang

unread,
Apr 30, 2013, 4:05:13 PM4/30/13
to angular
Thanks again for the reply, Amir. I tried this solution but got a "can't call display on undefined" error. And I can't call console.log(buttonElement) either, it throws a "TypeError: Converting circular structure to JSON". So I don't know what's returned as the buttonElement although a manual inspect shows that the .logout-button is in the DOM. Even if this approach works, it's going to be tired with how the element is hidden (it could be hidden at a higher level)
I feel that there should be an easier way to do it right. The element(".logout-button:visible").count() approach works in the an expect method, it's frustrating that there is no obvious way to use this count() in a slightly different way.

Thanks anyway, maybe I should dig into the expect code.

Amir H. Hajizamani

unread,
Apr 30, 2013, 6:33:55 PM4/30/13
to angular
Not sure what those errors are about withouting seeing some code, but yes you're right that this isn't an ideal situation, especially tying the implementation of to a high level test. Straying from the expected/designed way of doing things in the E2E scenario tests quickly makes things very difficult. If you find a better solution, please post it. 

I assume you've already considered writing separate tests that go through the different flows you're trying to cover using the conditional?

Kailuo Wang

unread,
May 1, 2013, 2:38:04 PM5/1/13
to angular

Thanks Amir. I haven't find any elegant solution yet but I will keep you posted. 
 We are not really testing two scenarios. The logic we need here is to login to our app before performing e2e tests. The login is needed only once for one run, so I am trying to write the logic to do the login only when it's not logged in yet, that is, the "log out" button isn't present on the page. Nothing really complicated or uncommon here, I am surprised that solution isn't documented anywhere on the Internet yet. 

PowerKiKi

unread,
May 30, 2013, 4:54:34 AM5/30/13
to ang...@googlegroups.com
Hi,

We have the exact same case: trying to login if not already logged in, based on existence of logout button. 

Did you find a way to solve it ?

Cheers,

Adrien

Kailuo Wang

unread,
May 30, 2013, 9:13:14 AM5/30/13
to angular

No. According to a member from angular, you will have to write scenario dsl. But they also said they are going to re write the end to end framework from scratch. So I stopped investing on it

--
Reply all
Reply to author
Forward
0 new messages