Add unit tests for tc-form-stockart

Author: Nick Litwin

app/directives/tc-form-stockart/tc-form-stockart.directive.js

@@ -26,6 +26,9 @@
           isFileNumberRequired: false
         };
 
+        // Initialize stockart form data
+        $scope.formStockarts = { 0: _.assign({id: 0}, angular.copy(emptyStockart)) };
+
         $scope.urlRegEx = new RegExp(/^(http(s?):\/\/)?(www\.)?[a-zA-Z0-9\.\-\_]+(\.[a-zA-Z]{2,3})+(\/[a-zA-Z0-9\_\-\s\.\/\?\%\#\&\=]*)?$/);
 
         $scope.createAdditionalStockartFieldset = function() {

app/directives/tc-form-stockart/tc-form-stockart.spec.js

@@ -1,19 +1,216 @@
 /* jshint -W117, -W030 */
 describe('Topcoder Form Stockart Directive', function() {
-  var scope;
-
-  // USE AS TEMPLATE FOR DIRECTIVES
+  var scope, element, isolateScope;
 
   beforeEach(function() {
-    bard.appModule('tcUIComponents');
+    bard.appModule('topcoder');
     bard.inject(this, '$compile', '$rootScope');
+    scope = $rootScope.$new();
+
+    var form = angular.element('<form><tc-form-stockart /></form>');
+    element = form.find('tc-form-stockart');
+    var formElement = $compile(form)(scope);
+    scope.$digest();
+
+    isolateScope = element.isolateScope();
   });
 
   bard.verifyNoOutstandingHttpRequests();
 
-  xdescribe('', function() {
-    beforeEach(function() {});
+  it('starts with empty stockart data', function() {
+    defaultFormStockart = isolateScope.formStockarts[0];
+
+    expect(defaultFormStockart.id).to.equal(0);
+    expect(defaultFormStockart.description).to.equal('');
+    expect(defaultFormStockart.sourceUrl).to.equal('');
+    expect(defaultFormStockart.fileNumber).to.equal('');
+    expect(defaultFormStockart.isPhotoDescriptionRequired).to.equal(false);
+    expect(defaultFormStockart.isPhotoURLRequired).to.equal(false);
+    expect(defaultFormStockart.isFileNumberRequired).to.equal(false);
+  });
+
+  describe('createAdditionalStockartFieldset', function() {
+    it('creates a new fieldset', function() {
+      expect(Object.keys(isolateScope.formStockarts).length).to.equal(1);
+
+      isolateScope.createAdditionalStockartFieldset();
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formStockarts).length).to.equal(2);
+    });
+
+    it('adds an incremented id to the new fieldset', function() {
+      var id = isolateScope.formStockarts[0].id;
+
+      isolateScope.createAdditionalStockartFieldset();
+      scope.$digest();
+
+      expect(isolateScope.formStockarts[1]).to.exist;
+      expect(isolateScope.formStockarts[1].id).to.equal(id + 1);
+    });
+  })
+
+  describe('deleteStockartFieldset', function() {
+    it('deletes the selected stockart fieldset', function() {
+      isolateScope.createAdditionalStockartFieldset();
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formStockarts).length).to.equal(2);
+
+      isolateScope.deleteStockartFieldset(1);
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formStockarts).length).to.equal(1);
+    });
+
+    it('resets the stockart fieldset when it\'s the only one', function() {
+      var stockart = isolateScope.formStockarts[0];
+
+      expect(stockart.description).to.equal('');
+
+      stockart.description = 'a funny cat picture';
+      scope.$digest();
+
+      expect(stockart.description).to.equal('a funny cat picture');
+
+      isolateScope.deleteStockartFieldset(0);
+      scope.$digest();
+
+      expect(isolateScope.formStockarts[0].description).to.equal('');
+    });
+  });
+
+  describe('isButtonDisabled', function() {
+    var button;
+
+    beforeEach(function() {
+      button = $(element).find('.fieldset__button')[0];
+    });
+
+    afterEach(function() {
+      button = undefined;
+    });
+
+    it('disables the button when no fields are filled out', function() {
+      expect(button.disabled).to.be.true;
+    });
+
+    it('disables the button when 1 field is filled out', function() {
+      isolateScope.formStockarts[0].description = 'test description';
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+    });
+
+    it('disables the button when 2 fields are filled out', function() {
+      isolateScope.formStockarts[0].description = 'test description';
+      isolateScope.formStockarts[0].sourceUrl = 'url';
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+    });
+
+    it('enables the button when all fields are filled out', function() {
+      isolateScope.formStockarts[0].description = 'test description';
+      isolateScope.formStockarts[0].sourceUrl = 'url';
+      isolateScope.formStockarts[0].fileNumber = '123';
+      scope.$digest();
+
+      expect(button.disabled).to.be.false;
+    });
+
+    it('disables the button when any field in any fieldset is empty', function() {
+      expect(button.disabled).to.be.true;
+
+      // Fill out first fieldset
+      isolateScope.formStockarts[0].description = 'test description';
+      isolateScope.formStockarts[0].sourceUrl = 'url.com';
+      isolateScope.formStockarts[0].fileNumber = '123';
+      scope.$digest();
+
+      expect(button.disabled).to.be.false;
+
+      isolateScope.createAdditionalStockartFieldset();
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+
+      // Fill out second fieldset
+      isolateScope.formStockarts[1].description = 'test description2';
+      isolateScope.formStockarts[1].sourceUrl = 'url2.com';
+      isolateScope.formStockarts[1].fileNumber = '1232';
+      scope.$digest();
+
+      expect(button.disabled).to.be.false;
+
+      // Empty a field in the first fieldset
+      isolateScope.formStockarts[0].fileNumber = '';
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+    });
+  })
+
+  describe('showMandatoryMessage', function() {
+    describe('sets the stockart required properties to false when all fields are', function() {
+      var stockart;
+
+      beforeEach(function() {
+        stockart = isolateScope.formStockarts[0];
+        stockart.description = 'test description';
+        stockart.sourceUrl = 'url.com';
+        stockart.fileNumber = '123';
+        scope.$digest();
+      });
+
+      afterEach(function() {
+        stockart = undefined;
+      });
+
+      it('filled out', function() {
+        expect(stockart.isPhotoDescriptionRequired).to.be.false;
+        expect(stockart.isPhotoURLRequired).to.be.false;
+        expect(stockart.isFileNumberRequired).to.be.false;
+      });
+
+      it('empty', function() {
+        // Reset stockart fields
+        stockart.description = '';
+        stockart.sourceUrl = '';
+        stockart.fileNumber = '';
+        scope.$digest();
+
+        expect(stockart.isPhotoDescriptionRequired).to.be.false;
+        expect(stockart.isPhotoURLRequired).to.be.false;
+        expect(stockart.isFileNumberRequired).to.be.false;
+      });
+    });
+
+
+    describe('sets the stockart required properties to false when all fields are', function() {
+      var stockart;
+
+      beforeEach(function() {
+        stockart = isolateScope.formStockarts[0];
+        stockart.description = 'test description';
+        stockart.sourceUrl = 'url.com';
+        stockart.fileNumber = '123';
+        scope.$digest();
+      });
+
+      afterEach(function() {
+        stockart = undefined;
+      });
+
+      it('sets the stockart required properties to true if any field is blank', function() {
+        // Reset stockart fields
+        stockart.description = '';
+        scope.$digest();
 
-    it('', function() {});
+        expect(stockart.isPhotoDescriptionRequired).to.be.true;
+        expect(stockart.isPhotoURLRequired).to.be.true;
+        expect(stockart.isFileNumberRequired).to.be.true;
+      });
+    });
   });
 });

app/directives/tc-input/tc-input.spec.js

@@ -1,6 +1,6 @@
 /* jshint -W117, -W030 */
 describe('Topcoder Input Directive', function() {
-  var scope, element, controller;
+  var scope, element;
 
   beforeEach(function() {
     bard.appModule('topcoder');

app/filters/filters.spec.js

@@ -131,7 +131,6 @@ describe('filters', function() {
       expect(ternaryFilter(true, 1, 2)).to.be.equal(1);
       expect(ternaryFilter(false, 1, 2)).to.be.equal(2);
       expect(ternaryFilter(0, 1, 2)).to.be.equal(2);
-      console.log(jstz.determine().name());
       expect(ternaryFilter(true, 'm', 'n')).to.be.equal('m');
     });
   });

app/index.jade

@@ -156,8 +156,6 @@ html
     script(src='../bower_components/react/react.js')
     script(src='../bower_components/react/react-dom.js')
     script(src='../bower_components/classnames/index.js')
-    script(src='../bower_components/classnames/bind.js')
-    script(src='../bower_components/classnames/dedupe.js')
     script(src='../bower_components/react-input-autosize/dist/react-input-autosize.min.js')
     script(src='../bower_components/react-select/dist/react-select.min.js')
     script(src='../bower_components/ngReact/ngReact.js')

app/specs.html

@@ -44,6 +44,7 @@ <h1><a href="specs.html">Spec Runner</a></h1>
     </script>
 
     <!-- bower:js -->
+    <script src="../bower_components/zepto/zepto.js"></script>
     <script src="../bower_components/angular/angular.js"></script>
     <script src="../bower_components/a0-angular-storage/dist/angular-storage.js"></script>
     <script src="../bower_components/angucomplete-alt/angucomplete-alt.js"></script>
@@ -69,8 +70,6 @@ <h1><a href="specs.html">Spec Runner</a></h1>
     <script src="../bower_components/react/react.js"></script>
     <script src="../bower_components/react/react-dom.js"></script>
     <script src="../bower_components/classnames/index.js"></script>
-    <script src="../bower_components/classnames/bind.js"></script>
-    <script src="../bower_components/classnames/dedupe.js"></script>
     <script src="../bower_components/react-input-autosize/dist/react-input-autosize.min.js"></script>
     <script src="../bower_components/react-select/dist/react-select.min.js"></script>
     <script src="../bower_components/ngReact/ngReact.js"></script>
@@ -268,8 +267,8 @@ <h1><a href="specs.html">Spec Runner</a></h1>
     <script src="/app/topcoder.interceptors.spec.js"></script>
     <script src="/app/filters/filters.spec.js"></script>
     <script src="/app/my-challenges/my-challenges.spec.js"></script>
-    <script src="/app/my-srms/my-srms.spec.js"></script>
     <script src="/app/my-dashboard/my-dashboard.spec.js"></script>
+    <script src="/app/my-srms/my-srms.spec.js"></script>
     <script src="/app/profile/profile.controller.spec.js"></script>
     <script src="/app/services/authToken.service.spec.js"></script>
     <script src="/app/services/challenge.service.spec.js"></script>
@@ -285,8 +284,8 @@ <h1><a href="specs.html">Spec Runner</a></h1>
     <script src="/app/skill-picker/skill-picker.spec.js"></script>
     <script src="/app/submissions/submissions.spec.js"></script>
     <script src="/app/account/login/login.spec.js"></script>
-    <script src="/app/account/logout/logout.controller.spec.js"></script>
     <script src="/app/account/register/register.spec.js"></script>
+    <script src="/app/account/logout/logout.controller.spec.js"></script>
     <script src="/app/account/reset-password/reset-password.spec.js"></script>
     <script src="/app/blocks/exception/exception-handler.provider.spec.js"></script>
     <script src="/app/directives/badges/badge-tooltip.spec.js"></script>

app/submissions/submit-file/submit-file.controller.js

@@ -32,17 +32,7 @@
         isFontSourceRequired: false
       }
     };
-    vm.formStockarts = {
-      0: {
-        id: 1,
-        description: '',
-        sourceUrl: '',
-        fileNumber: '',
-        isPhotoDescriptionRequired: false,
-        isPhotoURLRequired: false,
-        isFileNumberRequired: false
-      }
-    };
+    vm.formStockarts = {};
     vm.submissionForm = {
       files: [],
 
@@ -148,10 +138,18 @@
       vm.submissionsBody.data.submitterRank = vm.submissionForm.submitterRank;
 
       // Process stock art
-      var processedStockarts = _.map(vm.formStockarts, function(formStockart) {
+      var processedStockarts = _.reduce(vm.formStockarts, function(compiledStockarts, formStockart) {
+        if (formStockart.description) {
           delete formStockart.id;
-          return formStockart;
-      });
+          delete formStockart.isPhotoDescriptionRequired;
+          delete formStockart.isPhotoURLRequired;
+          delete formStockart.isFileNumberRequired;
+
+          compiledStockarts.push(formStockart);
+        }
+
+        return compiledStockarts;
+      }, []);
 
       vm.submissionsBody.data.stockArts = processedStockarts;
 
@@ -164,6 +162,7 @@
           delete formFont.isFontNameRequired;
           delete formFont.isFontNameDisabled;
           delete formFont.isFontSourceRequired;
+
           compiledFonts.push(formFont);
         }