How to check change in class name using protractor

angularjs, angularjs-e2e, e2e-testing, javascript, protractor

Solution

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');

Problem

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?

Original source