diff --git a/spec/text-editor-component-spec.js b/spec/text-editor-component-spec.js index e23ede439..61998ee2d 100644 --- a/spec/text-editor-component-spec.js +++ b/spec/text-editor-component-spec.js @@ -4368,6 +4368,34 @@ describe('TextEditorComponent', function () { }) }) + describe('width', function () { + it('sizes the editor element according to the content width when auto width is true, or according to the container width otherwise', function () { + contentNode.style.width = '600px' + component.measureDimensions() + editor.setText("abcdefghi") + runAnimationFrames() + expect(wrapperNode.offsetWidth).toBe(contentNode.offsetWidth) + + global.debug = true + editor.update({autoWidth: true}) + runAnimationFrames() + const editorWidth1 = wrapperNode.offsetWidth + expect(editorWidth1).toBeGreaterThan(0) + expect(editorWidth1).toBeLessThan(contentNode.offsetWidth) + + editor.setText("abcdefghijkl") + editor.update({autoWidth: true}) + runAnimationFrames() + const editorWidth2 = wrapperNode.offsetWidth + expect(editorWidth2).toBeGreaterThan(editorWidth1) + expect(editorWidth2).toBeLessThan(contentNode.offsetWidth) + + editor.update({autoWidth: false}) + runAnimationFrames() + expect(wrapperNode.offsetWidth).toBe(contentNode.offsetWidth) + }) + }) + describe('when the "mini" property is true', function () { beforeEach(function () { editor.setMini(true) diff --git a/spec/text-editor-presenter-spec.coffee b/spec/text-editor-presenter-spec.coffee index 13e6d218e..efa1c3393 100644 --- a/spec/text-editor-presenter-spec.coffee +++ b/spec/text-editor-presenter-spec.coffee @@ -2676,7 +2676,7 @@ describe "TextEditorPresenter", -> expect(getState(presenter).content.width).toBe(3 * 10 + 27 + 1) describe "when `editor.autoWidth` is true", -> - it "equals to the width of the content + the vertical scrollbar width", -> + it "equals to the content width + the vertical scrollbar width", -> editor.setText('abc\ndef\nghi\njkl') presenter = buildPresenter(explicitHeight: 10, contentFrameWidth: 300, verticalScrollbarWidth: 7, baseCharacterWidth: 10) expectStateUpdate presenter, -> editor.update({autoWidth: true}) diff --git a/src/text-editor-component.coffee b/src/text-editor-component.coffee index 262b62301..265f884fe 100644 --- a/src/text-editor-component.coffee +++ b/src/text-editor-component.coffee @@ -129,7 +129,7 @@ class TextEditorComponent updateSync: -> @updateSyncPreMeasurement() - @oldState ?= {} + @oldState ?= {content: {}} @newState = @presenter.getPostMeasurementState() if @editor.getLastSelection()? and not @editor.getLastSelection().isEmpty() @@ -149,6 +149,15 @@ class TextEditorComponent else @domNode.style.height = '' + if (@newState.content.autoWidth isnt @oldState.content.autoWidth) or (@newState.content.width isnt @oldState.content.width) + if @newState.content.autoWidth + @hostElement.style.width = @newState.content.width + 'px' + else + @hostElement.style.width = '' + + @oldState.content.width = @newState.content.width + @oldState.content.autoWidth = @newState.content.autoWidth + if @newState.gutters.length @mountGutterContainerComponent() unless @gutterContainerComponent? @gutterContainerComponent.updateSync(@newState)