In Protractor, how to check aria-hidden = "true" or "false"

Question

I need to check aria-hidden="true" or "false" depending on the click

 <tr ng-class="{'submitted' : (position.submitted) }" ng-repeat- 
 start="position in demandFactory.openings | orderBy:sortType:sortReverse">
                    <td><span ng-click="openDemand(position.demandID)"><span ng-show="position.demandID == demandFactory.selectedDemand">
                            <span class="glyphicon glyphicon-menu-down glyphicon-small" aria-hidden="true"></span>
                        </span>
                        <span ng-show="position.demandID != demandFactory.selectedDemand">
                            <span class="glyphicon glyphicon-menu-right glyphicon-small" aria-hidden="true"></span>
                        </span></span>
                        <span class="jobName">&nbsp{{ position.name }} </span>
                    </td>
                    <td>{{ position.demandID }}</td>
                    <td>{{ position.rotation }}</td>
                    <td>{{ position.headcount }}</td>
                    <td>{{ position.num }}</td>
                    <td>{{ position.approved }}</td>
                </tr>

In the test case I have accessed the element but could get the check aria-hidden value.

  var aPromiseOfRows = element.all(by.repeater('position in demandFactory.openings').row(0).column("position.name"));
  aPromiseOfRows.getText().then(function(text) {
  console.log(text);
});

Possible duplicate of [get element attribute value in Protractor](https://stackoverflow.com/questions/34961197/get-element-attribute-value-in-protractor) — JeffC, Aug 23 '19 at 13:31
As flagged by @JeffC, give the existing question and answers a read through. Most likely you will get the solution you are looking for there too. — Rakesh Kumar Cherukuri, Aug 23 '19 at 13:42

score 0 · Answer 1 · answered Aug 23 '19 at 12:52

0

With Protractor, you can use getAttribute thats documented here. getText() returns the text inside the element and not the element attribute(s).

You can do something like this

Get the element you want to test using get(index thats documented here.
Get attribute inside expect()
Use a matcher like toBe/toEqual appropriately for your use case

Pseudo code:

var aPromiseOfRow = element.all(by.repeater('position in demandFactory.openings').get(0);
expect(aPromiseOfRow.getAttribute('aria-hidden')).toEqual('true');

If you are looking to access the value for later use then use something like this

var val;
aPromiseOfRow.getAttribute('aria-hidden').then(function(attrValue) {
   val = attrValue;
});

Hope that helps...

answered Aug 23 '19 at 12:52

Rakesh Kumar Cherukuri

1,251
9
25

there are two spans in the same td. I need to check aria hidden of both the spans. They are nested spans – simba Aug 23 '19 at 12:53
Suggest add appropriate CSS class/id selector for the `` elements. Then use `aPromiseOfRow.element(by.css("span-selector-here")).getAttribute("aria-hidden")`. The logic is pretty simple. Basically get the element then call `getAttribute("aria-hidden")`. – Rakesh Kumar Cherukuri Aug 23 '19 at 13:41
Failed: aPromiseOfRows.element is not a function i got an error – simba Aug 23 '19 at 14:08
Thats because `aPromiseOfRows` is an Element array. What you need is `aPromiseOfRows.get(0)` to get the first element in that array. You can then use the `.element(by.css('span-selector'))` to get to the span element. Notice the response above its `aPromiseOfRow` not `aPromiseOfRows`. On a lighter note, suggest spare a thought on the code you are using. Without understanding what you are writing, there is little value in coding session over SO :) – Rakesh Kumar Cherukuri Aug 23 '19 at 14:35
Below is what i did. and i got No element found using locator: By(css selector, .glyphicon glyphicon-menu-down glyphicon-small) var aPromiseOfRows = element.all(by.repeater('position in demandFactory.openings').row(0)); var aPromiseOfRow = aPromiseOfRows.get(0); console.log(aPromiseOfRow.element(by.css('.glyphicon glyphicon-menu-down glyphicon-small')).getAttribute("aria-hidden")); – simba Aug 23 '19 at 14:57
`by.css('.glyphicon glyphicon-menu-down glyphicon-small')` that wont work. Let me point you in the right direction. For any automation work, one needs to understand how selectors (CSS or XPATH) work. Refer https://www.w3schools.com/cssref/css_selectors.asp for the basics of CSS selectors. In specific to your problem, search for "name1 name2" on that page. You will get your answer as to what to use. – Rakesh Kumar Cherukuri Aug 23 '19 at 15:37

In Protractor, how to check aria-hidden = "true" or "false"

1 Answers1