diff --git a/test/unit/specs/fields/fieldChecklist.spec.js b/test/unit/specs/fields/fieldChecklist.spec.js
index f45e12c6..c7ed470d 100644
--- a/test/unit/specs/fields/fieldChecklist.spec.js
+++ b/test/unit/specs/fields/fieldChecklist.spec.js
@@ -35,6 +35,7 @@ describe("fieldChecklist.vue", function() {
 			let model = { skills: ["Javascript", "VueJS"] };
 			let listbox;
 			let checkboxes;
+			let listRowList;
 
 			function isChecked(idx) {
 				return(checkboxes[idx].checked);
@@ -44,6 +45,7 @@ describe("fieldChecklist.vue", function() {
 				createField(this, schema, model, false);
 				listbox = el.querySelector(".listbox");
 				checkboxes = listbox.querySelectorAll("input[type=checkbox]");
+				listRowList = listbox.querySelectorAll(".list-row");
 			});
 
 			it("should contain a .listbox element", () => {
@@ -64,25 +66,75 @@ describe("fieldChecklist.vue", function() {
 				expect(isChecked(6)).to.be.true;
 			});
 
-			it("listbox value should be the model value after changed", (done) => {
-				model.skills = ["ReactJS"];
-				vm.$nextTick( () => {
-					expect(isChecked(0)).to.be.false;
-					expect(isChecked(1)).to.be.false;
-					expect(isChecked(6)).to.be.false;
-					expect(isChecked(5)).to.be.true;
-					done();
+
+			describe("test values reactivity to changes", () => {
+				
+				it("listbox value should be the model value after changed", (done) => {
+					model.skills = ["ReactJS"];
+					vm.$nextTick( () => {
+						expect(isChecked(0)).to.be.false;
+						expect(isChecked(1)).to.be.false;
+						expect(isChecked(6)).to.be.false;
+						expect(isChecked(5)).to.be.true;
+						done();
+					});
+
 				});
 
+				it("model value should be the listbox value if changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal(["ReactJS", "HTML5"]);
+						done();
+					});
+
+				});
 			});
 
-			it("model value should be the listbox value if changed", (done) => {
-				checkboxes[0].checked = true;
-				trigger(checkboxes[0], "change");
+			describe("test 'is-checked' class attribution reactivity to changes", () => {
+
+				it(".list-row with checked input should have a 'is-checked' class", () => {
+					expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[5].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after model value is changed", (done) => {
+					model.skills = ["AngularJS"];
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
+
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after listbox value is changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal(["ReactJS", "HTML5"]);
-					done();
 				});
 
 			});
@@ -108,6 +160,7 @@ describe("fieldChecklist.vue", function() {
 			let model = { skills: [2, 7] };
 			let listbox;
 			let checkboxes;
+			let listRowList;
 
 			function isChecked(idx) {
 				return(checkboxes[idx].checked);
@@ -117,6 +170,7 @@ describe("fieldChecklist.vue", function() {
 				createField(this, schema, model, false);
 				listbox = el.querySelector(".listbox");
 				checkboxes = listbox.querySelectorAll("input[type=checkbox]");
+				listRowList = listbox.querySelectorAll(".list-row");
 			});
 
 			it("should contain items", () => {
@@ -126,27 +180,85 @@ describe("fieldChecklist.vue", function() {
 			it("should checked the values", () => {
 				expect(isChecked(0)).to.be.false;
 				expect(isChecked(1)).to.be.true;
+				expect(isChecked(2)).to.be.false;
+				expect(isChecked(3)).to.be.false;
+				expect(isChecked(4)).to.be.false;
+				expect(isChecked(5)).to.be.false;
 				expect(isChecked(6)).to.be.true;
 			});
 
-			it("listbox value should be the model value after changed", (done) => {
-				model.skills = [3];
-				vm.$nextTick( () => {
-					expect(isChecked(0)).to.be.false;
-					expect(isChecked(1)).to.be.false;
-					expect(isChecked(2)).to.be.true;
-					done();
+			describe("test values reactivity to changes", () => {
+
+				it("listbox value should be the model value after changed", (done) => {
+					model.skills = [3];
+					vm.$nextTick( () => {
+						expect(isChecked(0)).to.be.false;
+						expect(isChecked(1)).to.be.false;
+						expect(isChecked(2)).to.be.true;
+						expect(isChecked(3)).to.be.false;
+						expect(isChecked(4)).to.be.false;
+						expect(isChecked(5)).to.be.false;
+						expect(isChecked(6)).to.be.false;
+						done();
+					});
+
+				});
+
+				it("model value should be the listbox value if changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal([3, 1]);
+						done();
+					});
+
 				});
 
 			});
 
-			it("model value should be the listbox value if changed", (done) => {
-				checkboxes[0].checked = true;
-				trigger(checkboxes[0], "change");
+			describe("test 'is-checked' class attribution reactivity to changes", () => {
+
+				it(".list-row with checked input should have a 'is-checked' class", () => {
+					expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[2].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after model value is changed", (done) => {
+					model.skills = [4];
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
+
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after listbox value is changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal([3, 1]);
-					done();
 				});
 
 			});
@@ -174,6 +286,7 @@ describe("fieldChecklist.vue", function() {
 			let model = { skills: [2, 7] };
 			let listbox;
 			let checkboxes;
+			let listRowList;
 
 			function isChecked(idx) {
 				return(checkboxes[idx].checked);
@@ -183,6 +296,7 @@ describe("fieldChecklist.vue", function() {
 				createField(this, schema, model, false);
 				listbox = el.querySelector(".listbox");
 				checkboxes = listbox.querySelectorAll("input[type=checkbox]");
+				listRowList = listbox.querySelectorAll(".list-row");				
 			});
 
 			it("should contain items", () => {
@@ -192,27 +306,81 @@ describe("fieldChecklist.vue", function() {
 			it("should checked the values", () => {
 				expect(isChecked(0)).to.be.false;
 				expect(isChecked(1)).to.be.true;
+				expect(isChecked(2)).to.be.false;
+				expect(isChecked(3)).to.be.false;
+				expect(isChecked(4)).to.be.false;
+				expect(isChecked(5)).to.be.false;
 				expect(isChecked(6)).to.be.true;
 			});
 
-			it("listbox value should be the model value after changed", (done) => {
-				model.skills = [3];
-				vm.$nextTick( () => {
-					expect(isChecked(0)).to.be.false;
-					expect(isChecked(1)).to.be.false;
-					expect(isChecked(2)).to.be.true;
-					done();
+			describe("test values reactivity to changes", () => {
+			
+				it("listbox value should be the model value after changed", (done) => {
+					model.skills = [3];
+					vm.$nextTick( () => {
+						expect(isChecked(0)).to.be.false;
+						expect(isChecked(1)).to.be.false;
+						expect(isChecked(2)).to.be.true;
+						done();
+					});
+
+				});
+
+				it("model value should be the listbox value if changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal([3, 1]);
+						done();
+					});
+
 				});
 
 			});
 
-			it("model value should be the listbox value if changed", (done) => {
-				checkboxes[0].checked = true;
-				trigger(checkboxes[0], "change");
+			describe("test 'is-checked' class attribution reactivity to changes", () => {
+
+				it(".list-row with checked input should have a 'is-checked' class", () => {
+					expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[2].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after model value is changed", (done) => {
+					model.skills = [4];
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
+
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after listbox value is changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal([3, 1]);
-					done();
 				});
 
 			});
@@ -243,6 +411,7 @@ describe("fieldChecklist.vue", function() {
 			let dropList;
 			let mainRow;
 			let checkboxes;
+			let listRowList;
 
 			function isChecked(idx) {
 				return(checkboxes[idx].checked);
@@ -291,48 +460,104 @@ describe("fieldChecklist.vue", function() {
 				expect(isChecked(6)).to.be.true;
 			});
 
-			it("dropList value should be the model value after changed", (done) => {
-				model.skills = ["ReactJS"];
-				vm.$nextTick( () => {
-					expect(isChecked(0)).to.be.false;
-					expect(isChecked(1)).to.be.false;
-					expect(isChecked(6)).to.be.false;
-					expect(isChecked(5)).to.be.true;
-					done();
+
+
+			describe("test values reactivity to changes", () => {
+
+				it("dropList value should be the model value after changed", (done) => {
+					model.skills = ["ReactJS"];
+					vm.$nextTick( () => {
+						expect(isChecked(0)).to.be.false;
+						expect(isChecked(1)).to.be.false;
+						expect(isChecked(6)).to.be.false;
+						expect(isChecked(5)).to.be.true;
+						done();
+					});
+
 				});
 
-			});
+				it("model value should be the dropList value if changed (add)", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
 
-			it("model value should be the dropList value if changed (add)", (done) => {
-				checkboxes[0].checked = true;
-				trigger(checkboxes[0], "change");
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal(["ReactJS", "HTML5"]);
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal(["ReactJS", "HTML5"]);
-					done();
 				});
 
-			});
+				it("model value should be the checklist value if changed (remove)", (done) => {
+					checkboxes[0].checked = false;
+					trigger(checkboxes[0], "input");
 
-			it("model value should be the checklist value if changed (remove)", (done) => {
-				checkboxes[0].checked = false;
-				trigger(checkboxes[0], "change");
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal(["ReactJS"]);
+						done();
+					});
+
+				});
+
+				it("model value should be the dropList value if changed (null)", (done) => {
+					model.skills = null;
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						expect(model.skills).to.be.deep.equal(["HTML5"]);
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal(["ReactJS"]);
-					done();
 				});
 
 			});
 
-			it("model value should be the dropList value if changed (null)", (done) => {
-				model.skills = null;
-				checkboxes[0].checked = true;
-				trigger(checkboxes[0], "change");
+			describe("test 'is-checked' class attribution reactivity to changes", () => {
+
+				it(".list-row with checked input should have a 'is-checked' class", () => {
+					listRowList = dropList.querySelectorAll(".list-row");
+					expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+					expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[5].classList.contains("is-checked")).to.be.false;
+					expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after model value is changed", (done) => {
+					model.skills = ["ReactJS"];
+
+					vm.$nextTick( () => {
+						listRowList = dropList.querySelectorAll(".list-row");
+						expect(listRowList[0].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
+
+				});
+
+				it(".list-row with checked input should have a 'is-checked' class after listbox value is changed", (done) => {
+					checkboxes[0].checked = true;
+					trigger(checkboxes[0], "input");
+
+					vm.$nextTick( () => {
+						listRowList = dropList.querySelectorAll(".list-row");
+						expect(listRowList[0].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[1].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[2].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[3].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[4].classList.contains("is-checked")).to.be.false;
+						expect(listRowList[5].classList.contains("is-checked")).to.be.true;
+						expect(listRowList[6].classList.contains("is-checked")).to.be.false;
+						done();
+					});
 
-				vm.$nextTick( () => {
-					expect(model.skills).to.be.deep.equal(["HTML5"]);
-					done();
 				});
 
 			});