github/atom
1
1
Fork 0
mirror of https://github.com/atom/atom.git synced 2026-02-08 05:35:04 -05:00
Code Issues Packages Projects Releases Wiki Activity

Prevent block decoration margins from collapsing during measurement

Browse Source 
We now render a 1px high sentinel element between off-screen block
decorations before measuring them to prevent margins from collapsing.
This commit is contained in:
Nathan Sobo
2017-08-20 08:23:41 -06:00
parent 835ed10f7c
commit 3d0d1ae44e
2 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/text-editor-component.js
View File

@@ -120,6 +120,8 @@ class TextEditorComponent {
this.horizontalPixelPositionsByScreenLineId = new Map() // Values are maps from column to horiontal pixel positions
this.blockDecorationsToMeasure = new Set()
this.blockDecorationsByElement = new WeakMap()
this.blockDecorationSentinel = document.createElement('div')
this.blockDecorationSentinel.style.height = '1px'
this.heightsByBlockDecoration = new WeakMap()
this.blockDecorationResizeObserver = new ResizeObserver(this.didResizeBlockDecorations.bind(this))
this.lineNodesByScreenLineId = new Map()
@@ -309,21 +311,22 @@ class TextEditorComponent {
const parentElement = decorationElement.parentElement
if (!decorationElement.previousSibling) {
const sentinelElement = document.createElement('div')
const sentinelElement = this.blockDecorationSentinel.cloneNode()
parentElement.insertBefore(sentinelElement, decorationElement)
sentinelElements.add(sentinelElement)
}
if (!decorationElement.nextSibling) {
const sentinelElement = document.createElement('div')
const sentinelElement = this.blockDecorationSentinel.cloneNode()
parentElement.appendChild(sentinelElement)
sentinelElements.add(sentinelElement)
}
this.didMeasureVisibleBlockDecoration = true
} else {
blockDecorationMeasurementArea.appendChild(this.blockDecorationSentinel.cloneNode())
blockDecorationMeasurementArea.appendChild(decorationElement)
blockDecorationMeasurementArea.appendChild(document.createElement('div'))
blockDecorationMeasurementArea.appendChild(this.blockDecorationSentinel.cloneNode())
}
})