updated tests to support href logic

holidayextras · Aug 7, 2015 · 4282f6e · 4282f6e
1 parent b21f3b3
commit 4282f6e
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 19 deletions.
diff --git a/src/components/image/__tests__/image-test.js b/src/components/image/__tests__/image-test.js
@@ -13,36 +13,80 @@ describe('ImageComponent', function() {
   var renderedImage = null;
   var imageDOMNode = null;
 
-  beforeEach(function() {
+  beforeEach(function(){
     src = 'foo';
     alt = 'bar';
     handleClick = sinon.spy();
-    imageInstance = TestUtils.renderIntoDocument(
-      <ImageComponent src={src} alt={alt} handleClick={handleClick} />
-    );
-    renderedImage = TestUtils.findRenderedDOMComponentWithClass(imageInstance, 'component-image');
-    imageDOMNode = renderedImage.getDOMNode();
   });
 
   it('is an element', function() {
     assert.ok(TestUtils.isElement(<ImageComponent src={src} alt={alt} />));
   });
 
-  it('should render an img tag', function() {
-    assert.equal(imageDOMNode.nodeName, 'IMG');
-  });
+  describe('when an href is passed in', function(){
 
-  it('should have the correct src attribute from props', function() {
-    assert.equal(imageDOMNode.getAttribute('src'), 'foo');
-  });
+    var href = null;
+
+    beforeEach(function() {
+      href = 'http://this.isa.link';
+      imageInstance = TestUtils.renderIntoDocument(
+        <ImageComponent src={src} alt={alt} handleClick={handleClick} href={href} />
+      );
+      renderedImage = TestUtils.findRenderedDOMComponentWithClass(imageInstance, 'component-image');
+      imageDOMNode = renderedImage.getDOMNode();
+    });
+
+    it('should render as an anchor', function() {
+      assert.equal(imageDOMNode.nodeName, 'A');
+    });
+
+    it('should call handleClick prop when clicked', function() {
+      TestUtils.Simulate.click(imageDOMNode);
+      assert.ok(handleClick.calledOnce);
+    });
+
+    it('should render an img tag inside the anchor', function() {
+      assert.equal(imageDOMNode.firstChild.nodeName, 'IMG');
+    });
+
+    it('the img should have the correct src attribute from props', function() {
+      assert.equal(imageDOMNode.firstChild.getAttribute('src'), 'foo');
+    });
+
+    it('the img should have the correct alt attribute from props', function() {
+      assert.equal(imageDOMNode.firstChild.getAttribute('alt'), 'bar');
+    });
 
-  it('should have the correct alt attribute from props', function() {
-    assert.equal(imageDOMNode.getAttribute('alt'), 'bar');
   });
 
-  it('should call handleClick prop when clicked', function() {
-    TestUtils.Simulate.click(imageDOMNode);
-    assert.ok(handleClick.calledOnce);
+  describe('when an href is not passed in', function(){
+
+    beforeEach(function(){
+      imageInstance = TestUtils.renderIntoDocument(
+        <ImageComponent src={src} alt={alt} handleClick={handleClick} />
+      );
+      renderedImage = TestUtils.findRenderedDOMComponentWithClass(imageInstance, 'component-image');
+      imageDOMNode = renderedImage.getDOMNode();
+    });
+
+    it('should render an img tag', function() {
+      assert.equal(imageDOMNode.nodeName, 'IMG');
+    });
+
+    it('should have the correct src attribute from props', function() {
+      assert.equal(imageDOMNode.getAttribute('src'), 'foo');
+    });
+
+    it('should have the correct alt attribute from props', function() {
+      assert.equal(imageDOMNode.getAttribute('alt'), 'bar');
+    });
+
+    it('should call handleClick prop when clicked', function() {
+      TestUtils.Simulate.click(imageDOMNode);
+      assert.ok(handleClick.calledOnce);
+    });
+
   });
 
+
 });
diff --git a/src/components/image/code/templates/imageAnchorTemplate.jsx b/src/components/image/code/templates/imageAnchorTemplate.jsx
@@ -5,8 +5,8 @@ module.exports = function() {
   var dataAttributes = this.getDataAttributesFromProps();
 
   return (
-    <a href={this.props.href}>
-      <img alt={this.props.alt} src={this.props.src} onClick={this.props.handleClick} className="component-image" {...dataAttributes} />
+    <a className="component-image" href={this.props.href} onClick={this.props.handleClick} {...dataAttributes} >
+      <img alt={this.props.alt} src={this.props.src} />
     </a>
   );
 };
diff --git a/src/components/image/code/templates/imageTemplate.jsx b/src/components/image/code/templates/imageTemplate.jsx
@@ -1,6 +1,7 @@
 var React = require('react');
 
 module.exports = function() {
+
   var dataAttributes = this.getDataAttributesFromProps();
 
   return (