Specs

client/js/_admin/components/applications/application_row.jsx

@@ -11,7 +11,7 @@ export default class ApplicationRow extends React.Component {
       application_instances_count : React.PropTypes.number,
     }).isRequired,
     saveApplication: React.PropTypes.func.isRequired,
-  }
+  };
 
   static getStyles() {
     return {
@@ -34,7 +34,7 @@ export default class ApplicationRow extends React.Component {
     const styles = ApplicationRow.getStyles();
     return (
       <tr>
-        <td>
+        <td className="test-link">
           <Link to={`/applications/${this.props.application.id}/application_instances`}>{this.props.application.name}</Link>
         </td>
         <td><span>{this.props.application.application_instances_count}</span></td>

client/js/_admin/components/applications/application_row.spec.jsx

@@ -0,0 +1,47 @@
+import React         from 'react';
+import TestUtils     from 'react-addons-test-utils';
+import { Provider }  from 'react-redux';
+import Helper        from '../../../../specs_support/helper';
+import ApplicationRow from './application_row';
+
+describe('applications application row', () => {
+  let result;
+  let props;
+
+  beforeEach(() => {
+    props = {
+      application: {
+        id                          : 314159,
+        name                        : "SPECNAME",
+        application_instances_count : 123
+      },
+      saveApplication: () => {}
+    };
+
+    result = TestUtils.renderIntoDocument(
+      <Provider store={Helper.makeStore()}>
+        <table><tbody>
+          <ApplicationRow {...props} />
+        </tbody></table>
+      </Provider>
+    );
+
+  });
+
+  it('button is clicked', () => {
+    const button = TestUtils.findRenderedDOMComponentWithClass(result, 'i-settings');
+    TestUtils.Simulate.click(button);
+    expect(button);
+  });
+
+  it('renders application instances count', () => {
+    const span = TestUtils.findRenderedDOMComponentWithTag(result, 'span');
+    expect(span.textContent).toContain('123');
+  });
+
+  it('renders application link', () => {
+    const link = TestUtils.findRenderedDOMComponentWithClass(result, 'test-link');
+    expect(link.innerText).toContain('SPECNAME');
+  });
+
+});

client/js/_admin/components/applications/form.spec.jsx

@@ -0,0 +1,47 @@
+import React        from 'react';
+import TestUtils    from 'react-addons-test-utils';
+import Stub         from '../../../../specs_support/stub';
+import Form         from './form';
+
+describe('applications form', () => {
+
+  let result;
+  let props;
+  let action;
+
+  beforeEach(() => {
+    action = false;
+    props = {
+      onChange    : () => {},
+      closeModal  : () => { action = true; },
+      save        : () => { action = true; },
+      description : "SPEC_DESCRIPTION"
+    };
+
+    result = TestUtils.renderIntoDocument(
+      <Stub>
+        <Form {...props} />
+      </Stub>
+    );
+  });
+
+  it('renders a form', () => {
+    const button = TestUtils.findRenderedDOMComponentWithClass(result, 'c-btn c-btn--yellow');
+    TestUtils.Simulate.click(button);
+    expect(action).toBeTruthy();
+  });
+
+  it('close modal', () => {
+    const button = TestUtils.findRenderedDOMComponentWithClass(result, 'c-btn c-btn--gray--large u-m-right');
+    TestUtils.Simulate.click(button);
+    expect(action).toBeTruthy();
+  });
+
+  it('renders description', () => {
+    const element = TestUtils.findRenderedDOMComponentWithClass(result, 'o-grid o-grid__modal-top');
+    expect(element).toBeDefined();
+    const childDivs = element.childNodes;
+    const inputTag = childDivs[0].firstChild.childNodes[1];
+    expect(inputTag.value).toContain('SPEC_DESCRIPTION');
+  })
+});

client/js/_admin/components/applications/index.spec.jsx

@@ -0,0 +1,39 @@
+import React        from 'react';
+import TestUtils    from 'react-addons-test-utils';
+import { Provider } from 'react-redux';
+import Helper       from '../../../../specs_support/helper';
+import { Index }    from './index';
+
+describe('applications index', () => {
+  let result;
+  let props;
+
+  beforeEach(() => {
+    props = {
+      saveApplication: () => {},
+      applications: {
+        Spiderman: {
+          Power1: "Wall Crawling",
+          Power2: "Spidey Sense"
+        }
+      }
+    };
+
+    result = TestUtils.renderIntoDocument(
+      <Provider store={Helper.makeStore()}>
+        <Index {...props} />
+      </Provider>
+    );
+  });
+
+  it('render the application rows', () => {
+    const element = TestUtils.findRenderedDOMComponentWithClass(result, 'o-contain o-contain--full');
+    expect(element).toBeDefined();
+  });
+
+  it('render application', () => {
+    const element = TestUtils.findRenderedDOMComponentWithTag(result, 'tbody');
+    expect(element.childNodes.length).toBeGreaterThan(0);
+  });
+
+});

client/js/_admin/components/applications/modal.spec.jsx

@@ -0,0 +1,42 @@
+import React         from 'react';
+import TestUtils     from 'react-addons-test-utils';
+import { Provider }  from 'react-redux';
+import Helper        from '../../../../specs_support/helper';
+import Modal         from './modal';
+
+describe('applications modal', () => {
+  let result;
+  let props;
+  let isShown;
+  beforeEach(() => {
+    isShown = true;
+    props = {
+      application: {
+        name        : 'SPEC_NAME',
+        description : 'SPEC_STRING'
+      },
+      isOpen: true,
+      closeModal: () => { isShown = false; },
+      save: () => {}
+    };
+
+    result = TestUtils.renderIntoDocument(
+      <Provider store={Helper.makeStore()} >
+        <Modal {...props} />
+      </Provider>
+    );
+  });
+
+  it('modal is shown', () => {
+    const modal = TestUtils.findRenderedComponentWithType(result, Modal);
+    expect(modal).toBeDefined();
+    expect(modal.props.isOpen).toBeTruthy();
+  });
+
+  it('modal is hidden', () => {
+    const modal = TestUtils.findRenderedComponentWithType(result, Modal);
+    expect(modal).toBeDefined();
+    modal.props.closeModal();
+    expect(isShown).toBeFalsy();
+  });
+});