Selector that will allow automatic Submit button click

Question

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.

Define what you mean by "I cannot seem to get a clickable element out of it". What is your code, what do you expect it to do and what does it do instead? — JB Nizet
I need to be able to Click the "Submit" button. I cannot seem to get it with XPath, or CSS or any other element(by...) statement. — Drew
My crystal ball says the problem is at line 42. If you trust developers more than crystal balls, then post your code, and tell what you expect it to do and what it does instead. — JB Nizet
Edit your question. Don't post code in comments. Post all the relevant code. And please, assign an ID to your button and get the button by ID. If your code worked, it would start breaking as soon as you make minor changes to the layout of the page. — JB Nizet

alecxe alecxe · Accepted Answer · 2015-05-18T18:06:49

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

Selector that will allow automatic Submit button click

1 Answers