diff --git a/karma.conf.js b/karma.conf.js
index 0e9b9204f..b024a62db 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -34,7 +34,11 @@ module.exports = function(config) {
 
     // test results reporter to use
     // possible values: 'dots', 'progress', 'junit', 'growl', 'coverage'
-    reporters: ['dots','progress','coverage','growler'],
+    reporters: ['mocha','coverage','growler'],
+
+    mochaReporter: {
+      showDiff: true
+    },
 
     preprocessors: {
       'src/**/*.js': ['coverage']
diff --git a/package.json b/package.json
index 91f48cc24..eacf40b8f 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "babel-polyfill": "^6.16.0",
     "babel-preset-es2015": "^6.18.0",
     "chai": "^3.5.0",
+    "diff": "^3.2.0",
     "html-webpack-externals-plugin": "^2.1.2",
     "karma": "^1.3.0",
     "karma-babel-preprocessor": "^6.0.1",
@@ -58,6 +59,7 @@
     "karma-coverage": "^1.1.1",
     "karma-growler-reporter": "0.0.1",
     "karma-mocha": "^1.3.0",
+    "karma-mocha-reporter": "^2.2.3",
     "karma-phantomjs-launcher": "^1.0.2",
     "karma-webpack": "^1.8.0",
     "mocha": "^3.2.0",
diff --git a/src/directives/sf-field.directive.spec.js b/src/directives/sf-field.directive.spec.js
new file mode 100644
index 000000000..c31e67bf4
--- /dev/null
+++ b/src/directives/sf-field.directive.spec.js
@@ -0,0 +1,80 @@
+chai.should();
+
+var runSync = function (scope, tmpl) {
+  var directiveScope = tmpl.isolateScope();
+  var stub = sinon.stub(directiveScope, 'resolveReferences', function(schema, form) {
+    directiveScope.render(schema, form);
+  });
+  scope.$apply();
+}
+
+describe('sf-field.directive.js',function() {
+  beforeEach(module('schemaForm'));
+  beforeEach(
+    module(function($sceProvider){
+      $sceProvider.enabled(false);
+    })
+  );
+
+  var keyTests = [
+    {
+      name: 'array of objects',
+      targetKey: ['arrayOfObjects', 0, 'stringVal'],
+      schema: {
+        type: 'object',
+        properties: {
+          arrayOfObjects: {
+            type: 'array',
+            items: {
+              type: 'object',
+              properties: {
+                stringVal: {
+                  type: 'string',
+                  'x-schema-form': {
+                    htmlClass: 'targetKey'
+                  }
+                }
+              }
+            }
+          }
+        }
+      },
+    },
+
+    {
+      name: 'array of strings',
+      targetKey: ['arrayOfStrings', 0],
+      schema: {
+        type: 'object',
+        properties: {
+          arrayOfStrings: {
+            type: 'array',
+            items: {
+              type: 'string',
+              'x-schema-form': {
+                htmlClass: 'targetKey'
+              }
+            }
+          }
+        }
+      }
+    }
+  ];
+
+  keyTests.forEach(function(keyTest) {
+    it('should generate correct form keys for ' + keyTest.name, function(done) {
+      inject(function($compile,$rootScope) {
+        var scope = $rootScope.$new();
+        scope.model = {};
+        scope.schema = keyTest.schema;
+
+        var tmpl = angular.element('<form sf-schema="schema" sf-model="model"></form>');
+
+        $compile(tmpl)(scope);
+        runSync(scope, tmpl);
+
+        tmpl.children().find('.targetKey').scope().form.key.should.deep.equal(keyTest.targetKey);
+      });
+    });
+  });
+});
diff --git a/src/directives/sf-schema.directive.spec.js b/src/directives/sf-schema.directive.spec.js
index b662b3385..93af13372 100644
--- a/src/directives/sf-schema.directive.spec.js
+++ b/src/directives/sf-schema.directive.spec.js
@@ -2217,197 +2217,6 @@ describe('sf-schema.directive.js', function() {
     });
   });
 
-  it('should not add "has-success" class to radios field if a correct value is entered, but disableSuccessState is set on form', function () {
-    var field = {
-      name: 'radios',
-      property: {
-        type: 'boolean',
-      },
-      form: {
-        key: ["field"],
-        type: "radios",
-        titleMap: [
-          {
-            "value": false,
-            "name": "No way"
-          },
-          {
-            "value": true,
-            "name": "OK"
-          }
-        ]
-      }
-    };
-
-    inject(function($compile, $rootScope) {
-      var scope = $rootScope.$new();
-      scope.model = {}
-      scope.schema = {
-        type: 'object',
-        properties: {
-          field: field.property
-        }
-      };
-      scope.form = [field.form];
-
-      var tmpl = angular.element('<form  name="theForm" sf-schema="schema" sf-form="form" sf-model="model"></form>');
-      $compile(tmpl)(scope);
-      runSync(scope, tmpl);
-      var ngModelCtrl = tmpl.find('.field').scope().ngModel;
-      ngModelCtrl.$valid = true;
-      ngModelCtrl.$pristine = false;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-success').should.be.true;
-      scope.form[0].disableSuccessState = true;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-success').should.be.false;
-    });
-  });
-
-  it('should not add "has-error" class to radios field if invalid value is entered, but disableErrorState is set on form', function () {
-    var field = {
-      name: 'radios',
-      property: {
-        type: 'boolean',
-      },
-      form: {
-        key: ["field"],
-        type: "radios",
-        titleMap: [
-          {
-            "value": false,
-            "name": "No way"
-          },
-          {
-            "value": true,
-            "name": "OK"
-          }
-        ]
-      }
-    };
-
-    inject(function($compile, $rootScope) {
-      var scope = $rootScope.$new();
-      scope.model = {
-        field: field.errorValue
-      }
-      scope.schema = {
-        type: 'object',
-        properties: {
-          field: field.property
-        }
-      };
-      scope.form = [field.form];
-
-      var tmpl = angular.element('<form  name="theForm" sf-schema="schema" sf-form="form" sf-model="model"></form>');
-      $compile(tmpl)(scope);
-      runSync(scope, tmpl);
-      var ngModelCtrl = tmpl.find('.field').scope().ngModel;
-      ngModelCtrl.$invalid = true;
-      ngModelCtrl.$pristine = false;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-error').should.be.true;
-      scope.form[0].disableErrorState = true;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-error').should.be.false;
-    });
-  });
-
-  it('should not add "has-success" class to radios-inline field if a correct value is entered, but disableSuccessState is set on form', function () {
-    var field = {
-      name: 'radios',
-      property: {
-        type: 'boolean',
-      },
-      form: {
-        key: ["field"],
-        type: "radios",
-        titleMap: [
-          {
-            "value": false,
-            "name": "No way"
-          },
-          {
-            "value": true,
-            "name": "OK"
-          }
-        ]
-      }
-    };
-
-    inject(function($compile, $rootScope) {
-      var scope = $rootScope.$new();
-      scope.model = {}
-      scope.schema = {
-        type: 'object',
-        properties: {
-          field: field.property
-        }
-      };
-      scope.form = [field.form];
-
-      var tmpl = angular.element('<form  name="theForm" sf-schema="schema" sf-form="form" sf-model="model"></form>');
-      $compile(tmpl)(scope);
-      runSync(scope, tmpl);
-      var ngModelCtrl = tmpl.find('.field').scope().ngModel;
-      ngModelCtrl.$valid = true;
-      ngModelCtrl.$pristine = false;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-success').should.be.true;
-      scope.form[0].disableSuccessState = true;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-success').should.be.false;
-    });
-  });
-
-  it('should not add "has-error" class to radios-inline field if invalid value is entered, but disableErrorState is set on form', function () {
-    var field = {
-      name: 'radios',
-      property: {
-        type: 'boolean',
-      },
-      form: {
-        key: ["field"],
-        type: "radios",
-        titleMap: [
-          {
-            "value": false,
-            "name": "No way"
-          },
-          {
-            "value": true,
-            "name": "OK"
-          }
-        ]
-      }
-    };
-
-    inject(function($compile, $rootScope) {
-      var scope = $rootScope.$new();
-      scope.model = {
-        field: field.errorValue
-      }
-      scope.schema = {
-        type: 'object',
-        properties: {
-          field: { type: 'boolean' }
-        }
-      };
-      scope.form = [field.form];
-
-      var tmpl = angular.element('<form  name="theForm" sf-schema="schema" sf-form="form" sf-model="model"></form>');
-      $compile(tmpl)(scope);
-      runSync(scope, tmpl);
-      var ngModelCtrl = tmpl.find('.field').scope().ngModel;
-      ngModelCtrl.$invalid = true;
-      ngModelCtrl.$pristine = false;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-error').should.be.true;
-      scope.form[0].disableErrorState = true;
-      $rootScope.$apply();
-      tmpl.find('.field').hasClass('has-error').should.be.false;
-    });
-  });
 /*
  TODO
   it('should handle onChange for array type', function () {