From d3a6e794283fb6f574855449dff273c542e767d9 Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Tue, 22 Jul 2014 13:54:22 -0700 Subject: [PATCH 1/7] The horizontal scrollbar takes gutter width into account --- src/editor-component.coffee | 4 +++- src/gutter-component.coffee | 6 +++--- src/scrollbar-component.coffee | 5 +++-- 3 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/editor-component.coffee b/src/editor-component.coffee index 120616249..ae42ef4a4 100644 --- a/src/editor-component.coffee +++ b/src/editor-component.coffee @@ -138,8 +138,9 @@ EditorComponent = React.createClass className: 'horizontal-scrollbar' orientation: 'horizontal' onScroll: @onHorizontalScroll + gutterWidth: @gutterWidth scrollLeft: scrollLeft - scrollWidth: scrollWidth + @gutterWidth + scrollWidth: scrollWidth visible: horizontallyScrollable and not @refreshingScrollbars and not @measuringScrollbars scrollableInOppositeDirection: verticallyScrollable verticalScrollbarWidth: verticalScrollbarWidth @@ -668,6 +669,7 @@ EditorComponent = React.createClass editor.setSelectedScreenRange([tailPosition, [dragRow + 1, 0]]) onStylesheetsChanged: (stylesheet) -> + @refs.gutter.measureWidth() @refreshScrollbars() if @containsScrollbarSelector(stylesheet) @remeasureCharacterWidthsIfVisibleAfterNextUpdate = true @requestUpdate() if @visible diff --git a/src/gutter-component.coffee b/src/gutter-component.coffee index ae2e9f9f2..19fd6b4d4 100644 --- a/src/gutter-component.coffee +++ b/src/gutter-component.coffee @@ -63,12 +63,12 @@ GutterComponent = React.createClass @updateDummyLineNumber() @removeLineNumberNodes() - unless isEqualForProperties(oldProps, @props, 'maxLineNumberDigits', 'defaultCharWidth') - @measureWidth() - @clearScreenRowCaches() unless oldProps.lineHeightInPixels is @props.lineHeightInPixels @updateLineNumbers() + unless isEqualForProperties(oldProps, @props, 'maxLineNumberDigits', 'defaultCharWidth') + @measureWidth() + clearScreenRowCaches: -> @lineNumberIdsByScreenRow = {} @screenRowsByLineNumberId = {} diff --git a/src/scrollbar-component.coffee b/src/scrollbar-component.coffee index 88f1beec3..ba284e0a0 100644 --- a/src/scrollbar-component.coffee +++ b/src/scrollbar-component.coffee @@ -7,7 +7,7 @@ ScrollbarComponent = React.createClass displayName: 'ScrollbarComponent' render: -> - {orientation, className, scrollHeight, scrollWidth, visible} = @props + {orientation, className, scrollHeight, scrollWidth, gutterWidth, visible} = @props {scrollableInOppositeDirection, horizontalScrollbarHeight, verticalScrollbarWidth} = @props style = {} @@ -19,6 +19,7 @@ ScrollbarComponent = React.createClass when 'horizontal' style.height = horizontalScrollbarHeight style.right = verticalScrollbarWidth if scrollableInOppositeDirection + style.left = gutterWidth div {className, style, @onScroll}, switch orientation @@ -40,7 +41,7 @@ ScrollbarComponent = React.createClass when 'vertical' not isEqualForProperties(newProps, @props, 'scrollHeight', 'scrollTop', 'scrollableInOppositeDirection') when 'horizontal' - not isEqualForProperties(newProps, @props, 'scrollWidth', 'scrollLeft', 'scrollableInOppositeDirection') + not isEqualForProperties(newProps, @props, 'scrollWidth', 'scrollLeft', 'gutterWidth', 'scrollableInOppositeDirection') componentDidUpdate: -> {orientation, scrollTop, scrollLeft} = @props From 0f1d1556851dc8e74aa9278830c0b6ee08d1d1d0 Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Tue, 22 Jul 2014 15:21:41 -0700 Subject: [PATCH 2/7] Move gutterWidth into state; add specs for scrollbar position --- spec/editor-component-spec.coffee | 22 +++++++++++++++++++++- src/editor-component.coffee | 25 ++++++++++++++++++------- 2 files changed, 39 insertions(+), 8 deletions(-) diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index 3d8af165f..dffcb36c9 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -1565,7 +1565,27 @@ describe "EditorComponent", -> component.measureHeightAndWidth() runSetImmediateCallbacks() - expect(horizontalScrollbarNode.scrollWidth).toBe gutterNode.offsetWidth + editor.getScrollWidth() + expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() + expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' + + it "updates the position and width of the horizontal scrollbar when editor.showLineNumbers is toggled", -> + componentNode.style.width = 10 * charWidth + 'px' + component.measureHeightAndWidth() + runSetImmediateCallbacks() + + gutterNode = componentNode.querySelector('.gutter') + expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() + expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' + + atom.config.set("editor.showLineNumbers", false) + gutterNode = componentNode.querySelector('.gutter') + expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() + expect(horizontalScrollbarNode.style.left).toBe '0px' + + atom.config.set("editor.showLineNumbers", true) + gutterNode = componentNode.querySelector('.gutter') + expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() + expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' describe "mousewheel events", -> beforeEach -> diff --git a/src/editor-component.coffee b/src/editor-component.coffee index ae42ef4a4..302da62de 100644 --- a/src/editor-component.coffee +++ b/src/editor-component.coffee @@ -34,7 +34,6 @@ EditorComponent = React.createClass selectionChanged: false selectionAdded: false scrollingVertically: false - gutterWidth: 0 refreshingScrollbars: false measuringScrollbars: true mouseWheelScreenRow: null @@ -50,7 +49,7 @@ EditorComponent = React.createClass domPollingPaused: false render: -> - {focused, fontSize, lineHeight, fontFamily, showIndentGuide, showInvisibles, showLineNumbers, visible} = @state + {focused, fontSize, lineHeight, fontFamily, showIndentGuide, showInvisibles, showLineNumbers, visible, gutterWidth} = @state {editor, mini, cursorBlinkPeriod, cursorBlinkResumeDelay} = @props maxLineNumberDigits = editor.getLineCount().toString().length invisibles = if showInvisibles and not mini then @state.invisibles else {} @@ -138,7 +137,7 @@ EditorComponent = React.createClass className: 'horizontal-scrollbar' orientation: 'horizontal' onScroll: @onHorizontalScroll - gutterWidth: @gutterWidth + gutterWidth: gutterWidth scrollLeft: scrollLeft scrollWidth: scrollWidth visible: horizontallyScrollable and not @refreshingScrollbars and not @measuringScrollbars @@ -158,7 +157,8 @@ EditorComponent = React.createClass {editor} = @props Math.max(1, Math.ceil(editor.getHeight() / editor.getLineHeightInPixels())) - getInitialState: -> {} + getInitialState: -> + gutterWidth: 0 getDefaultProps: -> cursorBlinkPeriod: 800 @@ -213,6 +213,10 @@ EditorComponent = React.createClass @measureLineHeightAndDefaultCharWidthIfNeeded(prevState) @remeasureCharacterWidthsIfNeeded(prevState) + if @gutterVisibilityChanged and @visible + @gutterVisibilityChanged = false + @measureGutter() + performInitialMeasurement: -> @updatesPaused = true @measureLineHeightAndDefaultCharWidth() @@ -669,7 +673,7 @@ EditorComponent = React.createClass editor.setSelectedScreenRange([tailPosition, [dragRow + 1, 0]]) onStylesheetsChanged: (stylesheet) -> - @refs.gutter.measureWidth() + @measureGutter() @refreshScrollbars() if @containsScrollbarSelector(stylesheet) @remeasureCharacterWidthsIfVisibleAfterNextUpdate = true @requestUpdate() if @visible @@ -781,6 +785,12 @@ EditorComponent = React.createClass @heightAndWidthMeasurementRequested = false @measureHeightAndWidth() + measureGutter: -> + if @refs.gutter? + @refs.gutter?.measureWidth() + else + @onGutterWidthChanged(0) + # Measure explicitly-styled height and width and relay them to the model. If # these values aren't explicitly styled, we assume the editor is unconstrained # and use the scrollHeight / scrollWidth as its height and width in @@ -836,8 +846,8 @@ EditorComponent = React.createClass remeasureCharacterWidths: -> @refs.lines.remeasureCharacterWidths() - onGutterWidthChanged: (@gutterWidth) -> - @requestUpdate() + onGutterWidthChanged: (gutterWidth) -> + @setState({gutterWidth}) measureScrollbars: -> return unless @visible @@ -935,6 +945,7 @@ EditorComponent = React.createClass @setState({showInvisibles}) setShowLineNumbers: (showLineNumbers) -> + @gutterVisibilityChanged = true @setState({showLineNumbers}) setScrollSensitivity: (scrollSensitivity) -> From 48a5123202291aef20cf61e162e947ae33f29d23 Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Tue, 22 Jul 2014 16:49:54 -0700 Subject: [PATCH 3/7] :lipstick: Move logic into measureGutterIfNeeded --- spec/editor-component-spec.coffee | 2 ++ src/editor-component.coffee | 36 ++++++++++++++++++------------- 2 files changed, 23 insertions(+), 15 deletions(-) diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index dffcb36c9..df378f12d 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -1578,11 +1578,13 @@ describe "EditorComponent", -> expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' atom.config.set("editor.showLineNumbers", false) + runSetImmediateCallbacks() gutterNode = componentNode.querySelector('.gutter') expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() expect(horizontalScrollbarNode.style.left).toBe '0px' atom.config.set("editor.showLineNumbers", true) + runSetImmediateCallbacks() gutterNode = componentNode.querySelector('.gutter') expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' diff --git a/src/editor-component.coffee b/src/editor-component.coffee index 302da62de..2ec55da8c 100644 --- a/src/editor-component.coffee +++ b/src/editor-component.coffee @@ -24,6 +24,7 @@ EditorComponent = React.createClass visible: false autoHeight: false + gutterWidth: 0 pendingScrollTop: null pendingScrollLeft: null selectOnMouseMove: false @@ -49,7 +50,7 @@ EditorComponent = React.createClass domPollingPaused: false render: -> - {focused, fontSize, lineHeight, fontFamily, showIndentGuide, showInvisibles, showLineNumbers, visible, gutterWidth} = @state + {focused, fontSize, lineHeight, fontFamily, showIndentGuide, showInvisibles, showLineNumbers, visible} = @state {editor, mini, cursorBlinkPeriod, cursorBlinkResumeDelay} = @props maxLineNumberDigits = editor.getLineCount().toString().length invisibles = if showInvisibles and not mini then @state.invisibles else {} @@ -137,7 +138,7 @@ EditorComponent = React.createClass className: 'horizontal-scrollbar' orientation: 'horizontal' onScroll: @onHorizontalScroll - gutterWidth: gutterWidth + gutterWidth: @gutterWidth scrollLeft: scrollLeft scrollWidth: scrollWidth visible: horizontallyScrollable and not @refreshingScrollbars and not @measuringScrollbars @@ -157,8 +158,7 @@ EditorComponent = React.createClass {editor} = @props Math.max(1, Math.ceil(editor.getHeight() / editor.getLineHeightInPixels())) - getInitialState: -> - gutterWidth: 0 + getInitialState: -> {} getDefaultProps: -> cursorBlinkPeriod: 800 @@ -213,9 +213,7 @@ EditorComponent = React.createClass @measureLineHeightAndDefaultCharWidthIfNeeded(prevState) @remeasureCharacterWidthsIfNeeded(prevState) - if @gutterVisibilityChanged and @visible - @gutterVisibilityChanged = false - @measureGutter() + @measureGutterIfNeeded() performInitialMeasurement: -> @updatesPaused = true @@ -785,12 +783,6 @@ EditorComponent = React.createClass @heightAndWidthMeasurementRequested = false @measureHeightAndWidth() - measureGutter: -> - if @refs.gutter? - @refs.gutter?.measureWidth() - else - @onGutterWidthChanged(0) - # Measure explicitly-styled height and width and relay them to the model. If # these values aren't explicitly styled, we assume the editor is unconstrained # and use the scrollHeight / scrollWidth as its height and width in @@ -847,7 +839,21 @@ EditorComponent = React.createClass @refs.lines.remeasureCharacterWidths() onGutterWidthChanged: (gutterWidth) -> - @setState({gutterWidth}) + if gutterWidth isnt @gutterWidth + @gutterWidth = gutterWidth + @requestUpdate() + + measureGutterIfNeeded: -> + if @visible and @measureGutterWhenEditorIsVisible + @measureGutterWhenEditorIsVisible = false + @measureGutter() + + measureGutter: -> + if @state.showLineNumbers + @refs.gutter.measureWidth() + else + @gutterWidth = 0 + @requestUpdate() measureScrollbars: -> return unless @visible @@ -945,7 +951,7 @@ EditorComponent = React.createClass @setState({showInvisibles}) setShowLineNumbers: (showLineNumbers) -> - @gutterVisibilityChanged = true + @measureGutterWhenEditorIsVisible = true @setState({showLineNumbers}) setScrollSensitivity: (scrollSensitivity) -> From 361f8ec77056b4b940209b96d0b1df3013f68e6f Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Tue, 22 Jul 2014 17:17:30 -0700 Subject: [PATCH 4/7] Add specs for toggling the gutter when the editor is hidden --- spec/editor-component-spec.coffee | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index df378f12d..883049753 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -1589,6 +1589,36 @@ describe "EditorComponent", -> expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' + describe "when the editor is hidden", -> + hideEditorView = -> + wrapperNode.style.display = 'none' + expect(component.isVisible()).toBe false + + showEditorView = -> + wrapperNode.style.display = 'block' + expect(component.isVisible()).toBe true + + it "updates the position of the horizontal scrollbar only when the editor is visible", -> + # toggling gutter off + hideEditorView() + atom.config.set("editor.showLineNumbers", false) + + showEditorView() + component.forceUpdate() + runSetImmediateCallbacks() + gutterNode = componentNode.querySelector('.gutter') + expect(horizontalScrollbarNode.style.left).toBe '0px' + + # toggling gutter back on + hideEditorView() + atom.config.set("editor.showLineNumbers", true) + + showEditorView() + component.forceUpdate() + runSetImmediateCallbacks() + gutterNode = componentNode.querySelector('.gutter') + expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' + describe "mousewheel events", -> beforeEach -> atom.config.set('editor.scrollSensitivity', 100) From 2a9c78ef9229f19a1d692cdbb4effdde2f4803aa Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Wed, 23 Jul 2014 16:20:48 -0700 Subject: [PATCH 5/7] Move horiz scrollbar into the scrollView Also remove all the gutter width calculation. It was flawed anyway, --- src/editor-component.coffee | 51 ++++++++++------------------------ src/gutter-component.coffee | 9 ------ src/scrollbar-component.coffee | 8 +++--- 3 files changed, 18 insertions(+), 50 deletions(-) diff --git a/src/editor-component.coffee b/src/editor-component.coffee index 2ec55da8c..29029756e 100644 --- a/src/editor-component.coffee +++ b/src/editor-component.coffee @@ -24,7 +24,6 @@ EditorComponent = React.createClass visible: false autoHeight: false - gutterWidth: 0 pendingScrollTop: null pendingScrollLeft: null selectOnMouseMove: false @@ -94,8 +93,8 @@ EditorComponent = React.createClass div {className, style, tabIndex: -1}, if not mini and showLineNumbers GutterComponent { - ref: 'gutter', onMouseDown: @onGutterMouseDown, onWidthChanged: @onGutterWidthChanged, - lineDecorations, defaultCharWidth, editor, renderedRowRange, maxLineNumberDigits, scrollViewHeight, + ref: 'gutter', onMouseDown: @onGutterMouseDown, lineDecorations, + defaultCharWidth, editor, renderedRowRange, maxLineNumberDigits, scrollViewHeight, scrollTop, scrollHeight, lineHeightInPixels, @pendingChanges, mouseWheelScreenRow, @useHardwareAcceleration } @@ -121,6 +120,18 @@ EditorComponent = React.createClass placeholderText, @performedInitialMeasurement } + ScrollbarComponent + ref: 'horizontalScrollbar' + className: 'horizontal-scrollbar' + orientation: 'horizontal' + onScroll: @onHorizontalScroll + scrollLeft: scrollLeft + scrollWidth: scrollWidth + visible: horizontallyScrollable and not @refreshingScrollbars and not @measuringScrollbars + scrollableInOppositeDirection: verticallyScrollable + verticalScrollbarWidth: verticalScrollbarWidth + horizontalScrollbarHeight: horizontalScrollbarHeight + ScrollbarComponent ref: 'verticalScrollbar' className: 'vertical-scrollbar' @@ -133,19 +144,6 @@ EditorComponent = React.createClass verticalScrollbarWidth: verticalScrollbarWidth horizontalScrollbarHeight: horizontalScrollbarHeight - ScrollbarComponent - ref: 'horizontalScrollbar' - className: 'horizontal-scrollbar' - orientation: 'horizontal' - onScroll: @onHorizontalScroll - gutterWidth: @gutterWidth - scrollLeft: scrollLeft - scrollWidth: scrollWidth - visible: horizontallyScrollable and not @refreshingScrollbars and not @measuringScrollbars - scrollableInOppositeDirection: verticallyScrollable - verticalScrollbarWidth: verticalScrollbarWidth - horizontalScrollbarHeight: horizontalScrollbarHeight - # Also used to measure the height/width of scrollbars after the initial render ScrollbarCornerComponent ref: 'scrollbarCorner' @@ -213,8 +211,6 @@ EditorComponent = React.createClass @measureLineHeightAndDefaultCharWidthIfNeeded(prevState) @remeasureCharacterWidthsIfNeeded(prevState) - @measureGutterIfNeeded() - performInitialMeasurement: -> @updatesPaused = true @measureLineHeightAndDefaultCharWidth() @@ -671,7 +667,6 @@ EditorComponent = React.createClass editor.setSelectedScreenRange([tailPosition, [dragRow + 1, 0]]) onStylesheetsChanged: (stylesheet) -> - @measureGutter() @refreshScrollbars() if @containsScrollbarSelector(stylesheet) @remeasureCharacterWidthsIfVisibleAfterNextUpdate = true @requestUpdate() if @visible @@ -838,23 +833,6 @@ EditorComponent = React.createClass remeasureCharacterWidths: -> @refs.lines.remeasureCharacterWidths() - onGutterWidthChanged: (gutterWidth) -> - if gutterWidth isnt @gutterWidth - @gutterWidth = gutterWidth - @requestUpdate() - - measureGutterIfNeeded: -> - if @visible and @measureGutterWhenEditorIsVisible - @measureGutterWhenEditorIsVisible = false - @measureGutter() - - measureGutter: -> - if @state.showLineNumbers - @refs.gutter.measureWidth() - else - @gutterWidth = 0 - @requestUpdate() - measureScrollbars: -> return unless @visible @measuringScrollbars = false @@ -951,7 +929,6 @@ EditorComponent = React.createClass @setState({showInvisibles}) setShowLineNumbers: (showLineNumbers) -> - @measureGutterWhenEditorIsVisible = true @setState({showLineNumbers}) setScrollSensitivity: (scrollSensitivity) -> diff --git a/src/gutter-component.coffee b/src/gutter-component.coffee index 19fd6b4d4..01106fa4c 100644 --- a/src/gutter-component.coffee +++ b/src/gutter-component.coffee @@ -66,9 +66,6 @@ GutterComponent = React.createClass @clearScreenRowCaches() unless oldProps.lineHeightInPixels is @props.lineHeightInPixels @updateLineNumbers() - unless isEqualForProperties(oldProps, @props, 'maxLineNumberDigits', 'defaultCharWidth') - @measureWidth() - clearScreenRowCaches: -> @lineNumberIdsByScreenRow = {} @screenRowsByLineNumberId = {} @@ -223,9 +220,3 @@ GutterComponent = React.createClass editor.unfoldBufferRow(bufferRow) else editor.foldBufferRow(bufferRow) - - measureWidth: -> - width = @getDOMNode().offsetWidth - unless width is @measuredWidth - @measuredWidth = width - @props.onWidthChanged?(width) diff --git a/src/scrollbar-component.coffee b/src/scrollbar-component.coffee index ba284e0a0..b8657b594 100644 --- a/src/scrollbar-component.coffee +++ b/src/scrollbar-component.coffee @@ -7,7 +7,7 @@ ScrollbarComponent = React.createClass displayName: 'ScrollbarComponent' render: -> - {orientation, className, scrollHeight, scrollWidth, gutterWidth, visible} = @props + {orientation, className, scrollHeight, scrollWidth, visible} = @props {scrollableInOppositeDirection, horizontalScrollbarHeight, verticalScrollbarWidth} = @props style = {} @@ -17,9 +17,9 @@ ScrollbarComponent = React.createClass style.width = verticalScrollbarWidth style.bottom = horizontalScrollbarHeight if scrollableInOppositeDirection when 'horizontal' - style.height = horizontalScrollbarHeight + style.left = 0 style.right = verticalScrollbarWidth if scrollableInOppositeDirection - style.left = gutterWidth + style.height = horizontalScrollbarHeight div {className, style, @onScroll}, switch orientation @@ -41,7 +41,7 @@ ScrollbarComponent = React.createClass when 'vertical' not isEqualForProperties(newProps, @props, 'scrollHeight', 'scrollTop', 'scrollableInOppositeDirection') when 'horizontal' - not isEqualForProperties(newProps, @props, 'scrollWidth', 'scrollLeft', 'gutterWidth', 'scrollableInOppositeDirection') + not isEqualForProperties(newProps, @props, 'scrollWidth', 'scrollLeft', 'scrollableInOppositeDirection') componentDidUpdate: -> {orientation, scrollTop, scrollLeft} = @props From 3295b9b0dd52ec7aba521f8db4eb986ae23b4502 Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Wed, 23 Jul 2014 16:25:10 -0700 Subject: [PATCH 6/7] Romove runSetImmediateCallbacks() in many cases MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This is because of the removal of the gutter measurement. When there was measurement, every load of the editor would measure and request at least one render based on the reset of the gutter width. These specs don’t need to call runSetImmediateCallbacks() as they either don’t do anything to cause a render or they render immediately (in the case of updated options). In some cases, we need to make sure nothing happened, so I added a hasSetImmediateCallbacks() function, which is used in specs where nothing should have happened. --- spec/editor-component-spec.coffee | 23 ++++++++--------------- 1 file changed, 8 insertions(+), 15 deletions(-) diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index 883049753..d8efa8150 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -7,7 +7,7 @@ nbsp = String.fromCharCode(160) describe "EditorComponent", -> [contentNode, editor, wrapperView, wrapperNode, component, componentNode, verticalScrollbarNode, horizontalScrollbarNode] = [] - [lineHeightInPixels, charWidth, delayAnimationFrames, nextAnimationFrame, runSetImmediateCallbacks, lineOverdrawMargin] = [] + [lineHeightInPixels, charWidth, delayAnimationFrames, nextAnimationFrame, runSetImmediateCallbacks, hasSetImmediateCallbacks, lineOverdrawMargin] = [] beforeEach -> lineOverdrawMargin = 2 @@ -41,6 +41,9 @@ describe "EditorComponent", -> setImmediateFns.length = 0 fn() for fn in fns + hasSetImmediateCallbacks = -> + setImmediateFns.length isnt 0 + spyOn(window, 'setImmediate').andCallFake (fn) -> setImmediateFns.push(fn) contentNode = document.querySelector('#jasmine-content') @@ -269,7 +272,6 @@ describe "EditorComponent", -> describe "when indent guides are enabled", -> beforeEach -> component.setShowIndentGuide(true) - runSetImmediateCallbacks() it "adds an 'indent-guide' class to spans comprising the leading whitespace", -> line1LeafNodes = getLeafNodes(component.lineNodeForScreenRow(1)) @@ -346,7 +348,6 @@ describe "EditorComponent", -> describe "when indent guides are disabled", -> beforeEach -> component.setShowIndentGuide(false) - runSetImmediateCallbacks() it "does not render indent guides on lines containing only whitespace", -> editor.getBuffer().insert([1, Infinity], '\n ') @@ -563,7 +564,7 @@ describe "EditorComponent", -> it "does not fold when the line number componentNode is clicked", -> lineNumber = component.lineNumberNodeForScreenRow(1) lineNumber.dispatchEvent(buildClickEvent(lineNumber)) - runSetImmediateCallbacks() + expect(hasSetImmediateCallbacks()).toBe false expect(lineNumberHasClass(1, 'folded')).toBe false describe "cursor rendering", -> @@ -1404,7 +1405,6 @@ describe "EditorComponent", -> beforeEach -> cursor = editor.getCursor() cursor.setScreenPosition([0, 0]) - runSetImmediateCallbacks() it "adds the 'has-selection' class to the editor when there is a selection", -> expect(componentNode.classList.contains('has-selection')).toBe false @@ -1566,7 +1566,6 @@ describe "EditorComponent", -> runSetImmediateCallbacks() expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() - expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' it "updates the position and width of the horizontal scrollbar when editor.showLineNumbers is toggled", -> componentNode.style.width = 10 * charWidth + 'px' @@ -1703,7 +1702,7 @@ describe "EditorComponent", -> wheelEvent = new WheelEvent('mousewheel', wheelDeltaX: 0, wheelDeltaY: 10) Object.defineProperty(wheelEvent, 'target', get: -> lineNode) componentNode.dispatchEvent(wheelEvent) - runSetImmediateCallbacks() + expect(hasSetImmediateCallbacks()).toBe false expect(editor.getScrollTop()).toBe 0 @@ -1720,7 +1719,7 @@ describe "EditorComponent", -> wheelEvent = new WheelEvent('mousewheel', wheelDeltaX: 0, wheelDeltaY: 100) # goes nowhere, we're already at scrollTop 0 Object.defineProperty(wheelEvent, 'target', get: -> lineNode) componentNode.dispatchEvent(wheelEvent) - runSetImmediateCallbacks() + expect(hasSetImmediateCallbacks()).toBe false expect(component.mouseWheelScreenRow).toBe 0 editor.insertText("hello") @@ -1818,7 +1817,7 @@ describe "EditorComponent", -> it "does not handle input events when input is disabled", -> component.setInputEnabled(false) componentNode.dispatchEvent(buildTextInputEvent(data: 'x', target: inputNode)) - runSetImmediateCallbacks() + expect(hasSetImmediateCallbacks()).toBe false expect(editor.lineForBufferRow(0)).toBe 'var quicksort = function () {' describe "when IME composition is used to insert international characters", -> @@ -1936,7 +1935,6 @@ describe "EditorComponent", -> hiddenParent.style.display = 'block' advanceClock(component.domPollingInterval) - runSetImmediateCallbacks() expect(componentNode.querySelectorAll('.line').length).toBeGreaterThan 0 @@ -1946,7 +1944,6 @@ describe "EditorComponent", -> initialLineHeightInPixels = editor.getLineHeightInPixels() component.setLineHeight(2) - runSetImmediateCallbacks() expect(editor.getLineHeightInPixels()).toBe initialLineHeightInPixels wrapperView.show() @@ -1959,7 +1956,6 @@ describe "EditorComponent", -> initialCharWidth = editor.getDefaultCharWidth() component.setFontSize(22) - runSetImmediateCallbacks() expect(editor.getLineHeightInPixels()).toBe initialLineHeightInPixels expect(editor.getDefaultCharWidth()).toBe initialCharWidth @@ -1971,7 +1967,6 @@ describe "EditorComponent", -> wrapperView.hide() component.setFontSize(22) - runSetImmediateCallbacks() wrapperView.show() editor.setCursorBufferPosition([0, Infinity]) @@ -1988,7 +1983,6 @@ describe "EditorComponent", -> initialCharWidth = editor.getDefaultCharWidth() component.setFontFamily('sans-serif') - runSetImmediateCallbacks() expect(editor.getDefaultCharWidth()).toBe initialCharWidth wrapperView.show() @@ -1998,7 +1992,6 @@ describe "EditorComponent", -> wrapperView.hide() component.setFontFamily('sans-serif') - runSetImmediateCallbacks() wrapperView.show() editor.setCursorBufferPosition([0, Infinity]) From 242df788e652f7ba61014a4e279efb2ec4b9385c Mon Sep 17 00:00:00 2001 From: Ben Ogle Date: Wed, 23 Jul 2014 16:25:24 -0700 Subject: [PATCH 7/7] Remove unnecessary scrollbar specs --- spec/editor-component-spec.coffee | 50 ------------------------------- 1 file changed, 50 deletions(-) diff --git a/spec/editor-component-spec.coffee b/spec/editor-component-spec.coffee index d8efa8150..58d061505 100644 --- a/spec/editor-component-spec.coffee +++ b/spec/editor-component-spec.coffee @@ -1566,58 +1566,8 @@ describe "EditorComponent", -> runSetImmediateCallbacks() expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() - - it "updates the position and width of the horizontal scrollbar when editor.showLineNumbers is toggled", -> - componentNode.style.width = 10 * charWidth + 'px' - component.measureHeightAndWidth() - runSetImmediateCallbacks() - - gutterNode = componentNode.querySelector('.gutter') - expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() - expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' - - atom.config.set("editor.showLineNumbers", false) - runSetImmediateCallbacks() - gutterNode = componentNode.querySelector('.gutter') - expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() expect(horizontalScrollbarNode.style.left).toBe '0px' - atom.config.set("editor.showLineNumbers", true) - runSetImmediateCallbacks() - gutterNode = componentNode.querySelector('.gutter') - expect(horizontalScrollbarNode.scrollWidth).toBe editor.getScrollWidth() - expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' - - describe "when the editor is hidden", -> - hideEditorView = -> - wrapperNode.style.display = 'none' - expect(component.isVisible()).toBe false - - showEditorView = -> - wrapperNode.style.display = 'block' - expect(component.isVisible()).toBe true - - it "updates the position of the horizontal scrollbar only when the editor is visible", -> - # toggling gutter off - hideEditorView() - atom.config.set("editor.showLineNumbers", false) - - showEditorView() - component.forceUpdate() - runSetImmediateCallbacks() - gutterNode = componentNode.querySelector('.gutter') - expect(horizontalScrollbarNode.style.left).toBe '0px' - - # toggling gutter back on - hideEditorView() - atom.config.set("editor.showLineNumbers", true) - - showEditorView() - component.forceUpdate() - runSetImmediateCallbacks() - gutterNode = componentNode.querySelector('.gutter') - expect(horizontalScrollbarNode.style.left).toBe gutterNode.offsetWidth + 'px' - describe "mousewheel events", -> beforeEach -> atom.config.set('editor.scrollSensitivity', 100)