user3482804 user3482804 - 5 months ago 58
Javascript Question

How to check change in class name using protractor

Need to test change in class name after particular action is performed.
In my application , after a button is pressed the footer progress bar shows progress .

the only change in footer code is change in class name . following is the code snippet:

Before:

<i class="fa fa-check-circle pull-left" ng-class="{processComplete : sent}"></i>


After process is complete:

<i class="fa fa-check-circle pull-left processComplete" ng-class="{processComplete : sent}"></i>


How to test the change in class name using protractor?

Answer

You can check that an element with processComplete class is present:

expect(element(by.css('.processComplete')).isPresent()).toBe(true);

Or, you can check that a particular element has processComplete class:

expect(element(by.css('i.fa.fa-check-circle')).getAttribute('class')).not.toMatch('processComplete');

// perform some action

expect(element(by.css('i.fa.fa-check-circle')).getAttribute('class')).toMatch('processComplete');