diff --git a/src/browser/Terminal.ts b/src/browser/Terminal.ts index 37883ded..c8769e0b 100644 --- a/src/browser/Terminal.ts +++ b/src/browser/Terminal.ts @@ -275,38 +275,6 @@ export class Terminal extends CoreTerminal implements ITerminal { } } - protected _updateOptions(key: string): void { - // TODO: These listeners should be owned by individual components - switch (key) { - case 'fontFamily': - case 'fontSize': - // When the font changes the size of the cells may change which requires a renderer clear - this._renderService?.clear(); - this._charSizeService?.measure(); - break; - case 'cursorBlink': - case 'cursorStyle': - // The DOM renderer needs a row refresh to update the cursor styles - this.refresh(this.buffer.y, this.buffer.y); - break; - case 'customGlyphs': - case 'drawBoldTextInBrightColors': - case 'letterSpacing': - case 'lineHeight': - case 'fontWeight': - case 'fontWeightBold': - case 'minimumContrastRatio': - // TODO: move to render service - // When the font changes the size of the cells may change which requires a renderer clear - if (this._renderService) { - this._renderService.clear(); - this._renderService.handleResize(this.cols, this.rows); - this.refresh(0, this.rows - 1); - } - break; - } - } - /** * Binds the desired focus behavior on a given terminal object. */ diff --git a/src/browser/services/CharSizeService.ts b/src/browser/services/CharSizeService.ts index c75b8de0..45bbe840 100644 --- a/src/browser/services/CharSizeService.ts +++ b/src/browser/services/CharSizeService.ts @@ -7,6 +7,7 @@ import { IOptionsService } from 'common/services/Services'; import { EventEmitter } from 'common/EventEmitter'; import { ICharSizeService } from 'browser/services/Services'; import { Disposable } from 'common/Lifecycle'; +import { ITerminalOptions } from 'common/Types'; export class CharSizeService extends Disposable implements ICharSizeService { public serviceBrand: undefined; @@ -27,8 +28,7 @@ export class CharSizeService extends Disposable implements ICharSizeService { ) { super(); this._measureStrategy = new DomMeasureStrategy(document, parentElement, this._optionsService); - // TODO: ... - // this.register(this._optionsService.onSpecificOptionChange( + this.register(this._optionsService.onMultipleOptionChange(['fontFamily', 'fontSize'], () => this.measure())); } public measure(): void { diff --git a/src/browser/services/RenderService.ts b/src/browser/services/RenderService.ts index dd0c6b50..1e1943df 100644 --- a/src/browser/services/RenderService.ts +++ b/src/browser/services/RenderService.ts @@ -84,8 +84,28 @@ export class RenderService extends Disposable implements IRenderService { this.register(decorationService.onDecorationRegistered(() => this._fullRefresh())); this.register(decorationService.onDecorationRemoved(() => this._fullRefresh())); - // No need to register this as renderer is explicitly disposed in RenderService.dispose - // this._renderer.onRequestRedraw(e => this.refreshRows(e.start, e.end, true)); + // Clear the renderer when the a change that could affect glyphs occurs + this.register(optionsService.onMultipleOptionChange([ + 'customGlyphs', + 'drawBoldTextInBrightColors', + 'letterSpacing', + 'lineHeight', + 'fontFamily', + 'fontSize', + 'fontWeight', + 'fontWeightBold', + 'minimumContrastRatio' + ], () => { + this.clear(); + this.handleResize(bufferService.cols, bufferService.rows); + this._fullRefresh(); + })); + + // Refresh the cursor line when the cursor changes + this.register(optionsService.onMultipleOptionChange([ + 'cursorBlink', + 'cursorStyle' + ], () => this.refreshRows(bufferService.buffer.y, bufferService.buffer.y, true))); // dprchange should handle this case, we need this as well for browsers that don't support the // matchMedia query.