In DevTools, we show when elements have an overflow area, with a little [scrollable] badge inside of the inspector (see screenshot).
This is super useful when people are trying to debug unwanted scrollbars on their pages. It tells them where to start looking for problems.

We want to expand on this feature and make it even easier for people to debug this common problem. There are 2 things we want to do:

• show where the scrollable area is in the page
• list the elements that caused the overflow to occur.

This bug is about the former. And, while talking to Mats about it, he suggested the following, which would make it possible for devtools to achieve this:

Extend the BoxQuads API with a "scrollable-overflow" CSSBoxType (https://drafts.csswg.org/cssom-view/#the-geometryutils-interface).