Jasmine is having trouble scrolling the window using executeScript

I usually use the following command:

browser.driver.executeScript('window.scrollTo(0,1600);');

However, this command is no longer working.

No errors are showing in the console, making it difficult to troubleshoot.

Interestingly, the same script works for another test case but I cannot identify any differences between them.

As a solution, I attempted to use scrollIntoView which resulted in an infinite loop.

Full test case:

describe('My business page ', function() {

    var EC = protractor.ExpectedConditions;
    var loginBox = element(by.css("div.info-box.client-login.ng-scope"));
    var centerElm = $$(("div.action-extra-content.wysiwyg-content.ng-binding.layout-column")).first();
    var scrollIntoView = function (element) {
      arguments[0].scrollIntoView();
    };

    beforeEach(function() {
      browser.ignoreSynchronization = true;
    });

    afterEach(function() {
      browser.ignoreSynchronization = false;
    });


  it('Main page - Top', function() {
    browser.get('https://live.vcita.com/site/bungee');
    browser.wait(EC.visibilityOf(loginBox), 30000);
    browser.driver.sleep(5000);
  });

  it('Main page - Center', function() {
      browser.executeScript(scrollIntoView, centerElm);
      console.log("Scroll me!!!")
      browser.driver.wait(EC.elementToBeClickable(centerElm),30000);
      browser.driver.sleep(2000);
  });

});

Error:

 RangeError: Maximum call stack size exceeded
   Stacktrace:
     RangeError: Maximum call stack size exceeded
    at Function.childCtor.base (C:\automation\npm\node_modules\protractor\node_modules\selenium-webdriver\lib\goog\base.js:2163:38)
    at promise.Callback_.goog.defineClass.constructor (C:\automation\npm\node_modules\protractor\node_modules\selenium-webdriver\lib\webdriver\promise.js:2431:23)
    at new wrappedCtr (C:\automation\npm\node_modules\protractor\node_modules\selenium-webdriver\lib\goog\base.js:2366:26)
    ...

Answer №1

If the container you are trying to scroll is not the window or document, in order to run a script with a specific element, you must pass the native element returned by .getWebElement():

var elm = $('...');
browser.executeScript(function(element){
    element.scrollIntoView();
}, elm.getWebElement());

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Animate.css plugin allows for owl-carousel to smoothly transition sliding from the left side to the right side

I have a question regarding the usage of two plugins on my website. The first plugin is Owl Carousel 2, and the second one is Animate.css. While using `animateIn: 'slideInLeft'` with Owl Carousel 2 is working fine, I am facing an issue with `ani ...

JavaScript code in AJAX response functions properly in browsers like Firefox, Chrome, and Opera. However, it encounters issues in Internet Explorer 11, displaying an error message stating

After searching through various posts, I was unable to find a solution to my question. My query involves requesting a jQuery Datepicker via AJAX. I have provided an example for you to review in Firefox, Chrome or Opera: Ajax javascript example Unfortuna ...

What is the best way to animate my logo using JavaScript so that it scales smoothly just like an image logo

I dedicated a significant amount of time to create a unique and eye-catching logo animation for my website! The logo animation I designed perfectly matches the size of the logo image and can be seamlessly integrated into the site. The issue arises when th ...

I encountered an issue where I am unable to subtract from jQuery's .outerHeight() within an if statement

I've been working on creating an ajax request that triggers when a div is scrolled to the bottom. I thought I had it figured out with this code, but I've run into an issue. Everything works fine without subtracting 100 from the elem.outerHeight() ...

Is it possible for Vue js to display an image from the /dist/ directory even if it is not present?

Currently, I am in the process of learning Vue.js + webpack and have started a project by following these steps: f:www\> npm install -g vue-cli f:www\> vue init webpack-simple my-project f:www\> cd my-project f:www\> npm in ...

Error: Jest react testing encountered an issue when attempting to read the property 'type' from an undefined value

While conducting tests on my app components created with the material UI library using jest and enzyme, I encountered an error in one of my packages. Here is a screenshot of the error: Click here to view ...

The ".splice()" method continuously removes the final element from an array

I have implemented a function on my form that allows me to add multiple file inputs for various images by clicking a button. Although this functionality is working correctly, I am facing an issue while trying to delete an input field using .splice. Instead ...

Prevent the page from scrolling while the lightbox is open

I am struggling with a lightbox that contains a form. Everything is functioning properly, but I need to find a way to prevent the HTML page from scrolling when the lightbox is active. <a href = "javascript:void(0)" onclick=" document.getElementById(& ...

The script functions perfectly in jsfiddle, yet encounters issues when used in an HTML

I stumbled upon a seemingly peculiar issue with my script in jsfiddle: https://jsfiddle.net/oxw4e5yh/ Interestingly, the same script does not seem to work when embedded in an HTML document: <!DOCTYPE html> <html lang="en"> <head> & ...

Locating Undiscovered Users within mongodb

I have created a post collection where each user who marks a post as read has their user ID added to an array within the post document. Now, I am attempting to identify which users have not read certain posts by utilizing the $nin function while iteratin ...

The C# counterpart to the JavaScript "OR assignment" concept

Is there a comparable feature in C# to JavaScript's assignment syntax var x = y || z;? This operation does not result in true/false. If y is defined, it assigns that value to x, otherwise it assigns z to x, even if it is undefined. Keep in mind, in J ...

Failed attempt to perform Ajax requests for REST API data

I am currently working on developing an application that requires a login through a REST API to retrieve a session id. To achieve this, I have set up a button that triggers a JavaScript function for making an AJAX call to authenticate the user. The result ...

The ion-slide-box does not update after the active-slide has been changed using $index

I'm currently facing an issue with the controller that corresponds to this specific view. .controller('MenuCtrl', ['$rootScope','$scope','$state','$timeout','$ionicSlideBoxDelegate', functio ...

Trouble with X-editable: Unable to view values when editing and setting values using J

When using X-editable to modify a form with data, I encounter an issue. Initially, the values are loaded from the database to the HTML, but when users try to edit by clicking on the "Edit" button, all values appear as "Empty" instead of their actual cont ...

Is the fs.watch method being triggered unexpectedly?

As a beginner in node.js and javascript, I've been experiencing an error with the following code snippet: fs.watch('F:/junk', (eventType, filename) => { if(filename && filename.split('.')[1].match("zip")) { ...

The ng-options loop in the array is unable to locate the specified value

In my C# controller, I generate a list and translate it to Json for Angular to receive at the front end. However, when using ng-options to loop through this array in order to get the array value, I always end up with the index instead. <select class="s ...

Implementing Security Measures for ExpressJS Static File Server

Recently, I set up an authentication system following a tutorial on express.js and passport.js. In the past, my express server setup used modRewrite as shown below: var express = require('express'); var modRewrite = require('connect-mod ...

Search form with a variety of fields that allows for searching without needing to repeat the component for each condition

I am currently facing an issue with my form that consists of multiple fields, each used to search through an API and display matching data in a table below. While I have successfully implemented this for one field, I now need it to work for all fields with ...

Choose an option from a drop-down menu using a specific XPath locator with Selenium WebDriver

I am looking for a way to select an element from a combo box using xpath. After finding the path and id of the box, which are: Path = div/div/div ID = stuff_devicessettings_Modbus_TCP I have made several unsuccessful attempts to open the box, some of whi ...

The page switch with a jittery effect

Could really use some assistance with this code that has been giving me trouble for quite a while now. It's a simple HTML, CSS, and JS code involving two pages. [The second page overlaps the first by default, but adjusting the z-index of the first p ...