Pass invisibles down to lines component

spec/editor-component-spec.coffee

@@ -89,16 +89,21 @@ describe "EditorComponent", ->
       expect(component.lineNodeForScreenRow(4).offsetTop).toBe 4 * lineHeightInPixels
 
     describe "when showInvisibles is enabled", ->
+      invisibles = null
+
       beforeEach ->
         atom.config.set("editor.showInvisibles", true)
+        invisibles =
+          eol: 'E'
+          space: 'S'
+          tab: 'T'
+          cr: 'C'
+
+        component.setInvisibles(invisibles)
 
       it "displays spaces, tabs, and newlines as visible charachters", ->
         editor.setText " a line with tabs\tand spaces "
-        eol = '\u00ac'
-        space = '\u00b7'
-        tab = '\u00bb'
-        cr = '\u00a4'
-        expect(component.lineNodeForScreenRow(0).textContent).toBe "#{space}a line with tabs#{tab} and spaces#{space}#{eol}"
+        expect(component.lineNodeForScreenRow(0).textContent).toBe "#{invisibles.space}a line with tabs#{invisibles.tab} and spaces#{invisibles.space}#{invisibles.eol}"
 
       it "displays newlines as their own token outside of the other tokens scope", ->
 

src/editor-component.coffee

@@ -31,7 +31,7 @@ EditorComponent = React.createClass
   mouseWheelScreenRow: null
 
   render: ->
-    {focused, fontSize, lineHeight, fontFamily, showIndentGuide} = @state
+    {focused, fontSize, lineHeight, fontFamily, showIndentGuide, invisibles} = @state
     {editor, cursorBlinkResumeDelay} = @props
     maxLineNumberDigits = editor.getScreenLineCount().toString().length
 
@@ -62,7 +62,7 @@ EditorComponent = React.createClass
         lineHeight: lineHeightInPixels, renderedRowRange, @pendingChanges,
         scrollTop, scrollLeft, scrollHeight, scrollWidth, @scrollingVertically,
         @cursorsMoved, @selectionChanged, @selectionAdded, cursorBlinkResumeDelay,
-        @onInputFocused, @onInputBlurred, @mouseWheelScreenRow
+        @onInputFocused, @onInputBlurred, @mouseWheelScreenRow, invisibles
       }
 
       ScrollbarComponent

src/editor-scroll-view-component.coffee

@@ -16,7 +16,7 @@ EditorScrollViewComponent = React.createClass
   overflowChangedWhilePaused: false
 
   render: ->
-    {editor, fontSize, fontFamily, lineHeight, showIndentGuide} = @props
+    {editor, fontSize, fontFamily, lineHeight, showIndentGuide, invisibles} = @props
     {renderedRowRange, pendingChanges, scrollTop, scrollLeft, scrollHeight, scrollWidth, scrollingVertically, mouseWheelScreenRow} = @props
     {selectionChanged, selectionAdded, cursorBlinkResumeDelay, cursorsMoved, onInputFocused, onInputBlurred} = @props
 
@@ -37,7 +37,7 @@ EditorScrollViewComponent = React.createClass
       LinesComponent {
         ref: 'lines', editor, fontSize, fontFamily, lineHeight, showIndentGuide,
         renderedRowRange, pendingChanges, scrollTop, scrollLeft, scrollingVertically,
-        selectionChanged, scrollHeight, scrollWidth, mouseWheelScreenRow
+        selectionChanged, scrollHeight, scrollWidth, mouseWheelScreenRow, invisibles
       }
 
   componentDidMount: ->

src/lines-component.coffee

@@ -135,17 +135,11 @@ LinesComponent = React.createClass
       " "
 
   buildLineInnerHTML: (line) ->
-    {invisibles, mini, showIndentGuide} = @props
+    {invisibles, mini, showIndentGuide, invisibles} = @props
     {tokens, text} = line
     innerHTML = ""
 
     scopeStack = []
-    invisibles =
-      eol: '\u00ac'
-      space: '\u00b7'
-      tab: '\u00bb'
-      cr: '\u00a4'
-
     firstTrailingWhitespacePosition = text.search(/\s*$/)
     lineIsWhitespaceOnly = firstTrailingWhitespacePosition is 0
     for token in tokens