github/atom
1
1
Fork 0
mirror of https://github.com/atom/atom.git synced 2026-01-23 13:58:08 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14895 from atom/as-fix-block-decoration-measurements

Browse Source 
Fix measuring block decorations if adding them before attaching element
This commit is contained in:
Antonio Scandurra
2017-06-27 11:33:58 +02:00
committed by GitHub
parent 33f010e92c 52ba6c7342
commit 71a2abf877
2 changed files with 31 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
spec/text-editor-component-spec.js
View File

@@ -2035,6 +2035,31 @@ describe('TextEditorComponent', () => {
expect(item6.previousSibling).toBe(lineNodeForScreenRow(component, 12))
})
it('measures block decorations correctly when they are added before the component width has been updated', async () => {
{
const {editor, component, element} = buildComponent({autoHeight: false, width: 500, attach: false})
const marker = editor.markScreenPosition([0, 0])
const item = document.createElement('div')
item.textContent = 'block decoration'
const decoration = editor.decorateMarker(marker, {type: 'block', item})
jasmine.attachToDOM(element)
assertLinesAreAlignedWithLineNumbers(component)
}
{
const {editor, component, element} = buildComponent({autoHeight: false, width: 800})
const marker = editor.markScreenPosition([0, 0])
const item = document.createElement('div')
item.textContent = 'block decoration that could wrap many times'
const decoration = editor.decorateMarker(marker, {type: 'block', item})
element.style.width = '50px'
await component.getNextUpdatePromise()
assertLinesAreAlignedWithLineNumbers(component)
}
})
it('bases the width of the block decoration measurement area on the editor scroll width', async () => {
const {component, element} = buildComponent({autoHeight: false, width: 150})
expect(component.refs.blockDecorationMeasurementArea.offsetWidth).toBe(component.getScrollWidth())

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

@@ -312,6 +312,11 @@ class TextEditorComponent {
}
})
if (this.resizeBlockDecorationMeasurementsArea) {
this.resizeBlockDecorationMeasurementsArea = false
this.refs.blockDecorationMeasurementArea.style.width = this.getScrollWidth() + 'px'
}
this.blockDecorationsToMeasure.forEach((decoration) => {
const {item} = decoration.getProperties()
const decorationElement = TextEditor.viewForItem(item)
@@ -1391,6 +1396,7 @@ class TextEditorComponent {
if (!this.hasInitialMeasurements) this.measureDimensions()
this.visible = true
this.props.model.setVisible(true)
this.resizeBlockDecorationMeasurementsArea = true
this.updateSync()
this.flushPendingLogicalScrollPosition()
}