[BUG] elementHandle.scrollIntoViewIfNeeded doesn't work properly

[VikramTiwari]

Context:

• Playwright Version: 1.4.2
• Operating System: Mac
• Node.js version: 12
• Browser: Chromium
• Extra: NA

Describe the bug
elementHandle.scrollIntoViewIfNeeded won't scroll if the element is partially visible. I think this might be unexpected behavior but I don't see any details about this method on CDP.

2020-10-14T02:00:16.457Z pw:api => elementHandle.scrollIntoViewIfNeeded started
2020-10-14T02:00:16.458Z pw:api   waiting for element to be visible and not moving
2020-10-14T02:00:16.481Z pw:api   element is visible and does not move
2020-10-14T02:00:16.482Z pw:api <= elementHandle.scrollIntoViewIfNeeded succeeded

Here's the page with selected element that I am trying to scroll into view

[dgozman]

Is it possible to share the url, or save the page as mhtml and attach here, or provide a sample page where this problem does reproduce? That would help greatly!

[VikramTiwari]

Hey @dgozman, here's the page. However you need linkedin sales navigator to access that URL.

[dgozman]

Sorry for the late response. I looked at this page, and there is a position:fixed header that covers the item, and we are not scrolling the item from under that header. Reduced repro:

<style>
* {
  padding: 0;
  margin: 0;
}
li {
  height: 80px;
  border: 1px solid black;
}
ol {
  padding-top: 104px;
}
div.fixed {
  position: fixed;
  z-index: 1001;
  width: 100%;
  background: red;
  height: 104px;
}
</style>

<div class=fixed></div>

<ol>
<li>hi1</li><li>hi2</li><li>hi3</li><li>hi4</li><li>hi5</li><li>hi6</li><li>hi7</li><li>hi8</li><li>hi9</li><li>hi10</li><li>hi11</li><li>hi12</li><li>hi13</li><li>hi14</li>
</ol>

[dgozman]

Duplicate of #3105.

[VikramTiwari]

Oh nice! I am glad you were able to recreate it in a standalone manner and that this is a known bug. Thanks for following up on this. :)