Merge branch 'master' into es2021

demo/client.ts

@@ -247,6 +247,7 @@ if (document.location.pathname === '/test') {
   document.getElementById('bce').addEventListener('click', coloredErase);
   addVtButtons();
   initImageAddonExposed();
+  testEvents();
 }
 
 function createTerminal(): void {
@@ -1335,3 +1336,8 @@ function initImageAddonExposed(): void {
     canvas?.toBlob(data => window.open(URL.createObjectURL(data), '_blank'));
   });
 }
+
+function testEvents(): void {
+  document.getElementById('event-focus').addEventListener('click', ()=> term.focus());
+  document.getElementById('event-blur').addEventListener('click', ()=> term.blur());
+}

demo/index.html

@@ -109,6 +109,10 @@
               <dd><button id="image-demo1">snake (sixel)</button></dd>
               <dd><button id="image-demo2">oranges (sixel)</button></dd>
               <dd><button id="image-demo3">palette (iip)</button></dd>
+
+              <dt>Events Test</dt>
+              <dd><button id="event-focus">focus</button></dd>
+              <dd><button id="event-blur">blur</button></dd>
             </dl>
           </div>
         </div>

src/browser/renderer/dom/DomRenderer.ts

@@ -303,6 +303,7 @@ export class DomRenderer extends Disposable implements IRenderer {
 
   public handleFocus(): void {
     this._rowContainer.classList.add(FOCUS_CLASS);
+    this.renderRows(this._bufferService.buffer.y, this._bufferService.buffer.y);
   }
 
   public handleSelectionChanged(start: [number, number] | undefined, end: [number, number] | undefined, columnSelectMode: boolean): void {