I am trying to UI for a site in and when I inspect the browser (Chrome) with UISpy.exe, I find that certain controls do not exist in the tree at all, even though I can see them in the browser.

In certain cases, multiple fields (e.g. Transaction Date, Delivery Date, their labels, text and icons) exist as one control on the UI tree.

Here is an example of controls that seem to exist as a single control in the UI tree

enter image description here

I used Developer tools to extract HTML for this and here it is.

<div class="input-daterange form-group right-inner-addon" ng-class="{'has-error': submitted &amp;&amp; requisitionForm.transactionDate.$invalid}">
                    <label for="transactionDate" class="ng-binding">Transaction Date<span class="asterisk_input">  </span></label>
                    <input date-picker="" type="text" id="transactionDate" today="" class="form-control date-picker input-lg ng-isolate-scope hasMultiCalendarPicker ng-valid ng-valid-required ng-valid-valid-date-format ng-dirty" name="transactionDate" ng-model="requisition.transactionDate" aria-label="Transaction Date" aria-required="true" required="" autocomplete="off" placeholder="MM/DD/YYYY" title="Press F9 to open the calendar"><span class="calendar-icon calendar-img"></span>
                </div>

However the UI tree in UISpy shows just a single control on the UI tree.

enter image description here

How can I automate and access individual items on the screen, e.g. Transaction Date Label, the value for Transaction date only etc..?



Source link https://sqa.stackexchange.com/questions/34333/is-it-possible-to-use---to-automate--designed-in-angular

LEAVE A REPLY

Please enter your comment!
Please enter your name here