Skip to content

Commit e7859b7

Browse files
zoul0813zoul0813
committed
added tests and fixed v-attributes binding on components
1 parent 25e7efb commit e7859b7

14 files changed

+387
-24
lines changed

‎src/fields/abstractField.js‎

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,17 @@ function convertValidator(validator) {
1313
return validator;
1414
}
1515

16+
function attributesDirective(el, binding, vnode) {
17+
let attrs = objGet(vnode.context, "schema.attributes", {});
18+
let container = binding.value || "input";
19+
if(isString(container)) {
20+
attrs = objGet(attrs, container) || attrs;
21+
}
22+
forEach(attrs, (val, key) => {
23+
el.setAttribute(key, val);
24+
});
25+
}
26+
1627
export default {
1728
props: ["model", "schema", "formOptions", "disabled"],
1829

@@ -26,17 +37,9 @@ export default {
2637

2738
directives: {
2839
attributes: {
29-
bind: function(el, binding, vnode) {
30-
let attrs = objGet(vnode.context, "schema.attributes", {});
31-
let container = binding.value || "input";
32-
if(isString(container)) {
33-
attrs = objGet(attrs, container, {});
34-
}
35-
forEach(attrs, (val, key) => {
36-
console.log("v-attributes", key, val);
37-
el.setAttribute(key, val);
38-
});
39-
}
40+
bind: attributesDirective,
41+
updated: attributesDirective,
42+
componentUpdated: attributesDirective,
4043
}
4144
},
4245

‎src/fields/core/fieldCheckbox.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template lang="pug">
2-
input(:id="getFieldID(schema)", type="checkbox", v-model="value", :autocomplete="schema.autocomplete", :disabled="disabled", :name="schema.inputName", :class="schema.fieldClasses", v-attributes="")
2+
input(:id="getFieldID(schema)", type="checkbox", v-model="value", :autocomplete="schema.autocomplete", :disabled="disabled", :name="schema.inputName", :class="schema.fieldClasses", v-attributes="'input'")
33
</template>
44

55
<script>

‎src/fields/core/fieldChecklist.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template lang="pug">
2-
.wrapper(v-attributes="wrapper")
2+
.wrapper(v-attributes="'wrapper'")
33
.listbox.form-control(v-if="schema.listBox", :disabled="disabled")
44
.list-row(v-for="item in items", :class="{'is-checked': isItemChecked(item)}")
55
label
6-
input(:id="getFieldID(schema)", type="checkbox", :checked="isItemChecked(item)", :disabled="disabled", @change="onChanged($event, item)", :name="getInputName(item)", v-attributes="input")
6+
input(:id="getFieldID(schema)", type="checkbox", :checked="isItemChecked(item)", :disabled="disabled", @change="onChanged($event, item)", :name="getInputName(item)", v-attributes="'input'")
77
| {{ getItemName(item) }}
88

99
.combobox.form-control(v-if="!schema.listBox", :disabled="disabled")
@@ -14,7 +14,7 @@
1414
.dropList
1515
.list-row(v-if="comboExpanded", v-for="item in items", :class="{'is-checked': isItemChecked(item)}")
1616
label
17-
input(:id="getFieldID(schema)", type="checkbox", :checked="isItemChecked(item)", :disabled="disabled", @change="onChanged($event, item)", :name="getInputName(item)", v-attributes="input")
17+
input(:id="getFieldID(schema)", type="checkbox", :checked="isItemChecked(item)", :disabled="disabled", @change="onChanged($event, item)", :name="getInputName(item)", v-attributes="'input'")
1818
| {{ getItemName(item) }}
1919
</template>
2020

‎src/fields/core/fieldLabel.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template lang="pug">
2-
span(:id="getFieldID(schema)", :class="schema.fieldClasses", v-attributes) {{ value }}
2+
span(:id="getFieldID(schema)", :class="schema.fieldClasses", v-attributes="'label'") {{ value }}
33
</template>
44

55
<script>

‎src/fields/core/fieldRadios.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template lang="pug">
2-
.radio-list(:disabled="disabled", v-attributes="wrapper")
3-
label(v-for="item in items", :class="{'is-checked': isItemChecked(item)}")
4-
input(:id="getFieldID(schema)", type="radio", :disabled="disabled", :name="id", @click="onSelection(item)", :value="getItemValue(item)", :checked="isItemChecked(item)", :class="schema.fieldClasses", v-attributes="input")
2+
.radio-list(:disabled="disabled", v-attributes="'wrapper'")
3+
label(v-for="item in items", :class="{'is-checked': isItemChecked(item)}", v-attributes="'label'")
4+
input(:id="getFieldID(schema)", type="radio", :disabled="disabled", :name="id", @click="onSelection(item)", :value="getItemValue(item)", :checked="isItemChecked(item)", :class="schema.fieldClasses", v-attributes="'input'")
55
| {{ getItemName(item) }}
66

77
</template>

‎src/fields/core/fieldSelect.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template lang="pug">
2-
select.form-control(v-model="value", :disabled="disabled", :name="schema.inputName", :id="getFieldID(schema)", :class="schema.fieldClasses", v-attributes="input")
2+
select.form-control(v-model="value", :disabled="disabled", :name="schema.inputName", :id="getFieldID(schema)", :class="schema.fieldClasses", v-attributes="'input'")
33
option(v-if="!selectOptions.hideNoneSelectedText", :disabled="schema.required", :value="null") {{ selectOptions.noneSelectedText || "&lt;Nothing selected&gt;" }}
44

55
template(v-for="item in items")

‎src/fields/core/fieldSubmit.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template lang="pug">
2-
input(:id="getFieldID(schema)", type="submit", :value="schema.buttonText", @click="onClick", :name="schema.inputName", :disabled="disabled", :class="schema.fieldClasses", v-attributes="")
2+
input(:id="getFieldID(schema)", type="submit", :value="schema.buttonText", @click="onClick", :name="schema.inputName", :disabled="disabled", :class="schema.fieldClasses", v-attributes="'input'")
33
</template>
44

55
<script>

‎src/fields/core/fieldTextArea.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
:readonly="schema.readonly",
1111
:rows="schema.rows || 2",
1212
:name="schema.inputName",
13-
v-attributes="input")
13+
v-attributes="'input'")
1414
</template>
1515

1616
<script>

‎src/fields/core/fieldUpload.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template lang="pug">
2-
.wrapper(v-attributes="wrapper")
2+
.wrapper(v-attributes="'wrapper'")
33
input.form-control(
44
id="getFieldID(schema)",
55
type="file",
@@ -11,7 +11,7 @@
1111
:readonly="schema.readonly",
1212
:required="schema.required",
1313
:disabled="disabled",
14-
v-attributes="input")
14+
v-attributes="'input'")
1515
</template>
1616

1717
<script>

‎test/unit/specs/fields/fieldCheckbox.spec.js‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,4 +76,60 @@ describe("FieldCheckbox.vue", () => {
7676
});
7777
});
7878
});
79+
80+
describe("check dynamic html attributes", () => {
81+
82+
describe("check input/wrapper attributes", () => {
83+
let schema = {
84+
type: "checkbox",
85+
label: "First Name",
86+
model: "user__model",
87+
inputName: "input_name",
88+
fieldClasses: ["applied-class", "another-class"],
89+
attributes: {
90+
wrapper: {
91+
"data-wrapper": "collapse"
92+
},
93+
input: {
94+
"data-input": "tooltip"
95+
}
96+
}
97+
};
98+
let model = {};
99+
let input, wrap;
100+
101+
before(() => {
102+
createField({ schema, model});
103+
input = wrapper.find('input');
104+
});
105+
106+
it("input should have data-* attribute", () => {
107+
expect(input.attributes()["data-input"]).to.be.equal("tooltip");
108+
});
109+
});
110+
111+
describe("check non-specific attributes", () => {
112+
let schema = {
113+
type: "checkbox",
114+
label: "First Name",
115+
model: "user__model",
116+
inputName: "input_name",
117+
fieldClasses: ["applied-class", "another-class"],
118+
attributes: {
119+
"data-input": "tooltip"
120+
}
121+
};
122+
let model = {};
123+
let input, wrap;
124+
125+
before(() => {
126+
createField({ schema, model});
127+
input = wrapper.find('input');
128+
});
129+
130+
it("input should have data-* attribute", () => {
131+
expect(input.attributes()["data-input"]).to.be.equal("tooltip");
132+
});
133+
});
134+
});
79135
});

0 commit comments

Comments
 (0)