From 492514d552e8206ba8cf8d537ae4cc20a5667cc0 Mon Sep 17 00:00:00 2001 From: Duncan Lock Date: Mon, 22 May 2017 16:31:58 -0700 Subject: [PATCH] Added tests for abstractField.getFieldID() Added some tests for the getFieldID function - and tightened up it's slugification. - Tests that values are correctly slugified - Tests that schema properties are returned in the expected order of preference --- src/fields/abstractField.js | 11 ++- test/unit/specs/fields/abstractField.spec.js | 90 +++++++++++++------- 2 files changed, 67 insertions(+), 34 deletions(-) diff --git a/src/fields/abstractField.js b/src/fields/abstractField.js index b3dc4537..0600cd92 100644 --- a/src/fields/abstractField.js +++ b/src/fields/abstractField.js @@ -169,18 +169,21 @@ export default { // If an ID's been explicitly set, use it unchanged return schema.id; } else { + // Return the slugified version of either: return (schema.inputName || schema.label || schema.model) + // NB: This is a very simple, conservative, slugify function, + // avoiding extra dependencies. .toString() .trim() .toLowerCase() - // Spaces to dashes - .replace(/ /g, "-") + // Spaces & underscores to dashes + .replace(/ |_/g, "-") // Multiple dashes to one .replace(/-{2,}/g, "-") // Remove leading & trailing dashes .replace(/^-+|-+$/g, "") - // Remove anything that isn't a (English/ASCII) letter or number. - .replace(/([^a-zA-Z0-9\._-]+)/g, "") + // Remove anything that isn't a (English/ASCII) letter, number or dash. + .replace(/([^a-zA-Z0-9-]+)/g, "") ; } } diff --git a/test/unit/specs/fields/abstractField.spec.js b/test/unit/specs/fields/abstractField.spec.js index 1426682c..3c388ea3 100644 --- a/test/unit/specs/fields/abstractField.spec.js +++ b/test/unit/specs/fields/abstractField.spec.js @@ -10,7 +10,7 @@ Vue.component("AbstractField", AbstractField); let el, vm, field; function createField(test, schema = {}, model = null, disabled = false, options) { - let elm = document.createElement("div"); + let elm = document.createElement("div"); vm = new Vue({ // eslint-disable-next-line quotes @@ -55,16 +55,16 @@ describe("abstractField.vue", function() { }); }); - + describe("check nested value", () => { let schema = { type: "text", label: "Name", model: "user.name" }; - let model = { + let model = { user: { - name: "John Doe" + name: "John Doe" } }; @@ -90,7 +90,7 @@ describe("abstractField.vue", function() { label: "Name", model: "user.name.first" }; - let model = { + let model = { user: { } }; @@ -169,7 +169,7 @@ describe("abstractField.vue", function() { expect(model.name).to.be.equal("!!Foo Bar!!"); }); - }); + }); describe("check schema onChanged event", () => { let schema = { @@ -194,12 +194,12 @@ describe("abstractField.vue", function() { }); }); - }); + }); describe("check validateAfterChanged option", () => { let schema = { - type: "text", - label: "Name", + type: "text", + label: "Name", model: "name" }; @@ -230,13 +230,13 @@ describe("abstractField.vue", function() { }); }); - }); + }); describe("check validate function with one validator", () => { let schema = { - type: "text", - label: "Name", - model: "name", + type: "text", + label: "Name", + model: "name", validator: sinon.spy() }; @@ -253,13 +253,13 @@ describe("abstractField.vue", function() { expect(schema.validator.calledWith(field.value, schema, model)).to.be.true; }); - }); + }); describe("check validate function if field is disabled", () => { let schema = { - type: "text", - label: "Name", - model: "name", + type: "text", + label: "Name", + model: "name", validator: sinon.spy() }; @@ -275,13 +275,13 @@ describe("abstractField.vue", function() { expect(schema.validator.callCount).to.be.equal(0); }); - }); + }); describe("check validate function if field is readonly", () => { let schema = { - type: "text", - label: "Name", - model: "name", + type: "text", + label: "Name", + model: "name", readonly: true, validator: sinon.spy() }; @@ -298,15 +298,15 @@ describe("abstractField.vue", function() { expect(schema.validator.callCount).to.be.equal(0); }); - }); + }); describe("check validate function with validator array", () => { let spy1 = sinon.spy(); let spy2 = sinon.spy(); let schema = { - type: "text", - label: "Name", - model: "name", + type: "text", + label: "Name", + model: "name", validator: [spy1, spy2] }; @@ -355,7 +355,7 @@ describe("abstractField.vue", function() { expect(schema.onValidated.calledWith(model, field.errors, schema)).to.be.true; }); - }); + }); describe("check schema onValidated event", () => { let schema = { @@ -369,7 +369,7 @@ describe("abstractField.vue", function() { let onValidated = sinon.spy(); beforeEach( () => { - let elm = document.createElement("div"); + let elm = document.createElement("div"); vm = new Vue({ // eslint-disable-next-line quotes @@ -384,7 +384,7 @@ describe("abstractField.vue", function() { }).$mount(elm); el = vm.$el; - field = vm.$refs.field; + field = vm.$refs.field; }); it("should return empty array", () => { @@ -448,6 +448,36 @@ describe("abstractField.vue", function() { expect(field.errors[0]).to.be.equal("Validation error!"); }); - }); + }); + + describe("check getFieldID function", () => { + + let schema = { + type: "text", + label: "First Name", + model: "user__model", + inputName: "input_name" + }; + let model = {}; + + before( () => { + createField(this, schema, model); + }); + + it("should return slugified inputName, if available", () => { + expect(field.getFieldID(schema)).to.be.equal("input-name"); + }); + + it("should return slugified label, if no inputName", () => { + delete(schema.inputName); + expect(field.getFieldID(schema)).to.be.equal("first-name"); + }); + + it("should return slugified model name, if no inputName or label", () => { + delete(schema.label); + expect(field.getFieldID(schema)).to.be.equal("user-model"); + }); + + }); -}); \ No newline at end of file +});