diff --git a/src/browser/TestUtils.test.ts b/src/browser/TestUtils.test.ts index 85e2bb55..cb487dbc 100644 --- a/src/browser/TestUtils.test.ts +++ b/src/browser/TestUtils.test.ts @@ -396,9 +396,6 @@ export class MockRenderService implements IRenderService { public resize(cols: number, rows: number): void { throw new Error('Method not implemented.'); } - public changeOptions(): void { - throw new Error('Method not implemented.'); - } public setRenderer(renderer: IRenderer): void { throw new Error('Method not implemented.'); } diff --git a/src/browser/decorations/BufferDecorationRenderer.ts b/src/browser/decorations/BufferDecorationRenderer.ts index ac3457f3..00b2b00b 100644 --- a/src/browser/decorations/BufferDecorationRenderer.ts +++ b/src/browser/decorations/BufferDecorationRenderer.ts @@ -14,6 +14,7 @@ export class BufferDecorationRenderer extends Disposable { private _animationFrame: number | undefined; private _altBufferIsActive: boolean = false; + private _dimensionsChanged: boolean = false; constructor( private readonly _screenElement: HTMLElement, @@ -28,7 +29,10 @@ export class BufferDecorationRenderer extends Disposable { this._screenElement.appendChild(this._container); this.register(this._renderService.onRenderedBufferChange(() => this._queueRefresh())); - this.register(this._renderService.onDimensionsChange(() => this._queueRefresh())); + this.register(this._renderService.onDimensionsChange(() => { + this._dimensionsChanged = true; + this._queueRefresh(); + })); this.register(addDisposableDomListener(window, 'resize', () => this._queueRefresh())); this.register(this._bufferService.buffers.onBufferActivate(() => { this._altBufferIsActive = this._bufferService.buffer === this._bufferService.buffers.alt; @@ -57,10 +61,14 @@ export class BufferDecorationRenderer extends Disposable { for (const decoration of this._decorationService.decorations) { this._renderDecoration(decoration); } + this._dimensionsChanged = false; } private _renderDecoration(decoration: IInternalDecoration): void { this._refreshStyle(decoration); + if (this._dimensionsChanged) { + this._refreshXPosition(decoration); + } } private _createElement(decoration: IInternalDecoration): HTMLElement { @@ -76,11 +84,7 @@ export class BufferDecorationRenderer extends Disposable { // exceeded the container width, so hide element.style.display = 'none'; } - if ((decoration.options.anchor || 'left') === 'right') { - element.style.right = x ? `${x * this._renderService.dimensions.actualCellWidth}px` : ''; - } else { - element.style.left = x ? `${x * this._renderService.dimensions.actualCellWidth}px` : ''; - } + this._refreshXPosition(decoration); return element; } @@ -108,6 +112,18 @@ export class BufferDecorationRenderer extends Disposable { } } + private _refreshXPosition(decoration: IInternalDecoration): void { + if (!decoration.element) { + return; + } + const x = decoration.options.x ?? 0; + if ((decoration.options.anchor || 'left') === 'right') { + decoration.element.style.right = x ? `${x * this._renderService.dimensions.actualCellWidth}px` : ''; + } else { + decoration.element.style.left = x ? `${x * this._renderService.dimensions.actualCellWidth}px` : ''; + } + } + private _removeDecoration(decoration: IInternalDecoration): void { this._decorationElements.get(decoration)?.remove(); this._decorationElements.delete(decoration); diff --git a/src/browser/services/RenderService.ts b/src/browser/services/RenderService.ts index b2e619fe..75c2d3c8 100644 --- a/src/browser/services/RenderService.ts +++ b/src/browser/services/RenderService.ts @@ -70,7 +70,7 @@ export class RenderService extends Disposable implements IRenderService { this.register(bufferService.onResize(() => this._fullRefresh())); this.register(bufferService.buffers.onBufferActivate(() => this._renderer?.clear())); - this.register(optionsService.onOptionChange(() => this._renderer.onOptionsChanged())); + this.register(optionsService.onOptionChange(() => this._handleOptionsChanged())); this.register(this._charSizeService.onCharSizeChange(() => this.onCharSizeChanged())); // Do a full refresh whenever any decoration is added or removed. This may not actually result @@ -142,7 +142,7 @@ export class RenderService extends Disposable implements IRenderService { this._fireOnCanvasResize(); } - public changeOptions(): void { + private _handleOptionsChanged(): void { this._renderer.onOptionsChanged(); this.refreshRows(0, this._rowCount - 1); this._fireOnCanvasResize(); diff --git a/src/browser/services/Services.ts b/src/browser/services/Services.ts index 7191d0ed..a9f76a90 100644 --- a/src/browser/services/Services.ts +++ b/src/browser/services/Services.ts @@ -61,7 +61,6 @@ export interface IRenderService extends IDisposable { refreshRows(start: number, end: number): void; clearTextureAtlas(): void; resize(cols: number, rows: number): void; - changeOptions(): void; setRenderer(renderer: IRenderer): void; setColors(colors: IColorSet): void; onDevicePixelRatioChange(): void;