Handle off-screen measurements properly

spec/text-editor-presenter-spec.coffee

@@ -2106,23 +2106,27 @@ describe "TextEditorPresenter", ->
           blockDecoration2 = editor.addBlockDecorationForScreenRow(4, item)
           blockDecoration3 = editor.addBlockDecorationForScreenRow(4, item)
           blockDecoration4 = editor.addBlockDecorationForScreenRow(10, item)
-          presenter = buildPresenter(explicitHeight: 30, scrollTop: 0)
+          presenter = buildPresenter(explicitHeight: 30, lineHeight: 10, tileSize: 2, scrollTop: 0)
 
           expectValues stateForBlockDecoration(presenter, blockDecoration1), {
             decoration: blockDecoration1
             screenRow: 0
+            isVisible: true
           }
           expectValues stateForBlockDecoration(presenter, blockDecoration2), {
             decoration: blockDecoration2
             screenRow: 4
+            isVisible: true
           }
           expectValues stateForBlockDecoration(presenter, blockDecoration3), {
             decoration: blockDecoration3
             screenRow: 4
+            isVisible: true
           }
           expectValues stateForBlockDecoration(presenter, blockDecoration4), {
             decoration: blockDecoration4
             screenRow: 10
+            isVisible: false
           }
 
           waitsForStateToUpdate presenter, ->
@@ -2132,36 +2136,56 @@ describe "TextEditorPresenter", ->
             expectValues stateForBlockDecoration(presenter, blockDecoration1), {
               decoration: blockDecoration1
               screenRow: 4
+              isVisible: true
             }
             expectValues stateForBlockDecoration(presenter, blockDecoration2), {
               decoration: blockDecoration2
               screenRow: 8
+              isVisible: false
             }
             expectValues stateForBlockDecoration(presenter, blockDecoration3), {
               decoration: blockDecoration3
               screenRow: 8
+              isVisible: false
             }
             expectValues stateForBlockDecoration(presenter, blockDecoration4), {
               decoration: blockDecoration4
               screenRow: 14
+              isVisible: false
             }
 
           waitsForStateToUpdate presenter, ->
             blockDecoration2.destroy()
             blockDecoration4.destroy()
+            presenter.setBlockDecorationDimensions(blockDecoration1, 0, 20)
 
           runs ->
             expectValues stateForBlockDecoration(presenter, blockDecoration1), {
               decoration: blockDecoration1
               screenRow: 4
+              isVisible: true
             }
             expect(stateForBlockDecoration(presenter, blockDecoration2)).toBeUndefined()
             expectValues stateForBlockDecoration(presenter, blockDecoration3), {
               decoration: blockDecoration3
               screenRow: 8
+              isVisible: false
             }
             expect(stateForBlockDecoration(presenter, blockDecoration4)).toBeUndefined()
 
+            presenter.setScrollTop(80)
+
+            expectValues stateForBlockDecoration(presenter, blockDecoration1), {
+              decoration: blockDecoration1
+              screenRow: 4
+              isVisible: false
+            }
+            expectValues stateForBlockDecoration(presenter, blockDecoration3), {
+              decoration: blockDecoration3
+              screenRow: 8
+              isVisible: true
+            }
+
       describe ".overlays", ->
         [item] = []
         stateForOverlay = (presenter, decoration) ->

src/block-decorations-component.coffee

@@ -9,6 +9,13 @@ class BlockDecorationsComponent
     @newState = null
     @oldState = null
     @blockDecorationNodesById = {}
+    @domNode = @domElementPool.buildElement("content")
+    @domNode.setAttribute("select", ".atom--invisible-block-decoration")
+    @domNode.style.visibility = "hidden"
+    @domNode.style.position = "absolute"
+
+  getDomNode: ->
+    @domNode
 
   updateSync: (state) ->
     @newState = state.content
@@ -41,6 +48,8 @@ class BlockDecorationsComponent
     blockDecorationState = @newState.blockDecorations[id]
     blockDecorationNode = @views.getView(blockDecorationState.decoration.getProperties().item)
     blockDecorationNode.classList.add("block-decoration-row-#{blockDecorationState.screenRow}")
+    unless blockDecorationState.isVisible
+      blockDecorationNode.classList.add("atom--invisible-block-decoration")
 
     @container.appendChild(blockDecorationNode)
 
@@ -51,6 +60,11 @@ class BlockDecorationsComponent
     oldBlockDecorationState = @oldState.blockDecorations[id]
     blockDecorationNode = @blockDecorationNodesById[id]
 
+    if newBlockDecorationState.isVisible and not oldBlockDecorationState.isVisible
+      blockDecorationNode.classList.remove("atom--invisible-block-decoration")
+    else if not newBlockDecorationState.isVisible and oldBlockDecorationState.isVisible
+      blockDecorationNode.classList.add("atom--invisible-block-decoration")
+
     if newBlockDecorationState.screenRow isnt oldBlockDecorationState.screenRow
       blockDecorationNode.classList.remove("block-decoration-row-#{oldBlockDecorationState.screenRow}")
       blockDecorationNode.classList.add("block-decoration-row-#{newBlockDecorationState.screenRow}")

src/text-editor-component.coffee

@@ -87,6 +87,8 @@ class TextEditorComponent
     @linesComponent = new LinesComponent({@presenter, @hostElement, @useShadowDOM, @domElementPool, @assert, @grammars})
     @scrollViewNode.appendChild(@linesComponent.getDomNode())
 
+    @scrollViewNode.appendChild(@blockDecorationsComponent.getDomNode())
+
     @linesYardstick = new LinesYardstick(@editor, @presenter, @linesComponent, lineTopIndex, @grammars)
     @presenter.setLinesYardstick(@linesYardstick)
 

src/text-editor-presenter.coffee

@@ -76,7 +76,6 @@ class TextEditorPresenter
 
     @blockDecorationsPresenter.update()
 
-    @updateBlockDecorationsState()
     @updateVerticalDimensions()
     @updateScrollbarDimensions()
 
@@ -88,6 +87,8 @@ class TextEditorPresenter
     @updateCommonGutterState()
     @updateReflowState()
 
+    @updateBlockDecorationsState()
+
     if @shouldUpdateDecorations
       @fetchDecorations()
       @updateLineDecorations()
@@ -1217,7 +1218,8 @@ class TextEditorPresenter
 
     @blockDecorationsPresenter.getAllDecorationsByScreenRow().forEach (decorations, screenRow) =>
       for decoration in decorations
-        @state.content.blockDecorations[decoration.id] = {decoration, screenRow}
+        isVisible = @getStartTileRow() <= screenRow < @getEndTileRow() + @tileSize
+        @state.content.blockDecorations[decoration.id] = {decoration, screenRow, isVisible}
 
   updateLineDecorations: ->
     @lineDecorationsByScreenRow = {}