Search code examples
angulartypescriptjasmineprotractorwebautomation

how to click element with similar element details on button with span using Protractor typescript


enter image description here

Need your help on creating a protractor typescript code, how do i click one of this button? it has _ngcontent class and span class, does anyone have an idea how to do this? code on the site is:

<form _ngcontent-c34 novalidate class="ng-untouched ng-unreal ng-valid">
    <atx-create-license-act-main _ngcontent-c34 _nghost-c36>
       <button _ngcontent-c36 color="accent" mat-raised-button class="mat-raised-button mat-accent">
           <span class="mat-button-wrapper">Add License</span>
           <div class="mat-button-droped mat-droped" matdrop></div>
           <div class="mat-button-focus-overlay"></div>
        </button>
    </atx-create-license-act-main>
</form>
<form _ngcontent-c34 novalidate class="ng-untouched ng-unreal ng-valid">
    <atx-create-license-act-main _ngcontent-c34 _nghost-c36>
       <button _ngcontent-c36 color="accent" mat-raised-button class="mat-raised-button mat-accent">
           <span class="mat-button-wrapper">Add License</span>
           <div class="mat-button-droped mat-droped" matdrop></div>
           <div class="mat-button-focus-overlay"></div>
        </button>
    </atx-create-license-act-main>
</form>

i've tried the following code below, i can't seem to make it work...

clickdone = element.all(by.cssContainingText('.mat-button-wrapper','Add License')).get(0);
clickdone = element.all(by.css('button.mat-raised-button.mat-accent')).get(1);
clickdone = element(by.cssContainingText('span.mat-button-wrapper','Add License'));
clickdone = element.all(by.cssContainingText('button.mat-raised-button.mat-accent','Add License')).get(0);

then performed...

clickdone.click();

none of them seem to work.. and an error says.. "Failed: element not interactable". What does it mean? i stuck on this, any idea how to do this?


Solution

  • Try with below one

    addLicense = element.all(by.css('button>span.mat-button-wrapper');
    
    browser.wait(protractor.ExpectedConditions.elementToBeClickable(addLicense.get(0)), 5000); 
    addLicense.get(0).click();
    

    Chnage the index based on the button you wish to click.

    Hope it helps you