diff --git a/spec/spec-helper.coffee b/spec/spec-helper.coffee index 9c4e09da0..2156e76c0 100644 --- a/spec/spec-helper.coffee +++ b/spec/spec-helper.coffee @@ -87,7 +87,6 @@ beforeEach -> atom.config.set "editor.autoIndent", false atom.config.set "core.disabledPackages", ["package-that-throws-an-exception", "package-with-broken-package-json", "package-with-broken-keymap"] - atom.config.set "editor.useShadowDOM", true advanceClock(1000) window.setTimeout.reset() diff --git a/spec/text-editor-element-spec.coffee b/spec/text-editor-element-spec.coffee index c60a9762f..21e17e2a9 100644 --- a/spec/text-editor-element-spec.coffee +++ b/spec/text-editor-element-spec.coffee @@ -39,32 +39,17 @@ describe "TextEditorElement", -> expect(element.hasAttribute('mini')).toBe true describe "when the editor is attached to the DOM", -> - describe "when the editor.useShadowDOM config option is true", -> - it "mounts the react component and unmounts when removed from the dom", -> - atom.config.set('editor.useShadowDOM', true) + it "mounts the component and unmounts when removed from the dom", -> + element = new TextEditorElement + jasmine.attachToDOM(element) - element = new TextEditorElement - jasmine.attachToDOM(element) + component = element.component + expect(component.mounted).toBe true + element.remove() + expect(component.mounted).toBe false - component = element.component - expect(component.mounted).toBe true - element.remove() - expect(component.mounted).toBe false - - jasmine.attachToDOM(element) - expect(element.component.mounted).toBe true - - describe "when the editor.useShadowDOM config option is false", -> - it "mounts the react component and unmounts when removed from the dom", -> - atom.config.set('editor.useShadowDOM', false) - - element = new TextEditorElement - jasmine.attachToDOM(element) - - component = element.component - expect(component.mounted).toBe true - element.getModel().destroy() - expect(component.mounted).toBe false + jasmine.attachToDOM(element) + expect(element.component.mounted).toBe true describe "when the editor is detached from the DOM and then reattached", -> it "does not render duplicate line numbers", -> @@ -96,42 +81,21 @@ describe "TextEditorElement", -> expect(element.shadowRoot.querySelectorAll('.decoration').length).toBe initialDecorationCount describe "focus and blur handling", -> - describe "when the editor.useShadowDOM config option is true", -> - it "proxies focus/blur events to/from the hidden input inside the shadow root", -> - atom.config.set('editor.useShadowDOM', true) + it "proxies focus/blur events to/from the hidden input inside the shadow root", -> + element = new TextEditorElement + jasmineContent.appendChild(element) - element = new TextEditorElement - jasmineContent.appendChild(element) + blurCalled = false + element.addEventListener 'blur', -> blurCalled = true - blurCalled = false - element.addEventListener 'blur', -> blurCalled = true + element.focus() + expect(blurCalled).toBe false + expect(element.hasFocus()).toBe true + expect(document.activeElement).toBe element + expect(element.shadowRoot.activeElement).toBe element.shadowRoot.querySelector('input') - element.focus() - expect(blurCalled).toBe false - expect(element.hasFocus()).toBe true - expect(document.activeElement).toBe element - expect(element.shadowRoot.activeElement).toBe element.shadowRoot.querySelector('input') - - document.body.focus() - expect(blurCalled).toBe true - - describe "when the editor.useShadowDOM config option is false", -> - it "proxies focus/blur events to/from the hidden input", -> - atom.config.set('editor.useShadowDOM', false) - - element = new TextEditorElement - jasmineContent.appendChild(element) - - blurCalled = false - element.addEventListener 'blur', -> blurCalled = true - - element.focus() - expect(blurCalled).toBe false - expect(element.hasFocus()).toBe true - expect(document.activeElement).toBe element.querySelector('input') - - document.body.focus() - expect(blurCalled).toBe true + document.body.focus() + expect(blurCalled).toBe true describe "when focused while a parent node is being attached to the DOM", -> class ElementThatFocusesChild extends HTMLDivElement @@ -162,8 +126,6 @@ describe "TextEditorElement", -> themeReloadCallback = fn new Disposable - atom.config.set("editor.useShadowDOM", false) - element = new TextEditorElement() element.style.height = '200px' element.getModel().setText [0..20].join("\n") diff --git a/src/config-schema.coffee b/src/config-schema.coffee index c113f53db..107f5600a 100644 --- a/src/config-schema.coffee +++ b/src/config-schema.coffee @@ -218,11 +218,6 @@ module.exports = default: 300 minimum: 0 description: 'Time interval in milliseconds within which text editing operations will be grouped together in the undo history.' - useShadowDOM: - type: 'boolean' - default: true - title: 'Use Shadow DOM' - description: 'Disable if you experience styling issues with packages or themes. Be sure to open an issue on the relevant package or theme, because this option is going away eventually.' confirmCheckoutHeadRevision: type: 'boolean' default: true diff --git a/src/lines-component.coffee b/src/lines-component.coffee index bb9634ec2..3d40786a5 100644 --- a/src/lines-component.coffee +++ b/src/lines-component.coffee @@ -21,7 +21,7 @@ module.exports = class LinesComponent extends TiledComponent placeholderTextDiv: null - constructor: ({@presenter, @useShadowDOM, @domElementPool, @assert, @grammars}) -> + constructor: ({@presenter, @domElementPool, @assert, @grammars}) -> @domNode = document.createElement('div') @domNode.classList.add('lines') @tilesNode = document.createElement("div") @@ -34,10 +34,9 @@ class LinesComponent extends TiledComponent @cursorsComponent = new CursorsComponent @domNode.appendChild(@cursorsComponent.getDomNode()) - if @useShadowDOM - insertionPoint = document.createElement('content') - insertionPoint.setAttribute('select', '.overlayer') - @domNode.appendChild(insertionPoint) + insertionPoint = document.createElement('content') + insertionPoint.setAttribute('select', '.overlayer') + @domNode.appendChild(insertionPoint) getDomNode: -> @domNode diff --git a/src/text-editor-component.coffee b/src/text-editor-component.coffee index 2786e321e..040e35e6e 100644 --- a/src/text-editor-component.coffee +++ b/src/text-editor-component.coffee @@ -42,7 +42,7 @@ class TextEditorComponent @assert domNode?, "TextEditorComponent::domNode was set to null." @domNodeValue = domNode - constructor: ({@editor, @hostElement, @rootElement, @stylesElement, @useShadowDOM, tileSize, @views, @themes, @config, @workspace, @assert, @grammars, scrollPastEnd}) -> + constructor: ({@editor, @hostElement, @rootElement, @stylesElement, tileSize, @views, @themes, @workspace, @assert, @grammars, scrollPastEnd}) -> @tileSize = tileSize if tileSize? @disposables = new CompositeDisposable @@ -55,7 +55,6 @@ class TextEditorComponent cursorBlinkPeriod: @cursorBlinkPeriod cursorBlinkResumeDelay: @cursorBlinkResumeDelay stoppedScrollingDelay: 200 - config: @config lineTopIndex: lineTopIndex scrollPastEnd: scrollPastEnd @@ -63,17 +62,13 @@ class TextEditorComponent @domElementPool = new DOMElementPool @domNode = document.createElement('div') - if @useShadowDOM - @domNode.classList.add('editor-contents--private') + @domNode.classList.add('editor-contents--private') - insertionPoint = document.createElement('content') - insertionPoint.setAttribute('select', 'atom-overlay') - @domNode.appendChild(insertionPoint) - @overlayManager = new OverlayManager(@presenter, @hostElement, @views) - @blockDecorationsComponent = new BlockDecorationsComponent(@hostElement, @views, @presenter, @domElementPool) - else - @domNode.classList.add('editor-contents') - @overlayManager = new OverlayManager(@presenter, @domNode, @views) + insertionPoint = document.createElement('content') + insertionPoint.setAttribute('select', 'atom-overlay') + @domNode.appendChild(insertionPoint) + @overlayManager = new OverlayManager(@presenter, @hostElement, @views) + @blockDecorationsComponent = new BlockDecorationsComponent(@hostElement, @views, @presenter, @domElementPool) @scrollViewNode = document.createElement('div') @scrollViewNode.classList.add('scroll-view') @@ -82,7 +77,7 @@ class TextEditorComponent @hiddenInputComponent = new InputComponent @scrollViewNode.appendChild(@hiddenInputComponent.getDomNode()) - @linesComponent = new LinesComponent({@presenter, @hostElement, @useShadowDOM, @domElementPool, @assert, @grammars}) + @linesComponent = new LinesComponent({@presenter, @hostElement, @domElementPool, @assert, @grammars}) @scrollViewNode.appendChild(@linesComponent.getDomNode()) if @blockDecorationsComponent? diff --git a/src/text-editor-element.coffee b/src/text-editor-element.coffee index 0c9fa6123..7ffa5d8aa 100644 --- a/src/text-editor-element.coffee +++ b/src/text-editor-element.coffee @@ -22,7 +22,6 @@ class TextEditorElement extends HTMLElement createdCallback: -> # Use globals when the following instance variables aren't set. - @config = atom.config @themes = atom.themes @workspace = atom.workspace @assert = atom.assert @@ -43,31 +42,22 @@ class TextEditorElement extends HTMLElement unless @autoHeight @style.height = "100%" - if @config.get('editor.useShadowDOM') - @useShadowDOM = true + unless ShadowStyleSheet? + ShadowStyleSheet = document.createElement('style') + ShadowStyleSheet.textContent = @themes.loadLessStylesheet(require.resolve('../static/text-editor-shadow.less')) - unless ShadowStyleSheet? - ShadowStyleSheet = document.createElement('style') - ShadowStyleSheet.textContent = @themes.loadLessStylesheet(require.resolve('../static/text-editor-shadow.less')) + @createShadowRoot() - @createShadowRoot() + @shadowRoot.appendChild(ShadowStyleSheet.cloneNode(true)) + @stylesElement = new StylesElement + @stylesElement.initialize(@styles) + @stylesElement.setAttribute('context', 'atom-text-editor') - @shadowRoot.appendChild(ShadowStyleSheet.cloneNode(true)) - @stylesElement = new StylesElement - @stylesElement.initialize(@styles) - @stylesElement.setAttribute('context', 'atom-text-editor') + @rootElement = document.createElement('div') + @rootElement.classList.add('editor--private') - @rootElement = document.createElement('div') - @rootElement.classList.add('editor--private') - - @shadowRoot.appendChild(@stylesElement) - @shadowRoot.appendChild(@rootElement) - else - @useShadowDOM = false - - @classList.add('editor', 'editor-colors') - @stylesElement = document.head.querySelector('atom-styles') - @rootElement = this + @shadowRoot.appendChild(@stylesElement) + @shadowRoot.appendChild(@rootElement) attachedCallback: -> @buildModel() unless @getModel()? @@ -91,9 +81,8 @@ class TextEditorElement extends HTMLElement @subscriptions.add @component.onDidChangeScrollLeft => @emitter.emit("did-change-scroll-left", arguments...) - initialize: (model, {@views, @config, @themes, @workspace, @assert, @styles, @grammars}, @autoHeight = true, @scrollPastEnd = true) -> + initialize: (model, {@views, @themes, @workspace, @assert, @styles, @grammars}, @autoHeight = true, @scrollPastEnd = true) -> throw new Error("Must pass a views parameter when initializing TextEditorElements") unless @views? - throw new Error("Must pass a config parameter when initializing TextEditorElements") unless @config? throw new Error("Must pass a themes parameter when initializing TextEditorElements") unless @themes? throw new Error("Must pass a workspace parameter when initializing TextEditorElements") unless @workspace? throw new Error("Must pass an assert parameter when initializing TextEditorElements") unless @assert? @@ -141,10 +130,8 @@ class TextEditorElement extends HTMLElement stylesElement: @stylesElement editor: @model tileSize: @tileSize - useShadowDOM: @useShadowDOM views: @views themes: @themes - config: @config workspace: @workspace assert: @assert grammars: @grammars @@ -152,12 +139,7 @@ class TextEditorElement extends HTMLElement ) @rootElement.appendChild(@component.getDomNode()) - if @useShadowDOM - @shadowRoot.addEventListener('blur', @shadowRootBlurred.bind(this), true) - else - inputNode = @component.hiddenInputComponent.getDomNode() - inputNode.addEventListener 'focus', @focused.bind(this) - inputNode.addEventListener 'blur', => @dispatchEvent(new FocusEvent('blur', bubbles: false)) + @shadowRoot.addEventListener('blur', @shadowRootBlurred.bind(this), true) unmountComponent: -> if @component? @@ -169,11 +151,6 @@ class TextEditorElement extends HTMLElement @component?.focused() blurred: (event) -> - unless @useShadowDOM - if event.relatedTarget is @component.hiddenInputComponent.getDomNode() - event.stopImmediatePropagation() - return - @component?.blurred() # Work around what seems to be a bug in Chromium. Focus can be stolen from the