Start porting TextEditorComponent spec

src/gutter-container-component.coffee

@@ -7,8 +7,7 @@ LineNumberGutterComponent = require './line-number-gutter-component'
 
 module.exports =
 class GutterContainerComponent
-
-  constructor: ({@onLineNumberGutterMouseDown, @editor}) ->
+  constructor: ({@onLineNumberGutterMouseDown, @editor, @presenter}) ->
     # An array of objects of the form: {name: {String}, component: {Object}}
     @gutterComponents = []
     @gutterComponentsByGutterName = {}
@@ -35,7 +34,7 @@ class GutterContainerComponent
       gutterComponent = @gutterComponentsByGutterName[gutter.name]
       if not gutterComponent
         if gutter.name is 'line-number'
-          gutterComponent = new LineNumberGutterComponent({onMouseDown: @onLineNumberGutterMouseDown, @editor, gutter})
+          gutterComponent = new LineNumberGutterComponent({onMouseDown: @onLineNumberGutterMouseDown, @presenter, @editor, gutter})
           @lineNumberGutterComponent = gutterComponent
         else
           gutterComponent = new CustomGutterComponent({gutter})

src/line-number-gutter-component.coffee

@@ -9,7 +9,7 @@ module.exports =
 class LineNumberGutterComponent extends TiledComponent
   dummyLineNumberNode: null
 
-  constructor: ({@onMouseDown, @editor, @gutter}) ->
+  constructor: ({@onMouseDown, @editor, @presenter, @gutter}) ->
     @lineNumberNodesById = {}
     @visible = true
 
@@ -74,10 +74,9 @@ class LineNumberGutterComponent extends TiledComponent
     @dummyLineNumberNode.innerHTML = DummyLineNumberComponent.buildLineNumberInnerHTML(0, false)
 
   lineNumberNodeForScreenRow: (screenRow) ->
-    for id, lineNumberState of @oldState.lineNumbers
-      if lineNumberState.screenRow is screenRow
-        return @lineNumberNodesById[id]
-    null
+    tile = @presenter.tileForRow(screenRow)
+
+    @componentsByTileId[tile]?.lineNumberNodeForScreenRow(screenRow)
 
   onMouseDown: (event) =>
     {target} = event

src/line-numbers-tile-component.coffee

@@ -30,12 +30,16 @@ class LineNumbersTileComponent
       @domNode.style.display = @newTileState.display
       @oldTileState.display = @newTileState.display
 
+    if @newState.backgroundColor isnt @oldState.backgroundColor
+      @domNode.style.backgroundColor = @newState.backgroundColor
+      @oldState.backgroundColor = @newState.backgroundColor
+
     if @newTileState.height isnt @oldTileState.height
       @domNode.style.height = @newTileState.height + 'px'
       @oldTileState.height = @newTileState.height
 
     if @newTileState.top isnt @oldTileState.top
-      @domNode.style['-webkit-transform'] = "translate3d(#{@newTileState.left}px, #{@newTileState.top}px, 0px)"
+      @domNode.style['-webkit-transform'] = "translate3d(0, #{@newTileState.top}px, 0px)"
       @oldTileState.top = @newTileState.top
       @oldTileState.left = @newTileState.left
 
@@ -127,3 +131,9 @@ class LineNumbersTileComponent
     className += " " + decorationClasses.join(' ') if decorationClasses?
     className += " foldable" if foldable and not softWrapped
     className
+
+  lineNumberNodeForScreenRow: (screenRow) ->
+    for id, lineNumberState of @oldTileState.lineNumbers
+      if lineNumberState.screenRow is screenRow
+        return @lineNumberNodesById[id]
+    null

src/text-editor-component.coffee

@@ -165,7 +165,7 @@ class TextEditorComponent
     @overlayManager?.measureOverlays()
 
   mountGutterContainerComponent: ->
-    @gutterContainerComponent = new GutterContainerComponent({@editor, @onLineNumberGutterMouseDown})
+    @gutterContainerComponent = new GutterContainerComponent({@editor, @onLineNumberGutterMouseDown, @presenter})
     @domNode.insertBefore(@gutterContainerComponent.getDomNode(), @domNode.firstChild)
 
   becameVisible: ->