0

There is a scenario where I need to perform an action(delete or add) on a particular element. But that element may belong to different classes and depending on the classes, I have to perform the action on that element.

Below is the snippet of my code. 

        if(class1.isPresent()) {
            deleteSpecial.click();
            console.log("Class 1 executed");
            addSpecialCard.element(addSpecial.locator()).click();
        } else if(class2.isPresent()) {
            deleteSpecial.click();
            console.log("Class 2 executed");
            addSpecialCard.element(addSpecial.locator()).click();
        } else {
            addSpecialCard.element(addSpecial.locator()).click();
            console.log("Else executed");
        }

okay. So I tried to simply my code. Below is the simplified version.

    class3.isDisplayed().then((result) =>{
        if(result) {
            addSpecialCard.element(addSpecial.locator()).click();
            console.log("Class3 executed");
        }else {
            deleteSpecial.click();
            addSpecialCard.element(addSpecial.locator()).click();
        }

In case of class1 and class2 the actions which I need to perform are same. So the only thing I have to check is whether the element belongs to class3 or not. If yes then perform only add action. But if no, then perform add delete action 1st then add action.

But in this simplified code also, my else part does not execute. It looks for the class3. If it finds it will execute the if part. But if the class3 is not present, then it doesn't execute the else part and say's unable to find the element(i.e. class3)

Here is the HTML for classes:

class1: 

<span class="inventory-active-layover active-layover ng-scope">

class2:

<span class="inventory-active-layover inactive-layover ng-scope">

class3:

<span class="list-edit-link inventory-add-button ng-scope">

The thing is all 3 classes doesn't appear at once in DOM. If the element is added and active then in DOM class1 will be shown. But if the element is added and it is inactive then in DOM class2 will be shown. And at last, if the element is not added then in DOM class,3 will be shown.

amitesh shukla
  • 49
  • 1
  • 12
  • 1
    It sounds like you want `if (…) {…} if (…) {…}` instead of `if (…) {…} else if (…) {…}`? – Bergi Dec 01 '18 at 14:51
  • 1
    No, promises do not help here, there's nothing asynchronous in your code (or is there?). Avoid going in that direction, fix your logic problems first. – Bergi Dec 01 '18 at 14:52
  • @Bergi That's the problem. I am not able to get the right logic for that. My else condition is never executed. I tried the way you mentioned, but that also didn't work. In that case both if(1st and 2nd) is getting executed. I shared the piece of code(At the end of the post) which I tried as per your suggestion. – amitesh shukla Dec 01 '18 at 20:25
  • so, could you show HTML? – Oleksii Dec 01 '18 at 20:48
  • @Oleksii That would be hard for me to show. The only thing I want is if someone can tell me how can I use the if-else statement here for those 3 classes. For better understanding, please refer to the Example portion of my post. Thanks – amitesh shukla Dec 02 '18 at 07:51
  • 1
    @amiteshshukla What exactly is the problem that you face, what doesn't work as expected? The only description in your answer is "*It always execute the 1st conditon. It never goes to the else if or else condition.*" which means that "class1" is always present and the other ones don't even get checked because you used `else`. If you don't want both to get executed, what else do you want? – Bergi Dec 02 '18 at 11:26
  • @Bergi Sorry if my description was not clear enough. The thing is, there is one scenario where I have to delete a particular element and the perform an add action. In order to do that, 1st protractor needs to find that element. But the problem is that element not always belongs to one class. Depending on the situation, the class very. So if that element is in active status, then it belongs to class1. But if that element is in inactive status, then it belongs to class2 and finally, it is not even added, then it belongs to class3. – amitesh shukla Dec 02 '18 at 12:00
  • @Bergi So as the per the class it belongs. I want to perform the actions on that element. Which I am not able to do. The scenario is quite tricky. So it is a little hard to explain. I hope that I am able to convey my point to you. – amitesh shukla Dec 02 '18 at 12:04
  • You have issue in your "tricky" test scenario as well. Try to think how to make is simpler. It should be simpler. Also, think why your tests depends on each other, you should have stable precondition as well. I know you can tell me a lot of "why" but my goal not in this. – Oleksii Dec 02 '18 at 18:10
  • Did you try using switch case? would be better in case you have more than 2 possibilities, you can get the isdisplayed in a chain then in the end use the switch to check which one was displayed – Alexandre Dec 03 '18 at 07:57
  • @amiteshshukla Share your html to give more clarity on the issue. – Madhan Raj Dec 03 '18 at 09:03
  • @Madhan I added the required HTML – amitesh shukla Dec 04 '18 at 10:49
  • @Oleksii I tried to simplify my code. Now can you please take a look and if possible tell me why my else part still doesn't get executed. – amitesh shukla Dec 04 '18 at 10:51
  • @amiteshshukla Thanks for html. could you share the locators of class1,2, and 3. – Madhan Raj Dec 04 '18 at 11:19
  • @Madhan Sorry I could not understand what you meant by locators. I am using the same classes to locate that element like element(by.className='inventory-active-layover inactive-layover ng-scope') – amitesh shukla Dec 04 '18 at 13:50

2 Answers2

0

Try the below code

Add some expected waits to handle the wait time for the class3 to load.

        if(class3.isDisplayed()) {
            addSpecialCard.element(addSpecial.locator()).click();
            console.log("Class3 executed");
        }else {
            deleteSpecial.click();
            console.log("Class3 Not Found and executed the else part");
            addSpecialCard.element(addSpecial.locator()).click();
        }

Hope it helps you..

Madhan Raj
  • 1,404
  • 1
  • 7
  • 13
  • your answer didn't work for me. Actually "Yogendra Porwal" answer worked for me. I had to go with promise in order to resolve that problem and replacing isDisplayed with isPresent was the key. Thanks for the answer though. I appreciate the time you gave for answering this question. I have marked his answer correct. – amitesh shukla Dec 05 '18 at 14:22
0

One thing i noticed that "The thing is all 3 classes doesn't at once in DOM". Then you should use isPresent() instead of isDisplayed().

As isDisplayed() test whether this element is currently displayed or not and thats is the reason behind "unable to find the element(i.e. class3)" error.

Yogendra Porwal
  • 119
  • 6