I have a 'Submit' button that becomes clickable after another action takes place. In this case, the user has to click the TOS checkbox and then the button becomes clickable. I cannot find a selector that will allow me to automate clicking the Submit button. When you click the Submit button a confirmation window will appear.
I'm using Protractor as the test runner with Webstorm. Currently, the test passes however I do not see the Submit button being clicked and no new account is created. I can add an assertion but I need to know how to find the element to actually click. XPath and CSS do not seem to work when the automation is kicked off.
This is what I'm trying to edit:
element(by.xpath('//*[@id="formHolderId"]/div/div/div[3]/span/button[2]')).click();
This is what the Inspect Element shows prior to the TOS checkbox being checked:
<button data-ng-click="modalOptions.ok(formData)" data-ng-disabled="formHolder.$invalid || formHolder.formHolder.$invalid" data-ng-if="modalOptions.actionButtonText" type="submit" class="btn btn-sm btn-submit ng-binding ng-scope ng-click-active" disabled="disabled">
Submit</button>
This is what Inspect Element looks like after the TOS checkbox is checked:
<button data-ng-click="modalOptions.ok(formData)" data-ng-disabled="formHolder.$invalid || formHolder.formHolder.$invalid" data-ng-if="modalOptions.actionButtonText" type="submit" class="btn btn-sm btn-submit ng-binding ng-scope ng-click-active">
Submit</button>
While the TOS checkbox is not checked, there is a disabled="disabled" however either way, I cannot seem to get a clickable element out of it.
Click the TOS checkbox to enable the button, locate it by text and click:
var submitButton = element(by.xpath("//button[contains(., 'Submit')]"));
submitButton.click();
If, for some reason, you cannot enable the button and, hence, click it using element.click(), you can simulate the click by executing javascript:
browser.executeScript("arguments[0].click();", submitButton.getWebElement());