Chore: Triggering point annotation mode by emitting a message (#77)

- This will allow external viewers to trigger entering/exiting point annotation mode without explicitly referring to the annotator (i.e. webapp)

* Chore: Updating unit tests

src/lib/viewers/BaseViewer.js

@@ -250,6 +250,11 @@ class BaseViewer extends EventEmitter {
 
         // Add a resize handler for the window
         document.defaultView.addEventListener('resize', this.debouncedResizeHandler);
+
+        /* istanbul ignore next */
+        this.addListener('togglepointannotationmode', () => {
+            this.annotator.togglePointModeHandler();
+        });
     }
 
     /**

src/lib/viewers/__tests__/BaseViewer-test.js

@@ -16,7 +16,7 @@ describe('lib/viewers/BaseViewer', () => {
     });
 
     beforeEach(() => {
-        fixture.load('viewers/__tests__/Base-test.html');
+        fixture.load('viewers/__tests__/BaseViewer-test.html');
 
         containerEl = document.querySelector('.bp-container');
         base = new BaseViewer({
@@ -215,13 +215,15 @@ describe('lib/viewers/BaseViewer', () => {
     describe('addCommonListeners()', () => {
         it('should append common event listeners', () => {
             sandbox.stub(fullscreen, 'addListener');
+            sandbox.stub(base, 'addListener');
             sandbox.stub(document.defaultView, 'addEventListener');
 
             base.addCommonListeners();
 
             expect(fullscreen.addListener).to.be.calledWith('enter', sinon.match.func);
             expect(fullscreen.addListener).to.be.calledWith('exit', sinon.match.func);
             expect(document.defaultView.addEventListener).to.be.calledWith('resize', base.debouncedResizeHandler);
+            expect(base.addListener).to.be.calledWith('togglepointannotationmode', sinon.match.func);
         });
     });
 

src/lib/viewers/doc/DocBaseViewer.js

@@ -540,7 +540,9 @@ class DocBaseViewer extends BaseViewer {
             return null;
         }
 
-        return this.annotator.togglePointModeHandler;
+        return () => {
+            this.emit('togglepointannotationmode');
+        };
     }
 
     /**

src/lib/viewers/doc/__tests__/DocBaseViewer-test.js

@@ -884,13 +884,17 @@ describe('src/lib/viewers/doc/DocBaseViewer', () => {
 
         it('should return the toggle point mode handler', () => {
             stubs.isAnnotatable.returns(true);
+            sandbox.stub(docBase, 'emit');
             docBase.annotator = {
-                togglePointModeHandler: 'handler'
+                togglePointModeHandler: () => {}
             };
 
             const handler = docBase.getPointModeClickHandler();
             expect(stubs.isAnnotatable).to.be.called;
-            expect(handler).to.equal('handler');
+            expect(handler).to.be.a('function');
+
+            handler(event);
+            expect(docBase.emit).to.have.been.calledWith('togglepointannotationmode');
         });
     });
 

src/lib/viewers/image/ImageViewer.js

@@ -508,10 +508,10 @@ class ImageViewer extends ImageBaseViewer {
             return null;
         }
 
-        return (event = {}) => {
+        return () => {
             this.imageEl.classList.remove(CSS_CLASS_ZOOMABLE);
             this.imageEl.classList.remove(CSS_CLASS_PANNABLE);
-            this.annotator.togglePointModeHandler(event);
+            this.emit('togglepointannotationmode');
         };
     }
 }

src/lib/viewers/image/__tests__/ImageViewer-test.js

@@ -22,7 +22,7 @@ describe('lib/viewers/image/ImageViewer', () => {
 
     beforeEach(() => {
         clock = sinon.useFakeTimers();
-        fixture.load('viewers/image/__tests__/Image-test.html');
+        fixture.load('viewers/image/__tests__/ImageViewer-test.html');
         containerEl = document.querySelector('.container');
         image = new ImageViewer({
             container: containerEl,
@@ -709,8 +709,9 @@ describe('lib/viewers/image/ImageViewer', () => {
         it('should return event listener', () => {
             const event = {};
             image.annotator = {
-                togglePointModeHandler: sandbox.mock().withArgs(event)
+                togglePointModeHandler: () => {}
             };
+            sandbox.stub(image, 'emit');
             image.imageEl.classList.add(CSS_CLASS_ZOOMABLE);
             image.imageEl.classList.add(CSS_CLASS_PANNABLE);
             sandbox.stub(image, 'isAnnotatable').returns(true);
@@ -721,6 +722,7 @@ describe('lib/viewers/image/ImageViewer', () => {
             handler(event);
             expect(image.imageEl).to.not.have.class(CSS_CLASS_ZOOMABLE);
             expect(image.imageEl).to.not.have.class(CSS_CLASS_PANNABLE);
+            expect(image.emit).to.have.been.calledWith('togglepointannotationmode');
         });
     });
 });