• 
      

    Fix scrolling issues in the comment dialog in Chrome and Firefox.

    Review Request #11661 — Created June 18, 2021 and submitted

    Information

    Review Board
    release-4.0.x

    Reviewers

    We've started seeing issues recently with the comment dialog in both
    Chrome and Firefox when attempting to scroll the text field. On Chrome,
    any attempt at scrolling the text area would also result in the page
    being scrolled. On Firefox, scrolling might not even work at all.

    This was in part caused by some old overflow style rules we had for
    the scroll container, which at some point was necessary to fix some
    styling issues, but these days interacts poorly with modern scrolling
    behavior.

    Removing these rules and adding overscroll-behavior-y: none fixes
    this. This new property tells browsers not to continue scrolling when an
    inner scrolling element is scrolled to the very top or very bottom. It
    also seems to correct some quirky scrolling issue currently specific to
    Chrome, which was causing both the page and CodeMirror to scroll
    simultaneously.

    Tested scrolling in the comment dialog and text fields in Chrome, Firefox,
    and Safari.

    My version of Safari is a bit old, and does not support overscroll-behavior,
    but scrolling still works fine until the boundary of the scroll range is hit.

    Summary ID
    Fix scrolling issues in the comment dialog in Chrome and Firefox.
    We've started seeing issues recently with the comment dialog in both Chrome and Firefox when attempting to scroll the text field. On Chrome, any attempt at scrolling the text area would also result in the page being scrolled. On Firefox, scrolling might not even work at all. This was in part caused by some old `overflow` style rules we had for the scroll container, which at some point was necessary to fix some styling issues, but these days interacts poorly with modern scrolling behavior. Removing these rules and adding `overscroll-behavior-y: none` fixes this. This new property tells browsers not to continue scrolling when an inner scrolling element is scrolled to the very top or very bottom. It also seems to correct some quirky scrolling issue currently specific to Chrome, which was causing both the page and CodeMirror to scroll simultaneously.
    d12d458dcf50e985bcd7b59779b493d74ed7bba2
    david
    1. Ship It!
    2. 
        
    chipx86
    Review request changed
    Status:
    Completed
    Change Summary:
    Pushed to release-4.0.x (9d36329), release-4.0.x (0a4c1ec)