scrollToPosition(options)
This is a TDK feature
This is not supported in Testim's visual editor
Scrolls to a given absolute x
/y
position on the page or relative to an element.
options
{object}x
{number} absolute x positiony
{number} absolute y positionscrollTarget
{string} CSS selector for the element we scroll on, by defaultbody
- returns: Promise that fulfills when the action is complete.
For example:
// ✅ scroll to x,y position (100,100) relative to the page
await scrollToPosition({
x: 100,
y: 100,
});
// ✅ scroll to 100 pixels inside a scrollable target
await scrollToPosition({
x: 100,
y: 100,
scrollTarget: '.my-scrollable-div'
});
// ❌ missing x/y
await scrollToPosition({
scrollTarget: '.my-scrollable-div'
});
// ❌ target not scrollable
await scrollToPosition({
y: 100,
scrollTarget: 'head'
});
Full Example
'use strict';
const { expect } = require('chai');
const { go, test, scrollToPosition, text, describe, waitForElement, evaluate } = require('testim');
const scrollValueSelector = '#s';
describe("scrollToPosition", () => {
test("scroll on body", async () => {
await go('http://jsbin.testim.io/sed/1');
waitForElement(scrollValueSelector);
const scrolledBefore = await text(scrollValueSelector);
expect(scrolledBefore).to.equal("scrollTop = 8");
await scrollToPosition(0, 50);
const scrolled = await text(scrollValueSelector);
expect(scrolled).to.be.equal("scrollTop = -42");
});
test("scroll on element", async () => {
await go('http://jsbin.testim.io/caf/3');
const scrolledBefore = await evaluate(() => document.querySelector("#scrollable-to").parentElement.scrollTop);
expect(scrolledBefore).to.equal(0);
await scrollToPosition(0, 50, {scrollTarget: 'body > div'});
const scrolled = await evaluate(() => document.querySelector("#scrollable-to").parentElement.scrollTop);
expect(scrolled).to.be.above(1);
});
});
Updated almost 3 years ago