Is there a method to manipulate the scrollbar within a div on a webpage? Specifically, I am attempting to automate scrolling up and down on an Instagram post like . However, since the scrollbar may be hidden using CSS properties, detecting it can be challenging as the scrollbar itself is not considered an element.
Below is the CSS style (from Firebug) of the scrollbar:
.-cx-PRIVATE-PostInfo__comments {
margin-left: -24px;
margin-right: -24px;
margin-top: -5px;
padding-left: 24px;
padding-right: 24px;
padding-top: 5px;
}
.-cx-PRIVATE-PostInfo__commentsSidebarVariant {
overflow: auto;
padding-bottom: 20px;
}
.-cx-PRIVATE-PostInfo__comments {
flex-grow: 1;
}
ol, ul {
list-style: outside none none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i,
center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure,
figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
border: 0 none;
font: inherit;
margin: 0;
padding: 0;
vertical-align: baseline;
}
I have attempted various methods such as
WebElement commentscroll = dr.findElement(By.className("commentsSidebarVariant"));
jse.executeScript("return arguments[0].scrollTop;", commentscroll);
jse.executeScript("$(\"#commentsSidebarVariant\").animate({ scrollTop: \"100px\" })");
jse.executeScript("arguments[0].scrollTop = arguments[1];", commentscroll);
WebElement commentscroll = dr.findElement(By.cssSelector(".-cx-PRIVATE-PostInfo__commentsSidebarVariant"));
jse.executeScript("arguments[0].scrollTop;", commentscroll);
However, none of these attempts were successful in moving the scrollbar.