Added required props, enzyme test suite and config, some initial tests.

Author: jogoodma

nwb.config.js

@@ -20,6 +20,9 @@ module.exports =  {
         // and a webpack loader to precompile them.  The sequence-viewer component
         // uses inline Handlebars.js templates currently.
         webpack: {
+            compat: {
+                enzyme: true
+            },
             aliases: {
                 'handlebars': path.resolve("node_modules/handlebars/dist/handlebars.min.js"),
                 'jQuery': path.resolve("node_modules/jquery/dist/jquery.min.js")

package.json

@@ -27,8 +27,10 @@
     "react": "15.x"
   },
   "devDependencies": {
+    "enzyme": "^2.4.1",
     "nwb": "0.12.x",
     "react": "^15.3.1",
+    "react-addons-test-utils": "^15.3.1",
     "react-dom": "^15.3.1"
   },
   "author": "Josh Goodman",

src/index.js

@@ -75,6 +75,8 @@ export default class ReactSequenceViewer extends Component {
 }
 
 ReactSequenceViewer.propTypes = {
+    id: PropTypes.string.isRequired,
+    sequence: PropTypes.string.isRequired,
     coverage: PropTypes.arrayOf(
         PropTypes.shape({
         start: PropTypes.number.isRequired,
@@ -102,4 +104,5 @@ ReactSequenceViewer.defaultProps = {
     seqLenClass: "CPLChoice",
     onMouseSelection: (elem) => {},
     onSubpartSelected: (elem) => {},
+    className: '',
 }

tests/index-test.js

@@ -1,23 +1,41 @@
-import expect from 'expect'
-import React from 'react'
-import {render, unmountComponentAtNode} from 'react-dom'
+import React from 'react';
+import expect, {spyOn, createSpy} from 'expect';
+import { mount, shallow } from 'enzyme';
 
-import Component from 'src/'
+import Component from 'src/';
 
-describe('Component', () => {
-  let node
+describe('<Component />', () => {
+    const sequence = 'ctcgatgctagtcgatgctagtcgtagcta';
 
-  beforeEach(() => {
-    node = document.createElement('div')
-  })
+    let parent = document.createElement('div');
+    parent.id = 'test';
 
-  afterEach(() => {
-    unmountComponentAtNode(node)
-  })
+    beforeEach(() => {
+        document.body.appendChild(parent);
+    });
+
+    afterEach(() => {
+        document.body.removeChild(parent);
+    });
+
+    it('calls componentDidMount', () => {
+        const spy = spyOn(Component.prototype, 'componentDidMount');
+        const wrapper = mount(<Component id="test" sequence="cgtagtcgatca" />);
+        expect(spy).toHaveBeenCalled();
+    });
+
+    it('checking required props', () => {
+        const wrapper = mount(<Component id="test" sequence={sequence} />);
+        expect(wrapper.props().sequence).toEqual(sequence);
+        expect(wrapper.props().id).toEqual("test");
+    });
+
+    /*it('charsPerLine onClick handler fired', () => {
+        const spy = createSpy();
+        const wrapper = mount(<Component id="test" sequence={sequence} toolbar={true} handleChange={spy} />);
+        console.debug(wrapper.find('.sequenceToolbar'));
+        wrapper.find('option[value="100"]').simulate('click');
+        expect(spy).toHaveBeenCalled();
+        });*/
+});
 
-  it('displays a welcome message', () => {
-    render(<Component/>, node, () => {
-      expect(node.innerHTML).toContain('Welcome to React components')
-    })
-  })
-})