Add tests for tc-form-fonts

Author: Nick Litwin

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

@@ -42,6 +42,9 @@
           isFontSourceRequired: false
         };
 
+        // Initialize font form data
+        $scope.formFonts = { 0: _.assign({id: 0}, angular.copy(emptyFont)) };
+
         $scope.urlRegEx = new RegExp(/^(http(s?):\/\/)?(www\.)?[a-zA-Z0-9\.\-\_]+(\.[a-zA-Z]{2,3})+(\/[a-zA-Z0-9\_\-\s\.\/\?\%\#\&\=]*)?$/);
 
         $scope.selectFont = function(newFont) {

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

@@ -1,19 +1,228 @@
 /* jshint -W117, -W030 */
 describe('Topcoder Form Fonts 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-fonts /></form>');
+    element = form.find('tc-form-fonts');
+    var formElement = $compile(form)(scope);
+    scope.$digest();
+
+    isolateScope = element.isolateScope();
   });
 
   bard.verifyNoOutstandingHttpRequests();
 
-  xdescribe('', function() {
-    beforeEach(function() {});
+  describe('is initialized with', function() {
+    it('empty font data', function() {
+      defaultFormFont = isolateScope.formFonts[0];
+
+      expect(defaultFormFont.id).to.equal(0);
+      expect(defaultFormFont.source).to.equal('');
+      expect(defaultFormFont.name).to.equal('');
+      expect(defaultFormFont.sourceUrl).to.equal('');
+      expect(defaultFormFont.isFontUrlRequired).to.be.false;
+      expect(defaultFormFont.isFontUrlDisabled).to.be.true;
+      expect(defaultFormFont.isFontNameRequired).to.be.false;
+      expect(defaultFormFont.isFontNameDisabled).to.be.true;
+      expect(defaultFormFont.isFontSourceRequired).to.be.false;
+    });
+
+    it('a font list', function() {
+      var fontList = isolateScope.fontList0;
+
+      expect(fontList).to.be.an.array;
+      expect(fontList).to.have.length.of.at.least(1);
+    });
+
+    it('a regular expression', function() {
+      expect(isolateScope.urlRegEx).to.be.an.instanceof(RegExp);
+    });
+  });
+
+  describe('selectFont', function() {
+    var newFont, targetedFont;
+
+    beforeEach(function() {
+      newFont = {
+        id: 0,
+        value: 'FONTS_DOT_COM'
+      };
+
+      targetedFont = isolateScope.formFonts[0];
+    });
+
+    afterEach(function() {
+      newFont = undefined;
+      targetedFont = undefined;
+    });
+
+    it('updates the targeted font source with the new value', function() {
+      expect(targetedFont.source).to.equal('');
+
+      isolateScope.selectFont(newFont);
+      scope.$digest();
+
+      expect(targetedFont.source).to.equal('FONTS_DOT_COM');
+    });
+
+    it('sets disabled properties to false', function() {
+      expect(targetedFont.isFontNameDisabled).to.be.true;
+      expect(targetedFont.isFontUrlDisabled).to.be.true;
+
+      isolateScope.selectFont(newFont);
+      scope.$digest();
+
+      expect(targetedFont.isFontNameDisabled).to.be.false;
+      expect(targetedFont.isFontUrlDisabled).to.be.false;
+    });
+
+    it('sets required properties to true', function() {
+      expect(targetedFont.isFontNameRequired).to.be.false;
+      expect(targetedFont.isFontUrlRequired).to.be.false;
+
+      isolateScope.selectFont(newFont);
+      scope.$digest();
+
+      expect(targetedFont.isFontNameRequired).to.be.true;
+      expect(targetedFont.isFontUrlRequired).to.be.true;
+    });
+
+    it('sets isFontNameRequired to true and isFontUrlRequired to false when STUDIO_STANDARD_FONTS_LIST is selected', function() {
+      expect(targetedFont.isFontNameRequired).to.be.false;
+      expect(targetedFont.isFontUrlRequired).to.be.false;
+
+      isolateScope.selectFont({id: 0, value: 'STUDIO_STANDARD_FONTS_LIST'});
+      scope.$digest();
+
+      expect(targetedFont.isFontNameRequired).to.be.true;
+      expect(targetedFont.isFontUrlRequired).to.be.false;
+    });
+  });
+
+  describe('createAdditionalFontFieldset', function() {
+    it('creates a new fieldset', function() {
+      expect(Object.keys(isolateScope.formFonts).length).to.equal(1);
+
+      isolateScope.createAdditionalFontFieldset();
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formFonts).length).to.equal(2);
+    });
+
+    it('adds an incremented id to the new fieldset', function() {
+      var id = isolateScope.formFonts[0].id;
+
+      isolateScope.createAdditionalFontFieldset();
+      scope.$digest();
+
+      expect(isolateScope.formFonts[1]).to.exist;
+      expect(isolateScope.formFonts[1].id).to.equal(id + 1);
+    });
+  });
+
+  describe('deleteFontFieldset', function() {
+    it('deletes the selected font fieldset', function() {
+      isolateScope.createAdditionalFontFieldset();
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formFonts).length).to.equal(2);
+
+      isolateScope.deleteFontFieldset(1);
+      scope.$digest();
+
+      expect(Object.keys(isolateScope.formFonts).length).to.equal(1);
+    });
+
+    it('resets the font fieldset when it\'s the only one', function() {
+      var font = isolateScope.formFonts[0];
+
+      expect(font.source).to.equal('');
+
+      font.source = 'dropdown selection';
+      scope.$digest();
+
+      expect(font.source).to.equal('dropdown selection');
+
+      isolateScope.deleteFontFieldset(0);
+      scope.$digest();
+
+      expect(isolateScope.formFonts[0].source).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.formFonts[0].source = 'FONTS_DOT_COM';
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+    });
+
+    it('disables the button when 2 fields are filled out', function() {
+      isolateScope.formFonts[0].source = 'FONTS_DOT_COM';
+      isolateScope.formFonts[0].sourceUrl = 'url.com';
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+    });
+
+    it('enables the button when all fields are filled out', function() {
+      isolateScope.formFonts[0].source = 'FONTS_DOT_COM';
+      isolateScope.formFonts[0].name = 'name';
+      isolateScope.formFonts[0].sourceUrl = 'url.com';
+      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.formFonts[0].source = 'FONTS_DOT_COM';
+      isolateScope.formFonts[0].name = 'name';
+      isolateScope.formFonts[0].sourceUrl = 'url.com';
+      scope.$digest();
+
+      expect(button.disabled).to.be.false;
+
+      isolateScope.createAdditionalFontFieldset();
+      scope.$digest();
+
+      expect(button.disabled).to.be.true;
+
+      // Fill out second fieldset
+      isolateScope.formFonts[1].source = 'FONTS_DOT_COM2';
+      isolateScope.formFonts[1].name = 'name';
+      isolateScope.formFonts[1].sourceUrl = 'url2.com';
+      scope.$digest();
+
+      expect(button.disabled).to.be.false;
+
+      // Empty a field in the first fieldset
+      isolateScope.formFonts[0].name = '';
+      scope.$digest();
 
-    it('', function() {});
+      expect(button.disabled).to.be.true;
+    });
   });
 });

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

@@ -17,16 +17,22 @@ describe('Topcoder Form Stockart Directive', function() {
 
   bard.verifyNoOutstandingHttpRequests();
 
-  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('is initialized with', function() {
+    it('empty stockart data', function() {
+      var initialStockart = isolateScope.formStockarts[0];
+
+      expect(initialStockart.id).to.equal(0);
+      expect(initialStockart.description).to.equal('');
+      expect(initialStockart.sourceUrl).to.equal('');
+      expect(initialStockart.fileNumber).to.equal('');
+      expect(initialStockart.isPhotoDescriptionRequired).to.equal(false);
+      expect(initialStockart.isPhotoURLRequired).to.equal(false);
+      expect(initialStockart.isFileNumberRequired).to.equal(false);
+    });
+
+    it('a regular expression', function() {
+      expect(isolateScope.urlRegEx).to.be.an.instanceof(RegExp);
+    });
   });
 
   describe('createAdditionalStockartFieldset', function() {
@@ -149,7 +155,7 @@ describe('Topcoder Form Stockart Directive', function() {
 
       expect(button.disabled).to.be.true;
     });
-  })
+  });
 
   describe('showMandatoryMessage', function() {
     describe('sets the stockart required properties to false when all fields are', function() {

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

@@ -19,19 +19,7 @@
     vm.finishing = false;
     vm.showProgress = false;
     vm.errorInUpload = false;
-    vm.formFonts = {
-      0: {
-        id: 0,
-        source: '',
-        name: '',
-        sourceUrl: '',
-        isFontUrlRequired: false,
-        isFontUrlDisabled: true,
-        isFontNameRequired: false,
-        isFontNameDisabled: true,
-        isFontSourceRequired: false
-      }
-    };
+    vm.formFonts = {};
     vm.formStockarts = {};
     vm.submissionForm = {
       files: [],