Rename methods hide/show to open/close

Because I am planning to introduce another method to hide the controls,
I renamed the hide/show methods in the sidebar and notebook components
to open/close. I also feel it describes better the visual outcome.

For consistency, I renamed the show/hideNotebook to open/closeNotebook.

src/annotator/guest.js

@@ -203,14 +203,14 @@ export default class Guest extends Delegator {
 
     // Hide the sidebar in response to a document click or tap, so it doesn't obscure
     // the document content.
-    const maybeHideSidebar = event => {
+    const maybeCloseSidebar = event => {
       if (!this.closeSidebarOnDocumentClick || this.isEventInAnnotator(event)) {
         // Don't hide the sidebar if event occurred inside Hypothesis UI, or
         // the user is making a selection, or the behavior was disabled because
         // the sidebar doesn't overlap the content.
         return;
       }
-      this.crossframe?.call('hideSidebar');
+      this.crossframe?.call('closeSidebar');
     };
 
     addListener('click', event => {
@@ -219,7 +219,7 @@ export default class Guest extends Delegator {
         const toggle = event.metaKey || event.ctrlKey;
         this.selectAnnotations(annotations, toggle);
       } else {
-        maybeHideSidebar(event);
+        maybeCloseSidebar(event);
       }
     });
 
@@ -227,7 +227,7 @@ export default class Guest extends Delegator {
     // on touch-input devices, not all elements will generate a "click" event.
     addListener('touchstart', event => {
       if (!annotationsAt(event.target).length) {
-        maybeHideSidebar(event);
+        maybeCloseSidebar(event);
       }
     });
 
@@ -590,7 +590,7 @@ export default class Guest extends Delegator {
     targets.then(() => this.anchor(/** @type {AnnotationData} */ (annotation)));
 
     if (!annotation.$highlight) {
-      this.crossframe?.call('showSidebar');
+      this.crossframe?.call('openSidebar');
     }
     return annotation;
   }
@@ -614,7 +614,7 @@ export default class Guest extends Delegator {
   showAnnotations(annotations) {
     const tags = annotations.map(a => a.$tag);
     this.crossframe?.call('showAnnotations', tags);
-    this.crossframe?.call('showSidebar');
+    this.crossframe?.call('openSidebar');
   }
 
   /**

src/annotator/notebook.js

 import Delegator from './delegator';
 import { createSidebarConfig } from './config/sidebar';
 import { createShadowRoot } from './util/shadow-root';
+import { render } from 'preact';
 
 /**
  * Create the iframe that will load the notebook application.
@@ -51,13 +52,13 @@ export default class Notebook extends Delegator {
      */
     this.container = null;
 
-    this.subscribe('showNotebook', groupId => {
+    this.subscribe('openNotebook', groupId => {
       this._groupId = groupId;
-      this.show();
+      this.open();
     });
-    this.subscribe('hideNotebook', () => this.hide());
+    this.subscribe('closeNotebook', () => this.close());
     // If the sidebar has opened, get out of the way
-    this.subscribe('sidebarOpened', () => this.hide());
+    this.subscribe('sidebarOpened', () => this.close());
   }
 
   _update() {
@@ -76,14 +77,14 @@ export default class Notebook extends Delegator {
     }
   }
 
-  show() {
+  open() {
     const container = this._initContainer();
     this._update();
     container.classList.add('is-open');
     container.style.display = '';
   }
 
-  hide() {
+  close() {
     if (this.container) {
       this.container.classList.remove('is-open');
       this.container.style.display = 'none';

src/annotator/sidebar.js

@@ -129,14 +129,14 @@ export default class Sidebar extends Guest {
       config.query ||
       config.group
     ) {
-      this.subscribe('panelReady', () => this.show());
+      this.subscribe('panelReady', () => this.open());
     }
 
     // Set up the toolbar on the left edge of the sidebar.
     const toolbarContainer = document.createElement('div');
     this.toolbar = new ToolbarController(toolbarContainer, {
       createAnnotation: () => this.createAnnotation(),
-      setSidebarOpen: open => (open ? this.show() : this.hide()),
+      setSidebarOpen: open => (open ? this.open() : this.close()),
       setHighlightsVisible: show => this.setAllVisibleHighlights(show),
     });
     this.toolbar.useMinimalControls = config.theme === 'clean';
@@ -161,7 +161,7 @@ export default class Sidebar extends Guest {
       final: /** @type {number|null} */ (null),
     };
     this._setupGestures();
-    this.hide();
+    this.close();
 
     // Publisher-provided callback functions
     const [serviceConfig] = config.services || [];
@@ -207,21 +207,21 @@ export default class Sidebar extends Guest {
 
   _setupSidebarEvents() {
     annotationCounts(document.body, this.crossframe);
-    sidebarTrigger(document.body, () => this.show());
+    sidebarTrigger(document.body, () => this.open());
     features.init(this.crossframe);
 
-    this.crossframe.on('showSidebar', () => this.show());
-    this.crossframe.on('hideSidebar', () => this.hide());
+    this.crossframe.on('openSidebar', () => this.open());
+    this.crossframe.on('closeSidebar', () => this.close());
 
     // Re-publish the crossframe event so that anything extending Delegator
     // can subscribe to it (without need for crossframe)
-    this.crossframe.on('showNotebook', groupId => {
-      this.hide();
-      this.publish('showNotebook', [groupId]);
+    this.crossframe.on('openNotebook', groupId => {
+      this.close();
+      this.publish('openNotebook', [groupId]);
     });
-    this.crossframe.on('hideNotebook', () => {
-      this.show();
-      this.publish('hideNotebook');
+    this.crossframe.on('closeNotebook', () => {
+      this.open();
+      this.publish('closeNotebook');
     });
 
     const eventHandlers = [
@@ -347,9 +347,9 @@ export default class Sidebar extends Guest {
   _onResize() {
     if (this.toolbar.sidebarOpen === true) {
       if (window.innerWidth < MIN_RESIZE) {
-        this.hide();
+        this.close();
       } else {
-        this.show();
+        this.open();
       }
     }
   }
@@ -386,9 +386,9 @@ export default class Sidebar extends Guest {
           this._gestureState.final === null ||
           this._gestureState.final <= -MIN_RESIZE
         ) {
-          this.show();
+          this.open();
         } else {
-          this.hide();
+          this.close();
         }
         this._resetGestureState();
         break;
@@ -407,7 +407,7 @@ export default class Sidebar extends Guest {
     }
   }
 
-  show() {
+  open() {
     this.crossframe.call('sidebarOpened');
     this.publish('sidebarOpened');
 
@@ -426,7 +426,7 @@ export default class Sidebar extends Guest {
     this._notifyOfLayoutChange(true);
   }
 
-  hide() {
+  close() {
     if (this.frame) {
       this.frame.style.marginLeft = '';
       this.frame.classList.add('annotator-collapsed');

src/annotator/test/guest-test.js

@@ -450,7 +450,7 @@ describe('Guest', () => {
     it('hides sidebar when the user taps or clicks in the page', () => {
       for (let event of ['click', 'touchstart']) {
         rootElement.dispatchEvent(new Event(event));
-        assert.calledWith(guest.plugins.CrossFrame.call, 'hideSidebar');
+        assert.calledWith(guest.plugins.CrossFrame.call, 'closeSidebar');
       }
     });
 
@@ -563,7 +563,7 @@ describe('Guest', () => {
 
       FakeAdder.instance.options.onShowAnnotations([{ $tag: 'ann1' }]);
 
-      assert.calledWith(fakeCrossFrame.call, 'showSidebar');
+      assert.calledWith(fakeCrossFrame.call, 'openSidebar');
       assert.calledWith(fakeCrossFrame.call, 'showAnnotations', ['ann1']);
     }));
 

src/annotator/test/notebook-test.js

@@ -27,20 +27,20 @@ describe('Notebook', () => {
       const notebook = createNotebook();
       assert.isNull(notebook.container);
 
-      notebook.show();
+      notebook.open();
       assert.isNotNull(notebook.container);
     });
 
     it('is not created if `hide` is called before notebook is first shown', () => {
       const notebook = createNotebook();
-      notebook.hide();
+      notebook.close();
       assert.isNull(notebook.container);
     });
 
     it('displays when opened', () => {
       const notebook = createNotebook();
 
-      notebook.show();
+      notebook.open();
 
       assert.equal(notebook.container.style.display, '');
       assert.isTrue(notebook.container.classList.contains('is-open'));
@@ -49,8 +49,8 @@ describe('Notebook', () => {
     it('hides when closed', () => {
       const notebook = createNotebook();
 
-      notebook.show();
-      notebook.hide();
+      notebook.open();
+      notebook.close();
 
       assert.equal(notebook.container.style.display, 'none');
       assert.isFalse(notebook.container.classList.contains('is-open'));
@@ -58,12 +58,12 @@ describe('Notebook', () => {
   });
 
   describe('creating the notebook iframe', () => {
-    it('creates the iframe when the notebook is shown for the first time', () => {
+    it('creates the iframe when the notebook is opened for the first time', () => {
       const notebook = createNotebook();
 
       assert.isNull(notebook.frame);
 
-      notebook.show();
+      notebook.open();
 
       assert.isTrue(notebook.frame instanceof Element);
     });
@@ -73,7 +73,7 @@ describe('Notebook', () => {
         notebookAppUrl: 'http://www.example.com/foo/bar',
       });
 
-      notebook.show();
+      notebook.open();
 
       // The rest of the config gets added as a hash to the end of the src,
       // so split that off and look at the string before it
@@ -83,16 +83,16 @@ describe('Notebook', () => {
       );
     });
 
-    it('does not create a new iframe if shown again with same group ID', () => {
+    it('does not create a new iframe if opened again with same group ID', () => {
       const notebook = createNotebook();
       notebook._groupId = 'mygroup';
 
-      // The first showing will create a new iFrame
-      notebook.publish('showNotebook', ['myGroup']);
+      // The first opening will create a new iFrame
+      notebook.publish('openNotebook', ['myGroup']);
       const removeSpy = sinon.spy(notebook.frame, 'remove');
-      // Show it again — the group hasn't changed so the iframe won't be
+      // Open it again — the group hasn't changed so the iframe won't be
       // replaced
-      notebook.publish('showNotebook', ['myGroup']);
+      notebook.publish('openNotebook', ['myGroup']);
 
       assert.notCalled(removeSpy);
     });
@@ -101,41 +101,41 @@ describe('Notebook', () => {
       const notebook = createNotebook();
       notebook._groupId = 'mygroup';
 
-      // First show: creates an iframe
-      notebook.publish('showNotebook', ['myGroup']);
+      // First open: creates an iframe
+      notebook.publish('openNotebook', ['myGroup']);
       const removeSpy = sinon.spy(notebook.frame, 'remove');
 
-      // Show again with another group
-      notebook.publish('showNotebook', ['anotherGroup']);
+      // Open again with another group
+      notebook.publish('openNotebook', ['anotherGroup']);
 
-      // Show again, which will remove the first iframe and create a new one
-      notebook.show();
+      // Open again, which will remove the first iframe and create a new one
+      notebook.open();
       assert.calledOnce(removeSpy);
     });
   });
 
   describe('responding to events', () => {
-    it('shows on `showNotebook`', () => {
+    it('opens on `openNotebook`', () => {
       const notebook = createNotebook();
 
-      notebook.publish('showNotebook');
+      notebook.publish('openNotebook');
 
       assert.equal(notebook.container.style.display, '');
     });
 
-    it('hides on `hideNotebook`', () => {
+    it('closes on `closeNotebook`', () => {
       const notebook = createNotebook();
 
-      notebook.show();
-      notebook.publish('hideNotebook');
+      notebook.open();
+      notebook.publish('closeNotebook');
 
       assert.equal(notebook.container.style.display, 'none');
     });
 
-    it('hides on "sidebarOpened"', () => {
+    it('closes on "sidebarOpened"', () => {
       const notebook = createNotebook();
 
-      notebook.show();
+      notebook.open();
       notebook.publish('sidebarOpened');
 
       assert.equal(notebook.container.style.display, 'none');
@@ -148,7 +148,7 @@ describe('Notebook', () => {
       const hostDocument = notebook.element;
 
       // Make sure the frame is created
-      notebook.show();
+      notebook.open();
       assert.isNotNull(hostDocument.querySelector('hypothesis-notebook'));
 
       notebook.destroy();

src/annotator/test/sidebar-test.js

@@ -191,16 +191,16 @@ describe('Sidebar', () => {
   });
 
   describe('toolbar buttons', () => {
-    it('shows or hides sidebar when toolbar button is clicked', () => {
+    it('opens and closes sidebar when toolbar button is clicked', () => {
       const sidebar = createSidebar();
-      sinon.stub(sidebar, 'show');
-      sinon.stub(sidebar, 'hide');
+      sinon.stub(sidebar, 'open');
+      sinon.stub(sidebar, 'close');
 
       FakeToolbarController.args[0][1].setSidebarOpen(true);
-      assert.called(sidebar.show);
+      assert.called(sidebar.open);
 
       FakeToolbarController.args[0][1].setSidebarOpen(false);
-      assert.called(sidebar.hide);
+      assert.called(sidebar.close);
     });
 
     it('shows or hides highlights when toolbar button is clicked', () => {
@@ -236,45 +236,45 @@ describe('Sidebar', () => {
       return result;
     };
 
-    describe('on "show" event', () =>
-      it('shows the frame', () => {
-        const target = sandbox.stub(Sidebar.prototype, 'show');
+    describe('on "open" event', () =>
+      it('opens the frame', () => {
+        const target = sandbox.stub(Sidebar.prototype, 'open');
         createSidebar();
-        emitEvent('showSidebar');
+        emitEvent('openSidebar');
         assert.called(target);
       }));
 
-    describe('on "hide" event', () =>
-      it('hides the frame', () => {
-        const target = sandbox.stub(Sidebar.prototype, 'hide');
+    describe('on "close" event', () =>
+      it('closes the frame', () => {
+        const target = sandbox.stub(Sidebar.prototype, 'close');
         createSidebar();
-        emitEvent('hideSidebar');
+        emitEvent('closeSidebar');
         assert.called(target);
       }));
 
-    describe('on "showNotebook" event', () => {
+    describe('on "openNotebook" event', () => {
       it('hides itself and republishes the event', () => {
         const sidebar = createSidebar();
         sinon.stub(sidebar, 'publish');
-        sinon.stub(sidebar, 'hide');
-        emitEvent('showNotebook', 'mygroup');
+        sinon.stub(sidebar, 'close');
+        emitEvent('openNotebook', 'mygroup');
         assert.calledWith(
           sidebar.publish,
-          'showNotebook',
+          'openNotebook',
           sinon.match(['mygroup'])
         );
-        assert.calledOnce(sidebar.hide);
+        assert.calledOnce(sidebar.close);
       });
     });
 
-    describe('on "hideNotebook" event', () => {
-      it('shows itself and republishes the event', () => {
+    describe('on "closeNotebook" event', () => {
+      it('opens itself and republishes the event', () => {
         const sidebar = createSidebar();
         sinon.stub(sidebar, 'publish');
-        sinon.stub(sidebar, 'show');
-        emitEvent('hideNotebook');
-        assert.calledWith(sidebar.publish, 'hideNotebook');
-        assert.calledOnce(sidebar.show);
+        sinon.stub(sidebar, 'open');
+        emitEvent('closeNotebook');
+        assert.calledWith(sidebar.publish, 'closeNotebook');
+        assert.calledOnce(sidebar.open);
       });
     });
 
@@ -422,18 +422,18 @@ describe('Sidebar', () => {
         assert.equal(sidebar.frame.style.pointerEvents, '');
       });
 
-      it('calls `show` if the widget is fully visible', () => {
+      it('calls `open` if the widget is fully visible', () => {
         sidebar._gestureState = { final: -500 };
-        const show = sandbox.stub(sidebar, 'show');
+        const open = sandbox.stub(sidebar, 'open');
         sidebar._onPan({ type: 'panend' });
-        assert.calledOnce(show);
+        assert.calledOnce(open);
       });
 
-      it('calls `hide` if the widget is not fully visible', () => {
+      it('calls `close` if the widget is not fully visible', () => {
         sidebar._gestureState = { final: -100 };
-        const hide = sandbox.stub(sidebar, 'hide');
+        const close = sandbox.stub(sidebar, 'close');
         sidebar._onPan({ type: 'panend' });
-        assert.calledOnce(hide);
+        assert.calledOnce(close);
       });
     });
 
@@ -454,43 +454,43 @@ describe('Sidebar', () => {
       const sidebar = createSidebar({
         annotations: 'ann-id',
       });
-      const show = sandbox.stub(sidebar, 'show');
+      const open = sandbox.stub(sidebar, 'open');
       sidebar.publish('panelReady');
-      assert.calledOnce(show);
+      assert.calledOnce(open);
     });
 
     it('opens the sidebar when a direct-linked group is present.', () => {
       const sidebar = createSidebar({
         group: 'group-id',
       });
-      const show = sandbox.stub(sidebar, 'show');
+      const open = sandbox.stub(sidebar, 'open');
       sidebar.publish('panelReady');
-      assert.calledOnce(show);
+      assert.calledOnce(open);
     });
 
     it('opens the sidebar when a direct-linked query is present.', () => {
       const sidebar = createSidebar({
         query: 'tag:foo',
       });
-      const show = sandbox.stub(sidebar, 'show');
+      const open = sandbox.stub(sidebar, 'open');
       sidebar.publish('panelReady');
-      assert.calledOnce(show);
+      assert.calledOnce(open);
     });
 
     it('opens the sidebar when openSidebar is set to true.', () => {
       const sidebar = createSidebar({
         openSidebar: true,
       });
-      const show = sandbox.stub(sidebar, 'show');
+      const open = sandbox.stub(sidebar, 'open');
       sidebar.publish('panelReady');
-      assert.calledOnce(show);
+      assert.calledOnce(open);
     });
 
-    it('does not show the sidebar if not configured to.', () => {
+    it('does not open the sidebar if not configured to.', () => {
       const sidebar = createSidebar();
-      const show = sandbox.stub(sidebar, 'show');
+      const open = sandbox.stub(sidebar, 'open');
       sidebar.publish('panelReady');
-      assert.notCalled(show);
+      assert.notCalled(open);
     });
   });
 
@@ -514,24 +514,24 @@ describe('Sidebar', () => {
     });
   });
 
-  describe('#show', () => {
+  describe('#open', () => {
     it('shows highlights if "showHighlights" is set to "whenSidebarOpen"', () => {
       const sidebar = createSidebar({ showHighlights: 'whenSidebarOpen' });
       assert.isFalse(sidebar.visibleHighlights);
-      sidebar.show();
+      sidebar.open();
       assert.isTrue(sidebar.visibleHighlights);
     });
 
     it('does not show highlights otherwise', () => {
       const sidebar = createSidebar({ showHighlights: 'never' });
       assert.isFalse(sidebar.visibleHighlights);
-      sidebar.show();
+      sidebar.open();
       assert.isFalse(sidebar.visibleHighlights);
     });
 
     it('updates the `sidebarOpen` property of the toolbar', () => {
       const sidebar = createSidebar();
-      sidebar.show();
+      sidebar.open();
       assert.equal(fakeToolbar.sidebarOpen, true);
     });
   });
@@ -540,8 +540,8 @@ describe('Sidebar', () => {
     it('hides highlights if "showHighlights" is set to "whenSidebarOpen"', () => {
       const sidebar = createSidebar({ showHighlights: 'whenSidebarOpen' });
 
-      sidebar.show();
-      sidebar.hide();
+      sidebar.open();
+      sidebar.close();
 
       assert.isFalse(sidebar.visibleHighlights);
     });
@@ -549,8 +549,8 @@ describe('Sidebar', () => {
     it('updates the `sidebarOpen` property of the toolbar', () => {
       const sidebar = createSidebar();
 
-      sidebar.show();
-      sidebar.hide();
+      sidebar.open();
+      sidebar.close();
 
       assert.equal(fakeToolbar.sidebarOpen, false);
     });
@@ -583,21 +583,21 @@ describe('Sidebar', () => {
       assert.equal(fakeToolbar.sidebarOpen, false);
     });
 
-    it('invokes the "show" method when window is resized', () => {
-      // Calling the 'show' methods adjust the marginLeft at different screen sizes
+    it('invokes the "open" method when window is resized', () => {
+      // Calling the 'open' methods adjust the marginLeft at different screen sizes
       const sidebar = createSidebar({ openSidebar: true });
       sidebar.publish('panelReady');
-      sinon.stub(sidebar, 'show');
+      sinon.stub(sidebar, 'open');
 
       // Make the window very small
       window.innerWidth = MIN_RESIZE;
       window.dispatchEvent(new Event('resize'));
-      assert.calledOnce(sidebar.show);
+      assert.calledOnce(sidebar.open);
 
       // Make the window very large
       window.innerWidth = MIN_RESIZE * 10;
       window.dispatchEvent(new Event('resize'));
-      assert.calledTwice(sidebar.show);
+      assert.calledTwice(sidebar.open);
     });
   });
 
@@ -675,7 +675,7 @@ describe('Sidebar', () => {
 
       it('notifies when sidebar changes expanded state', () => {
         sinon.stub(sidebar, 'publish');
-        sidebar.show();
+        sidebar.open();
         assert.calledOnce(layoutChangeHandlerSpy);
         assert.calledWith(
           sidebar.publish,
@@ -688,7 +688,7 @@ describe('Sidebar', () => {
           expanded: true,
         });
 
-        sidebar.hide();
+        sidebar.close();
         assert.calledTwice(layoutChangeHandlerSpy);
         assert.calledThrice(sidebar.publish);
         assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], {
@@ -746,14 +746,14 @@ describe('Sidebar', () => {
       });
 
       it('notifies when sidebar changes expanded state', () => {
-        sidebar.show();
+        sidebar.open();
         assert.calledOnce(layoutChangeHandlerSpy);
         assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], {
           expanded: true,
           width: DEFAULT_WIDTH,
         });
 
-        sidebar.hide();
+        sidebar.close();
         assert.calledTwice(layoutChangeHandlerSpy);
         assertLayoutValues(layoutChangeHandlerSpy.lastCall.args[0], {
           expanded: false,

src/sidebar/components/UserMenu.js

@@ -54,7 +54,7 @@ function UserMenu({ auth, bridge, onLogout, serviceUrl, settings }) {
     !isThirdParty || serviceSupports('onLogoutRequestProvided');
 
   const onSelectNotebook = () => {
-    bridge.call('showNotebook', store.focusedGroupId());
+    bridge.call('openNotebook', store.focusedGroupId());
   };
 
   const onProfileSelected = () =>

src/sidebar/components/test/UserMenu-test.js

@@ -204,7 +204,7 @@ describe('UserMenu', () => {
         const openNotebookItem = findMenuItem(wrapper, 'Open notebook');
         openNotebookItem.props().onClick();
         assert.calledOnce(fakeBridge.call);
-        assert.calledWith(fakeBridge.call, 'showNotebook', 'mygroup');
+        assert.calledWith(fakeBridge.call, 'openNotebook', 'mygroup');
       });
     });
 

src/sidebar/services/frame-sync.js

@@ -114,7 +114,7 @@ export default function FrameSync(annotationsService, bridge, store) {
       // and delete the (unsaved) annotation so it gets un-selected in the
       // target document
       if (!store.isLoggedIn()) {
-        bridge.call('showSidebar');
+        bridge.call('openSidebar');
         store.openSidebarPanel('loginPrompt');
         bridge.call('deleteAnnotation', formatAnnot(annot));
         return;
@@ -167,11 +167,11 @@ export default function FrameSync(annotationsService, bridge, store) {
     });
 
     // These invoke the matching methods by name on the Guests
-    bridge.on('showSidebar', function () {
-      bridge.call('showSidebar');
+    bridge.on('openSidebar', function () {
+      bridge.call('openSidebar');
     });
-    bridge.on('hideSidebar', function () {
-      bridge.call('hideSidebar');
+    bridge.on('closeSidebar', function () {
+      bridge.call('closeSidebar');
     });
     bridge.on('setVisibleHighlights', function (state) {
       bridge.call('setVisibleHighlights', state);

src/sidebar/services/test/frame-sync-test.js

@@ -243,7 +243,7 @@ describe('sidebar/services/frame-sync', function () {
         const ann = { target: [] };
         fakeBridge.emit('beforeCreateAnnotation', { tag: 't1', msg: ann });
 
-        assert.calledWith(fakeBridge.call, 'showSidebar');
+        assert.calledWith(fakeBridge.call, 'openSidebar');
       });
 
       it('should open the login prompt panel', () => {
@@ -369,16 +369,16 @@ describe('sidebar/services/frame-sync', function () {
   });
 
   describe('on a relayed bridge call', function () {
-    it('calls "showSidebar"', function () {
-      fakeBridge.emit('showSidebar');
+    it('calls "openSidebar"', function () {
+      fakeBridge.emit('openSidebar');
 
-      assert.calledWith(fakeBridge.call, 'showSidebar');
+      assert.calledWith(fakeBridge.call, 'openSidebar');
     });
 
-    it('calls "hideSidebar"', function () {
-      fakeBridge.emit('hideSidebar');
+    it('calls "closeSidebar"', function () {
+      fakeBridge.emit('closeSidebar');
 
-      assert.calledWith(fakeBridge.call, 'hideSidebar');
+      assert.calledWith(fakeBridge.call, 'closeSidebar');
     });
 
     it('calls "setVisibleHighlights"', function () {