Merge pull request #346 from code-dot-org/unit-testing

Unit test <Guide/>

Author: Madelyn Kasula

src/oceans/ui.jsx

@@ -1472,7 +1472,7 @@ let UnwrappedPond = class Pond extends React.Component {
 };
 export const Pond = Radium(UnwrappedPond); // Exported for unit tests.
 
-let Guide = class Guide extends React.Component {
+let UnwrappedGuide = class Guide extends React.Component {
   onShowing() {
     clearInterval(getState().guideTypingTimer);
     setState({guideShowing: true, guideTypingTimer: null});
@@ -1523,6 +1523,7 @@ let Guide = class Guide extends React.Component {
               key={currentGuide.id}
               style={guideBgStyle}
               onClick={this.dismissGuideClick}
+              id="uitest-dismiss-guide"
             >
               <div
                 style={{
@@ -1584,7 +1585,7 @@ let Guide = class Guide extends React.Component {
     );
   }
 };
-Guide = Radium(Guide);
+export const Guide = Radium(UnwrappedGuide); // Exported for unit tests.
 
 export default class UI extends React.Component {
   render() {

test/unit/oceans/ui.test.js

@@ -9,7 +9,8 @@ import {
   wordSet,
   Train,
   Predict,
-  Pond
+  Pond,
+  Guide
 } from '@ml/oceans/ui';
 import guide from '@ml/oceans/models/guide';
 import soundLibrary from '@ml/oceans/models/soundLibrary';
@@ -605,3 +606,47 @@ describe('Pond', () => {
     });
   });
 });
+
+describe('Guide', () => {
+  let clock, currentGuideStub, playSoundStub;
+
+  beforeEach(() => {
+    clock = sinon.useFakeTimers();
+    currentGuideStub = sinon.stub(guide, 'getCurrentGuide');
+    currentGuideStub.returns({
+      id: 'guide-id',
+      style: '',
+      heading: 'hey, listen!',
+      text: 'this is an important message'
+    });
+    playSoundStub = sinon.stub(soundLibrary, 'playSound');
+  });
+
+  afterEach(() => {
+    clock.restore();
+    guide.getCurrentGuide.restore();
+    soundLibrary.playSound.restore();
+  });
+
+  it('sets guideTypingTimer if not already started', () => {
+    setState({guideShowing: false, guideTypingTimer: null});
+    const wrapper = shallow(<Guide {...DEFAULT_PROPS} />);
+
+    expect(getState().guideTypingTimer).not.toBeNull();
+  });
+
+  it('is dismissable', () => {
+    const dismissCurrentGuideStub = sinon
+      .stub(guide, 'dismissCurrentGuide')
+      .returns(true);
+    const wrapper = shallow(<Guide {...DEFAULT_PROPS} />);
+    const dismissHandler = wrapper.find('#uitest-dismiss-guide');
+
+    dismissHandler.simulate('click');
+
+    expect(dismissCurrentGuideStub.callCount).toEqual(1);
+    expect(playSoundStub.withArgs('other').callCount).toEqual(1);
+
+    guide.dismissCurrentGuide.restore();
+  });
+});