Fix bug that caused screenview to stay off when screenshare was toggled

src/screenviewing/context/DefaultScreenViewingComponentContext.ts

@@ -85,9 +85,11 @@ export default class DefaultScreenViewingComponentContext implements ScreenViewi
       providers
     );
     signalingSession.registerObserver({
-      streamDidStart(_screenMessageDetail: ScreenMessageDetail): void {},
+      streamDidStart(_screenMessageDetail: ScreenMessageDetail): void {
+        deltaRenderer.revealViewport();
+      },
       streamDidStop(_screenMessageDetail: ScreenMessageDetail): void {
-        deltaRenderer.close();
+        deltaRenderer.hideViewport();
       },
     });
 

src/screenviewing/deltarenderer/DefaultScreenViewingDeltaRenderer.ts

@@ -188,6 +188,18 @@ export default class DefaultScreenViewingDeltaRenderer implements ScreenViewingD
     }
   }
 
+  hideViewport(): void {
+    if (this.content) {
+      this.content.style.display = 'none';
+    }
+  }
+
+  revealViewport(): void {
+    if (this.content) {
+      this.content.style.display = 'block';
+    }
+  }
+
   changePresentationPolicy(policy: PresentationPolicy): void {
     this.policy = policy;
     this.updatePresentation();

src/screenviewing/deltarenderer/ScreenViewingDeltaRenderer.ts

@@ -27,6 +27,10 @@ export default interface ScreenViewingDeltaRenderer {
 
   setViewport(viewport: HTMLElement): void;
 
+  hideViewport(): void;
+
+  revealViewport(): void;
+
   changePresentationPolicy(policy: PresentationPolicy): void;
 
   close(): void;

test/screenviewing/context/DefaultScreenViewingComponentContext.test.ts

@@ -66,7 +66,8 @@ describe('DefaultScreenViewingComponentContext', () => {
         {
           deltaRendererProvider: () => ({
             ...Substitute.for(),
-            close(): void {
+            hideViewport(): void {},
+            revealViewport(): void {
               done();
             },
           }),

test/screenviewing/deltarenderer/DefaultScreenViewingDeltaRenderer.test.ts

@@ -434,4 +434,47 @@ describe('DefaultScreenViewingDeltaRenderer', () => {
       deltaRenderer.zoomReset();
     });
   });
+
+  describe('hideViewport and revealViewport', () => {
+    it('hides and reveals the viewport', () => {
+      let style = {
+        display: 'none',
+      };
+
+      let canvas = {
+        style: style,
+      };
+
+      const document: SubstituteOf<Document> = Substitute.for();
+      document.createElement(Arg.any()).returns(canvas);
+      const window: SubstituteOf<Window> = Substitute.for();
+      window.document.returns(document);
+      // @ts-ignore
+      window.getComputedStyle(Arg.any()).returns(canvas.style);
+
+      const deltaRenderer: ScreenViewingDeltaRenderer = new DefaultScreenViewingDeltaRenderer(
+        controller,
+        logger,
+        window,
+        Substitute.for(),
+        Substitute.for()
+      );
+
+      // Test style doesn't change before setViewport
+      canvas.style.display = 'block';
+      deltaRenderer.hideViewport();
+      expect(style.display).to.equal('block');
+      style.display = 'none';
+      deltaRenderer.revealViewport();
+      expect(style.display.valueOf()).to.equal('none');
+
+      // Test style does change after setViewport
+      deltaRenderer.setViewport(Substitute.for());
+      canvas.style.display = 'block';
+      deltaRenderer.hideViewport();
+      expect(canvas.style.display).to.equal('none');
+      deltaRenderer.revealViewport();
+      expect(canvas.style.display).to.equal('block');
+    });
+  });
 });