UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

Example URL:
http://output.jsbin.com/jugaxococo

Steps to reproduce the problem:
http://output.jsbin.com/jugaxococo shows the problem, but basically if you have

body {
  background: linear-gradient(to bottom, red 0%, yellow 50%);
}

(or any other colors)

and the body over-scrolls so that OSX rubber-banding kicks in.

What is the expected behavior?
top/bottom rubber-banding should be the top/bottom of the gradient, respectively.

E.g. in the example, over-scrolling at the top should be red, and over-scrolling at the bottom should be yellow.

What went wrong?
It's white on both top/bottom.

Contrast this to setting a (non-gradient) background color, which does show in the rubber-banding.

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? No Safari has a similar bug, but it reverses the top/bottom rather than showing white

Chrome version: 50.0.2661.102  Channel: stable
OS Version: OS X 10.11.3
Flash Version: Shockwave Flash 21.0 r0

The workaround I'm using is to watch the onscroll event and change background-color depending on scroll position - but
(a) it's a shame adding a scroll event,
(b) especially since it gets throttled so the color switching doesn't kick in early enough, and 
(c) testing scroll height causes relayout (?).