Turned the check of the scroll at the bottom from … (#7259)

checking equal to checking a range to make it work with fractions.

Author: David Kutugata

news/2 Fixes/6580.md

@@ -3,4 +3,5 @@ Still the interactive window will snap to the bottom if you already are at the b
 Tested to work with: 
 - regular code
 - dataframes
-- big and regular plots
+- big and regular plots
+Turned the check of the scroll at the bottom from checking equal to checking a range to make it work with fractions.

src/datascience-ui/history-react/MainPanel.tsx

@@ -169,20 +169,12 @@ export class MainPanel extends React.Component<IMainPanelProps, IMainPanelState>
     public scrollDiv = (div: HTMLDivElement) => {
         if (this.state.isAtBottom) {
             this.internalScrollCount += 1;
+            // Force auto here as smooth scrolling can be canceled by updates to the window
+            // from elsewhere (and keeping track of these would make this hard to maintain)
             div.scrollIntoView({ behavior: 'auto', block: 'start', inline: 'nearest' });
         }
     }
 
-    public handleScroll = (e: React.UIEvent<HTMLDivElement>) => {
-        if (this.internalScrollCount > 0) {
-            this.internalScrollCount -= 1;
-        } else {
-            this.setState({
-                isAtBottom: e.currentTarget.scrollHeight - e.currentTarget.scrollTop === e.currentTarget.clientHeight
-            });
-        }
-    }
-
     // tslint:disable-next-line:no-any cyclomatic-complexity max-func-body-length
     public handleMessage = (msg: string, payload?: any) => {
         switch (msg) {
@@ -287,6 +279,18 @@ export class MainPanel extends React.Component<IMainPanelProps, IMainPanelState>
         return false;
     }
 
+    private handleScroll = (e: React.UIEvent<HTMLDivElement>) => {
+        if (this.internalScrollCount > 0) {
+            this.internalScrollCount -= 1;
+        } else {
+            const currentHeight = e.currentTarget.scrollHeight - e.currentTarget.scrollTop;
+            const isAtBottom = currentHeight < e.currentTarget.clientHeight + 2 && currentHeight > e.currentTarget.clientHeight - 2;
+            this.setState({
+                isAtBottom
+            });
+        }
+    }
+
     // Uncomment this to use for debugging messages. Add a call to this to stick in dummy sys info messages.
     // private addDebugMessageCell(message: string) {
     //     const cell: ICell = {