Fix latex and markdown scrolling

Author: rchiodo

news/2 Fixes/5775.md

@@ -0,0 +1 @@
+Fix latex and markdown scrolling.

package-lock.json

@@ -31,6 +31,7 @@ export interface IContentPanelProps {
 
 export class ContentPanel extends React.Component<IContentPanelProps> {
     private bottomRef: React.RefObject<HTMLDivElement> = React.createRef<HTMLDivElement>();
+    private containerRef: React.RefObject<HTMLDivElement> = React.createRef<HTMLDivElement>();
     constructor(prop: IContentPanelProps) {
         super(prop);
     }
@@ -45,7 +46,7 @@ export class ContentPanel extends React.Component<IContentPanelProps> {
 
     public render() {
         return(
-            <div id='content-panel-div'>
+            <div id='content-panel-div' ref={this.containerRef}>
                 <div id='cell-table'>
                     <div id='cell-table-body'>
                         {this.renderCells()}
@@ -89,10 +90,14 @@ export class ContentPanel extends React.Component<IContentPanelProps> {
     }
 
     private scrollToBottom = () => {
-        if (this.bottomRef.current && !this.props.skipNextScroll && !this.props.testMode) {
+        if (this.bottomRef.current && !this.props.skipNextScroll && !this.props.testMode && this.containerRef.current) {
             // 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)
-            this.bottomRef.current.scrollIntoView({behavior: 'auto', block: 'start', inline: 'nearest'});
+            setTimeout(() => {
+                if (this.bottomRef.current) {
+                    this.bottomRef.current!.scrollIntoView({behavior: 'auto', block: 'start', inline: 'nearest'});
+                }
+            }, 100);
         }
     }