Convert refresh to EventEmitter2

src/Terminal.ts

@@ -260,15 +260,13 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     this.options = clone(options);
     this._setup();
 
-    // TODO: Replace EventEmitter with EventEmitter2 internally
-    this.on('refresh', e => this._onRender.fire(e));
-
     // TODO: Remove these in v4
     // Fire old style events from new emitters
     this.onCursorMove(() => this.emit('cursormove'));
     this.onData(e => this.emit('data', e));
     this.onKey(e => this.emit('key', e.key, e.domEvent));
     this.onLineFeed(() => this.emit('linefeed'));
+    this.onRender(e => this.emit('refresh', e));
     this.onResize(e => this.emit('resize', e));
     this.onSelectionChange(() => this.emit('selection'));
     this.onScroll(e => this.emit('scroll', e));
@@ -687,8 +685,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     this.register(addDisposableDomListener(this.textarea, 'compositionstart', () => this._compositionHelper.compositionstart()));
     this.register(addDisposableDomListener(this.textarea, 'compositionupdate', (e: CompositionEvent) => this._compositionHelper.compositionupdate(e)));
     this.register(addDisposableDomListener(this.textarea, 'compositionend', () => this._compositionHelper.compositionend()));
-    this.register(this.addDisposableListener('refresh', () => this._compositionHelper.updateCompositionElements()));
-    this.register(this.addDisposableListener('refresh', (data) => this._queueLinkification(data.start, data.end)));
+    this.register(this.onRender(() => this._compositionHelper.updateCompositionElements()));
+    this.register(this.onRender(e => this._queueLinkification(e.start, e.end)));
   }
 
   /**
@@ -838,6 +836,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
       case 'dom': this.renderer = new DomRenderer(this, this.options.theme); break;
       default: throw new Error(`Unrecognized rendererType "${this.options.rendererType}"`);
     }
+    this.renderer.onRender(e => this._onRender.fire(e));
     this.register(this.renderer);
   }
 

src/renderer/Renderer.ts

@@ -15,6 +15,7 @@ import { RenderDebouncer } from '../ui/RenderDebouncer';
 import { ScreenDprMonitor } from '../ui/ScreenDprMonitor';
 import { ITheme } from 'xterm';
 import { CharacterJoinerRegistry } from '../renderer/CharacterJoinerRegistry';
+import { EventEmitter2, IEvent } from '../common/EventEmitter2';
 
 export class Renderer extends EventEmitter implements IRenderer {
   private _renderDebouncer: RenderDebouncer;
@@ -29,6 +30,9 @@ export class Renderer extends EventEmitter implements IRenderer {
   public colorManager: ColorManager;
   public dimensions: IRenderDimensions;
 
+  private _onRender = new EventEmitter2<{ start: number, end: number }>();
+  public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
+
   constructor(private _terminal: ITerminal, theme: ITheme) {
     super();
     const allowTransparency = this._terminal.options.allowTransparency;
@@ -197,7 +201,7 @@ export class Renderer extends EventEmitter implements IRenderer {
    */
   private _renderRows(start: number, end: number): void {
     this._renderLayers.forEach(l => l.onGridChanged(this._terminal, start, end));
-    this._terminal.emit('refresh', { start, end });
+    this._onRender.fire({ start, end });
   }
 
   /**

src/renderer/Types.ts

@@ -5,6 +5,7 @@
 
 import { ITerminal, CharacterJoinerHandler } from '../Types';
 import { IEventEmitter, ITheme, IDisposable } from 'xterm';
+import { IEvent } from '../common/EventEmitter2';
 
 /**
  * Flags used to render terminal text properly.
@@ -27,6 +28,8 @@ export interface IRenderer extends IEventEmitter, IDisposable {
   dimensions: IRenderDimensions;
   colorManager: IColorManager;
 
+  onRender: IEvent<{ start: number, end: number }>;
+
   dispose(): void;
   setTheme(theme: ITheme): IColorSet;
   onWindowResize(devicePixelRatio: number): void;

src/renderer/dom/DomRenderer.ts

@@ -11,6 +11,7 @@ import { ColorManager } from '../ColorManager';
 import { RenderDebouncer } from '../../ui/RenderDebouncer';
 import { BOLD_CLASS, ITALIC_CLASS, CURSOR_CLASS, CURSOR_STYLE_BLOCK_CLASS, CURSOR_BLINK_CLASS, CURSOR_STYLE_BAR_CLASS, CURSOR_STYLE_UNDERLINE_CLASS, DomRendererRowFactory } from './DomRendererRowFactory';
 import { INVERTED_DEFAULT_COLOR } from '../atlas/Types';
+import { EventEmitter2, IEvent } from '../../common/EventEmitter2';
 
 const TERMINAL_CLASS_PREFIX = 'xterm-dom-renderer-owner-';
 const ROW_CONTAINER_CLASS = 'xterm-rows';
@@ -43,6 +44,9 @@ export class DomRenderer extends EventEmitter implements IRenderer {
   public dimensions: IRenderDimensions;
   public colorManager: ColorManager;
 
+  private _onRender = new EventEmitter2<{ start: number, end: number }>();
+  public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
+
   constructor(private _terminal: ITerminal, theme: ITheme | undefined) {
     super();
     const allowTransparency = this._terminal.options.allowTransparency;
@@ -350,7 +354,7 @@ export class DomRenderer extends EventEmitter implements IRenderer {
       rowElement.appendChild(this._rowFactory.createRow(lineData, row === cursorAbsoluteY, cursorStyle, cursorX, cursorBlink, this.dimensions.actualCellWidth, terminal.cols));
     }
 
-    this._terminal.emit('refresh', {start, end});
+    this._onRender.fire({ start, end });
   }
 
   private get _terminalSelector(): string {

src/ui/TestUtils.test.ts

@@ -354,6 +354,7 @@ export class MockBuffer implements IBuffer {
 }
 
 export class MockRenderer implements IRenderer {
+  onRender: IEvent<{ start: number; end: number; }>;
   dispose(): void {
     throw new Error('Method not implemented.');
   }