Window.scroll is broken by material

narthur157 commented 6 years ago

Bug, feature request, or proposal:

window.scroll() does not work on pages with material

What is the expected behavior?

window.scroll(0, 1500) in browser console should scroll the page

What is the current behavior?

no scroll occurs

What are the steps to reproduce?

run window.scroll(0, 1500) on https://v5.material.angular.io/ (or v6)

What is the use-case or motivation for changing an existing behavior?

scroll is useful

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular material - 5.2.4, 6 Chrome 66, Windows 7 Firefox 59, Windows 7

Is there anything else we should know?

assuming angular docs are written in angular, it's working in angular (tried using window.scroll here and it worked https://angular.io/api/common/http/HttpClient)

This used to work, but I'm not sure when. I don't think it has to do with v6

Printing the value of window.scroll shows a function with native code, so it doesn't appear to be re-assigned. I tried assigning a proxy function to print out when window scroll is called to see if it was being cancelled out or something, but no calls were made except the ones from myself.

There's no errors in the console, it just fails silently.

crisbeto commented 6 years ago

That's because window.scroll will only scroll if the scrollable content is the body or html, but in our case the content is inside the mat-sidenav-content. This one will work:

document.querySelector('mat-sidenav-content').scrollTop = 1500;

Closing since this is an implementation detail of our docs site, rather than an issue with Material.

narthur157 commented 6 years ago

Ah okay, thanks. This is ultimately related to the fact that by default angular elements have size 0x0. If you set all elements to display: block, then it would still work normally. I had recently converted my content to all be inside mat-sidenav-content, which explains it.