diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index 7f4af3164..7153f18b5 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -232,6 +232,19 @@ describe "EditorComponent", -> editor.setText("a\0b") expect(editor.pixelPositionForScreenPosition([0, Infinity]).left).toEqual 2 * charWidth + describe "when there is a fold", -> + it "renders a fold marker on the folded line", -> + foldedLineNode = component.lineNodeForScreenRow(4) + expect(foldedLineNode.querySelector('.fold-marker')).toBeFalsy() + + editor.foldBufferRow(4) + foldedLineNode = component.lineNodeForScreenRow(4) + expect(foldedLineNode.querySelector('.fold-marker')).toBeTruthy() + + editor.unfoldBufferRow(4) + foldedLineNode = component.lineNodeForScreenRow(4) + expect(foldedLineNode.querySelector('.fold-marker')).toBeFalsy() + describe "gutter rendering", -> [gutter] = [] @@ -994,6 +1007,16 @@ describe "EditorComponent", -> nextAnimationFrame() expect(editor.getSelectedScreenRange()).toEqual [[2, 4], [6, 8]] + describe "when a line is folded", -> + beforeEach -> + editor.foldBufferRow 4 + + describe "when the folded line's fold-marker is clicked", -> + it "unfolds the buffer row", -> + target = component.lineNodeForScreenRow(4).querySelector '.fold-marker' + linesNode.dispatchEvent(buildMouseEvent('mousedown', clientCoordinatesForScreenPosition([4, 8]), {target})) + expect(editor.isFoldedAtBufferRow 4).toBe false + clientCoordinatesForScreenPosition = (screenPosition) -> positionOffset = editor.pixelPositionForScreenPosition(screenPosition) scrollViewClientRect = node.querySelector('.scroll-view').getBoundingClientRect() diff --git a/src/editor-component.coffee b/src/editor-component.coffee index 282b5e913..7ddddd323 100644 --- a/src/editor-component.coffee +++ b/src/editor-component.coffee @@ -485,6 +485,11 @@ EditorComponent = React.createClass {detail, shiftKey, metaKey} = event screenPosition = @screenPositionForMouseEvent(event) + if event.target?.classList.contains('fold-marker') + bufferRow = editor.bufferRowForScreenRow(screenPosition.row) + editor.unfoldBufferRow(bufferRow) + return + if shiftKey editor.selectToScreenPosition(screenPosition) else if metaKey diff --git a/src/lines-component.coffee b/src/lines-component.coffee index 70342d9c0..2f73ad9dc 100644 --- a/src/lines-component.coffee +++ b/src/lines-component.coffee @@ -121,6 +121,7 @@ LinesComponent = React.createClass else lineHTML += @buildLineInnerHTML(line) + lineHTML += '' if fold lineHTML += "" lineHTML diff --git a/static/editor.less b/static/editor.less index bf3da1930..990097d06 100644 --- a/static/editor.less +++ b/static/editor.less @@ -151,6 +151,10 @@ } } +.editor .fold-marker { + cursor: default; +} + .editor .fold-marker:after { .icon(0.8em, inline); content: @ellipsis;