Fix use of incorrect viewport size (#120)

src/views/flamechart-minimap-view.tsx

@@ -131,8 +131,6 @@ export class FlamechartMinimapView extends Component<FlamechartMinimapViewProps,
     const physicalViewSize = this.physicalViewSize()
     ctx.clearRect(0, 0, physicalViewSize.x, physicalViewSize.y)
 
-    this.resizeOverlayCanvasIfNeeded()
-
     const configToPhysical = this.configSpaceToPhysicalViewSpace()
 
     const left = 0
@@ -239,6 +237,7 @@ export class FlamechartMinimapView extends Component<FlamechartMinimapViewProps,
 
   private onBeforeFrame = () => {
     this.maybeClearInteractionLock()
+    this.resizeOverlayCanvasIfNeeded()
     this.renderRects()
     this.renderOverlays()
   }

src/views/flamechart-pan-zoom-view.tsx

@@ -8,6 +8,7 @@ import {cachedMeasureTextWidth, ELLIPSIS, trimTextMid} from '../lib/text-utils'
 import {style} from './flamechart-style'
 import {h, Component} from 'preact'
 import {css} from 'aphrodite'
+import {FlamechartID} from '../store/flamechart-view-state'
 
 interface FlamechartFrameLabel {
   configSpaceBounds: Rect
@@ -33,6 +34,7 @@ interface FlamechartFrameLabel {
  * canvas primitives.
  */
 export interface FlamechartPanZoomViewProps {
+  id: FlamechartID
   flamechart: Flamechart
   canvasContext: CanvasContext
   flamechartRenderer: FlamechartRenderer
@@ -151,7 +153,6 @@ export class FlamechartPanZoomView extends Component<FlamechartPanZoomViewProps,
   private renderOverlays() {
     const ctx = this.overlayCtx
     if (!ctx) return
-    this.resizeOverlayCanvasIfNeeded()
     if (this.props.configSpaceViewportRect.isEmpty()) return
 
     const configToPhysical = this.configSpaceToPhysicalViewSpace()
@@ -448,6 +449,7 @@ export class FlamechartPanZoomView extends Component<FlamechartPanZoomViewProps,
   }
 
   private onBeforeFrame = () => {
+    this.resizeOverlayCanvasIfNeeded()
     this.renderRects()
     this.renderOverlays()
     this.maybeClearInteractionLock()

src/views/flamechart-view.tsx

@@ -1,4 +1,4 @@
-import {h, Component} from 'preact'
+import {h} from 'preact'
 import {css} from 'aphrodite'
 
 import {CallTreeNode} from '../lib/profile'
@@ -14,12 +14,9 @@ import {FlamechartPanZoomView} from './flamechart-pan-zoom-view'
 import {Hovertip} from './hovertip'
 import {actions} from '../store/actions'
 import {FlamechartViewProps} from './flamechart-view-container'
+import {StatelessComponent} from '../lib/typed-redux'
 
-interface EmptyState {
-  __dummy: 1
-}
-
-export class FlamechartView extends Component<FlamechartViewProps, EmptyState> {
+export class FlamechartView extends StatelessComponent<FlamechartViewProps> {
   private configSpaceSize() {
     return new Vec2(
       this.props.flamechart.getTotalWeight(),
@@ -124,6 +121,7 @@ export class FlamechartView extends Component<FlamechartViewProps, EmptyState> {
         />
         <FlamechartPanZoomView
           canvasContext={this.props.canvasContext}
+          id={this.props.id}
           flamechart={this.props.flamechart}
           flamechartRenderer={this.props.flamechartRenderer}
           renderInverted={false}

src/views/flamechart-wrapper.tsx

@@ -84,6 +84,7 @@ export class FlamechartWrapper extends StatelessComponent<FlamechartViewProps> {
         ref={this.containerRef}
       >
         <FlamechartPanZoomView
+          id={this.props.id}
           selectedNode={null}
           onNodeHover={this.setNodeHover}
           onNodeSelect={noop}