Skip to content

Commit 914161a

Browse files
marcosmouramarcosmoura
committed
Merge remote-tracking branch 'origin/dev'
* origin/dev: test(MdSwitch): fix test script (vuematerial#1739) test(MdCheckbox): fix test script (vuematerial#1737) test(MdBadge): fix test script (vuematerial#1736) fix(MdTable): fix table rendering default slot twice (vuematerial#1731)
2 parents 3e4b551 + b63fc6c commit 914161a

File tree

7 files changed

+76
-78
lines changed

7 files changed

+76
-78
lines changed

‎src/components/MdBadge/MdBadge.test.js

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,26 @@
11
import mountTemplate from 'test/utils/mountTemplate'
22
import MdBadge from './MdBadge.vue'
3+
import MdBadgeStandalone from './MdBadgeStandalone.vue'
34

45
test('should render the badge', async () => {
5-
const template = '<md-badge>Lorem ipsum</md-badge>'
6+
const template = '<md-badge md-content="3">Lorem ipsum</md-badge>'
7+
const wrapper = await mountTemplate(MdBadge, template)
8+
9+
expect(wrapper.hasClass('md-badge-content')).toBe(true)
10+
const badges = wrapper.find(MdBadgeStandalone)
11+
expect(badges.length).toBe(1)
12+
const badge = badges[0]
13+
expect(badge.hasClass('md-badge')).toBe(true)
14+
const badgeContent = badge.text().trim();
15+
expect(badgeContent).toBe('3')
16+
const slotText = wrapper.text().replace(badgeContent, '').trim()
17+
expect(slotText).toBe('Lorem ipsum')
18+
})
19+
20+
test('should render the badge', async () => {
21+
const template = '<md-badge md-content="3"></md-badge>'
622
const wrapper = await mountTemplate(MdBadge, template)
723

824
expect(wrapper.hasClass('md-badge')).toBe(true)
9-
expect(wrapper.text()).toBe('Lorem ipsum')
25+
expect(wrapper.text().trim()).toBe('3')
1026
})

‎src/components/MdCheckbox/MdCheckbox.test.js

Lines changed: 27 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -43,13 +43,6 @@ test('should create a fallback id if not given', async () => {
4343
expect(label.getAttribute('for')).toBe(createdId)
4444
})
4545

46-
test('should create a fallback value if not given', async () => {
47-
const wrapper = await mountStringSlot(MdCheckbox, 'Label')
48-
const createdValue = wrapper.vm.$props.value
49-
50-
expect(createdValue).toBe('on')
51-
})
52-
5346
test('should create disabled and required classes', async () => {
5447
const wrapper = await mountStringSlot(MdCheckbox, 'Label', {
5548
propsData: {
@@ -150,7 +143,7 @@ test('should toggle a checked class when checked', async () => {
150143
expect(checkbox.hasClass('md-checked')).toBe(false)
151144
})
152145

153-
test('should bind "on" value when no value attribute is given', async () => {
146+
test('should bind true / false when no value attribute is given', async () => {
154147
const template = `
155148
<div>
156149
<md-checkbox v-model="model"></md-checkbox>
@@ -168,69 +161,67 @@ test('should bind "on" value when no value attribute is given', async () => {
168161

169162
container.trigger('click')
170163
expect(checkbox.vm.isSelected).toBe(true)
171-
expect(wrapper.data().model).toBe('on')
164+
expect(wrapper.data().model).toBe(true)
172165

173166
container.trigger('click')
174167
expect(checkbox.vm.isSelected).toBe(false)
175-
expect(wrapper.data().model).toBe(null)
168+
expect(wrapper.data().model).toBe(false)
176169
})
177170

178-
test('should toggle string values on model', async () => {
171+
test('true-value / false-value should works', async () => {
179172
const template = `
180173
<div>
181-
<md-checkbox v-model="model" value="1"></md-checkbox>
174+
<md-checkbox v-model="model" true-value="true" false-value="false"></md-checkbox>
182175
</div>
183176
`
184177
const wrapper = await mountTemplate(MdCheckbox, template, {
185178
data: {
186-
model: '1'
179+
model: null
187180
}
188181
})
189182
const checkbox = wrapper.find(MdCheckbox)[0]
190183
const container = wrapper.find('.md-checkbox-container')[0]
191184

192-
expect(checkbox.vm.isSelected).toBe(true)
193-
194-
container.trigger('click')
195185
expect(checkbox.vm.isSelected).toBe(false)
196-
expect(wrapper.data().model).toBe(null)
197186

198187
container.trigger('click')
199188
expect(checkbox.vm.isSelected).toBe(true)
200-
expect(wrapper.data().model).toBe('1')
189+
expect(wrapper.data().model).toBe('true')
190+
191+
container.trigger('click')
192+
expect(checkbox.vm.isSelected).toBe(false)
193+
expect(wrapper.data().model).toBe('false')
201194
})
202195

203-
test('should toggle boolean model when checkbox do not have a value', async () => {
196+
test('should toggle string values on model', async () => {
204197
const template = `
205198
<div>
206-
<md-checkbox v-model="model"></md-checkbox>
199+
<md-checkbox v-model="model" value="1"></md-checkbox>
207200
</div>
208201
`
209202
const wrapper = await mountTemplate(MdCheckbox, template, {
210203
data: {
211-
model: false
204+
model: '1'
212205
}
213206
})
214207
const checkbox = wrapper.find(MdCheckbox)[0]
215208
const container = wrapper.find('.md-checkbox-container')[0]
216209

217-
await checkbox.vm.$nextTick()
210+
expect(checkbox.vm.isSelected).toBe(true)
218211

212+
container.trigger('click')
219213
expect(checkbox.vm.isSelected).toBe(false)
214+
expect(wrapper.data().model).toBe(null)
220215

221216
container.trigger('click')
222217
expect(checkbox.vm.isSelected).toBe(true)
223-
expect(wrapper.data().model).toBe(true)
224-
225-
container.trigger('click')
226-
expect(checkbox.vm.isSelected).toBe(false)
227-
expect(wrapper.data().model).toBe(false)
218+
expect(wrapper.data().model).toBe('1')
228219
})
229220

230-
test('should toggle boolean model when checkbox have true value', async () => {
221+
test('should toggle boolean model when checkbox do not have a value', async () => {
231222
const template = `
232223
<div>
233-
<md-checkbox v-model="model" :value="true"></md-checkbox>
224+
<md-checkbox v-model="model"></md-checkbox>
234225
</div>
235226
`
236227
const wrapper = await mountTemplate(MdCheckbox, template, {
@@ -254,10 +245,10 @@ test('should toggle boolean model when checkbox have true value', async () => {
254245
expect(wrapper.data().model).toBe(false)
255246
})
256247

257-
test('should toggle boolean model when checkbox have false value', async () => {
248+
test('should toggle null / value while checkbox has been set value', async () => {
258249
const template = `
259250
<div>
260-
<md-checkbox v-model="model" :value="false"></md-checkbox>
251+
<md-checkbox v-model="model" value="val"></md-checkbox>
261252
</div>
262253
`
263254
const wrapper = await mountTemplate(MdCheckbox, template, {
@@ -270,13 +261,13 @@ test('should toggle boolean model when checkbox have false value', async () => {
270261

271262
await checkbox.vm.$nextTick()
272263

273-
expect(checkbox.vm.isSelected).toBe(true)
274-
275-
container.trigger('click')
276264
expect(checkbox.vm.isSelected).toBe(false)
277-
expect(wrapper.data().model).toBe(true)
278265

279266
container.trigger('click')
280267
expect(checkbox.vm.isSelected).toBe(true)
281-
expect(wrapper.data().model).toBe(false)
268+
expect(wrapper.data().model).toBe('val')
269+
270+
container.trigger('click')
271+
expect(checkbox.vm.isSelected).toBe(false)
272+
expect(wrapper.data().model).toBe(null)
282273
})

‎src/components/MdCheckbox/MdCheckbox.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="md-checkbox" :class="[$mdActiveTheme, checkClasses]">
33
<div class="md-checkbox-container" @click.stop="toggleCheck">
44
<md-ripple md-centered :md-active.sync="rippleActive" :md-disabled="disabled">
5-
<input type="checkbox" v-bind="attrs" :indeterminate.prop="indeterminate">
5+
<input :id="id" type="checkbox" v-bind="attrs" :indeterminate.prop="indeterminate">
66
</md-ripple>
77
</div>
88

‎src/components/MdSwitch/MdSwitch.test.js

Lines changed: 27 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -43,13 +43,6 @@ test('should create a fallback id if not given', async () => {
4343
expect(label.getAttribute('for')).toBe(createdId)
4444
})
4545

46-
test('should create a fallback value if not given', async () => {
47-
const wrapper = await mountStringSlot(MdSwitch, 'Label')
48-
const createdValue = wrapper.vm.$props.value
49-
50-
expect(createdValue).toBe('on')
51-
})
52-
5346
test('should create disabled and required classes', async () => {
5447
const wrapper = await mountStringSlot(MdSwitch, 'Label', {
5548
propsData: {
@@ -150,7 +143,7 @@ test('should toggle a checked class when checked', async () => {
150143
expect(toggle.hasClass('md-checked')).toBe(false)
151144
})
152145

153-
test('should bind "on" value when no value attribute is given', async () => {
146+
test('should bind true / false when no value attribute is given', async () => {
154147
const template = `
155148
<div>
156149
<md-switch v-model="model"></md-switch>
@@ -168,69 +161,67 @@ test('should bind "on" value when no value attribute is given', async () => {
168161

169162
container.trigger('click')
170163
expect(toggle.vm.isSelected).toBe(true)
171-
expect(wrapper.data().model).toBe('on')
164+
expect(wrapper.data().model).toBe(true)
172165

173166
container.trigger('click')
174167
expect(toggle.vm.isSelected).toBe(false)
175-
expect(wrapper.data().model).toBe(null)
168+
expect(wrapper.data().model).toBe(false)
176169
})
177170

178-
test('should toggle string values on model', async () => {
171+
test('true-value / false-value should works', async () => {
179172
const template = `
180173
<div>
181-
<md-switch v-model="model" value="1"></md-switch>
174+
<md-switch v-model="model" true-value="true" false-value="false"></md-switch>
182175
</div>
183176
`
184177
const wrapper = await mountTemplate(MdSwitch, template, {
185178
data: {
186-
model: '1'
179+
model: null
187180
}
188181
})
189182
const toggle = wrapper.find(MdSwitch)[0]
190183
const container = wrapper.find('.md-switch-container')[0]
191184

192-
expect(toggle.vm.isSelected).toBe(true)
193-
194-
container.trigger('click')
195185
expect(toggle.vm.isSelected).toBe(false)
196-
expect(wrapper.data().model).toBe(null)
197186

198187
container.trigger('click')
199188
expect(toggle.vm.isSelected).toBe(true)
200-
expect(wrapper.data().model).toBe('1')
189+
expect(wrapper.data().model).toBe('true')
190+
191+
container.trigger('click')
192+
expect(toggle.vm.isSelected).toBe(false)
193+
expect(wrapper.data().model).toBe('false')
201194
})
202195

203-
test('should toggle boolean model when switch do not have a value', async () => {
196+
test('should toggle string values on model', async () => {
204197
const template = `
205198
<div>
206-
<md-switch v-model="model"></md-switch>
199+
<md-switch v-model="model" value="1"></md-switch>
207200
</div>
208201
`
209202
const wrapper = await mountTemplate(MdSwitch, template, {
210203
data: {
211-
model: false
204+
model: '1'
212205
}
213206
})
214207
const toggle = wrapper.find(MdSwitch)[0]
215208
const container = wrapper.find('.md-switch-container')[0]
216209

217-
await toggle.vm.$nextTick()
210+
expect(toggle.vm.isSelected).toBe(true)
218211

212+
container.trigger('click')
219213
expect(toggle.vm.isSelected).toBe(false)
214+
expect(wrapper.data().model).toBe(null)
220215

221216
container.trigger('click')
222217
expect(toggle.vm.isSelected).toBe(true)
223-
expect(wrapper.data().model).toBe(true)
224-
225-
container.trigger('click')
226-
expect(toggle.vm.isSelected).toBe(false)
227-
expect(wrapper.data().model).toBe(false)
218+
expect(wrapper.data().model).toBe('1')
228219
})
229220

230-
test('should toggle boolean model when switch have true value', async () => {
221+
test('should toggle boolean model when switch do not have a value', async () => {
231222
const template = `
232223
<div>
233-
<md-switch v-model="model" :value="true"></md-switch>
224+
<md-switch v-model="model"></md-switch>
234225
</div>
235226
`
236227
const wrapper = await mountTemplate(MdSwitch, template, {
@@ -254,10 +245,10 @@ test('should toggle boolean model when switch have true value', async () => {
254245
expect(wrapper.data().model).toBe(false)
255246
})
256247

257-
test('should toggle boolean model when switch have false value', async () => {
248+
test('should toggle null / value while checkbox has been set value', async () => {
258249
const template = `
259250
<div>
260-
<md-switch v-model="model" :value="false"></md-switch>
251+
<md-switch v-model="model" value="val"></md-switch>
261252
</div>
262253
`
263254
const wrapper = await mountTemplate(MdSwitch, template, {
@@ -270,13 +261,13 @@ test('should toggle boolean model when switch have false value', async () => {
270261

271262
await toggle.vm.$nextTick()
272263

273-
expect(toggle.vm.isSelected).toBe(true)
274-
275-
container.trigger('click')
276264
expect(toggle.vm.isSelected).toBe(false)
277-
expect(wrapper.data().model).toBe(true)
278265

279266
container.trigger('click')
280267
expect(toggle.vm.isSelected).toBe(true)
281-
expect(wrapper.data().model).toBe(false)
268+
expect(wrapper.data().model).toBe('val')
269+
270+
container.trigger('click')
271+
expect(toggle.vm.isSelected).toBe(false)
272+
expect(wrapper.data().model).toBe(null)
282273
})

‎src/components/MdSwitch/MdSwitch.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<div class="md-switch-container" @click.stop="toggleCheck">
44
<div class="md-switch-thumb">
55
<md-ripple md-centered :md-active.sync="rippleActive" :md-disabled="disabled">
6-
<input type="checkbox" v-bind="{ id, name, disabled, required, value }">
6+
<input :id="id" type="checkbox" v-bind="{ id, name, disabled, required, value }">
77
</md-ripple>
88
</div>
99
</div>

‎src/components/MdTable/MdTable.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
<slot name="md-table-pagination" />
4848
</md-content>
4949

50-
<slot v-if="!hasValue" />
50+
<slot v-if="!hasValue && $scopedSlots['md-table-row']" />
5151
</md-tag-switcher>
5252
</template>
5353

‎test/utils/mountStringSlot.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import Vue from 'vue'
22
import deepmerge from 'deepmerge'
33
import { mount } from 'avoriaz'
44

5-
export default async (component, template, options = {}) => {
5+
export default async (component, template, options = { propsData: {} }) => {
66
const wrapper = mount(component, deepmerge(options, {
77
slots: {
88
default: [template]

0 commit comments

Comments
 (0)