I have a text field that I need to scroll to the bottom of in order for the Next button to be activated to click. This project is using Angular 6 my tests are end to end test running on the protractor/cucumber framework.

The textbox is contained within the page and nothing seems to work allowing me to scroll within the text field. I have tried the mouseMove mouseDown options, along with a simple sendKeys End or ArrowDown.
You can find out more details in this screenshot.

Any advice is greatly appreciated.

3 Answers 3


Have you tried simply scrolling to the bottom without any reference to any object:

element(by.className('<any element on page>')).click();//to focus on page first where scroll need to happen
{ //whatever you need to check for here }

While I haven't used Protractor, generally when I come across an issue like this I use a scrollTo or scrollIntoView() action to bring the viewport into view of the element.

Some cursory research on Protractor shows there are a few examples out there including this one suggesting you wrap the scrollIntoView() action in an executeScript method: https://stackoverflow.com/questions/39399477/protractor-scroll-into-view-not-working#comment66147579_39399892.

So in your case you should be able to locate the Next button within the DOM and then scroll it to within view.

  • 1
    only problem with that is the button is in view, it is disabled until you scroll to the bottom of the terms and conditions text area. Once at the bottom the button is active. My other thought was to alter the DOM. I know how to change the ng-reflect-disabled to false but not removed the disabled at the end or change it to enabled. <button _ngcontent-c30="" class="sub-account-terms__agree mat-raised-button mat-primary" color="primary" id="net_SubAccountAgreeToTerms_btn" mat-raised-button="" ng-reflect-disabled="true" ng-reflect-color="primary" disabled> Commented Jun 30, 2018 at 19:21

As far as I know there is no way to scroll a textarea directly in protractor. But you can use browser.executeScript, e.g. (horizontally scrolling 100px):

    import {ExpectedConditions} from 'protractor';

    it ('tests scrolling a textarea', async() => {

       const textarea_id = 'myId';
       /* wait for the textarea to be visible (this can be tricky (e.g. if some
          http requests are necessary), for simplicity I show a simple way)
       const textarea_el = await element(by.id(textarea_id));
       browser.wait(ExpectedConditions.visibilityOf(textarea_el), 10000);
       await browser.executeScript(
            `document.getElementById('${textarea_id}').scrollTo(100, 0))`);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.