2
0

template.spec.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. import Vue from 'vue'
  2. describe('Options template', () => {
  3. let el
  4. beforeEach(() => {
  5. el = document.createElement('script')
  6. el.type = 'x-template'
  7. el.id = 'app'
  8. el.innerHTML = '<p>{{message}}</p>'
  9. document.body.appendChild(el)
  10. })
  11. afterEach(() => {
  12. document.body.removeChild(el)
  13. })
  14. it('basic usage', () => {
  15. const vm = new Vue({
  16. template: '<div>{{message}}</div>',
  17. data: { message: 'hello world' }
  18. }).$mount()
  19. expect(vm.$el.tagName).toBe('DIV')
  20. expect(vm.$el.textContent).toBe(vm.message)
  21. })
  22. it('id reference', () => {
  23. const vm = new Vue({
  24. template: '#app',
  25. data: { message: 'hello world' }
  26. }).$mount()
  27. expect(vm.$el.tagName).toBe('P')
  28. expect(vm.$el.textContent).toBe(vm.message)
  29. })
  30. it('DOM element', () => {
  31. const elm = document.createElement('p')
  32. elm.innerHTML = '<p>{{message}}</p>'
  33. const vm = new Vue({
  34. template: elm,
  35. data: { message: 'hello world' }
  36. }).$mount()
  37. expect(vm.$el.tagName).toBe('P')
  38. expect(vm.$el.textContent).toBe(vm.message)
  39. })
  40. it('invalid template', () => {
  41. new Vue({
  42. template: Vue,
  43. data: { message: 'hello world' }
  44. }).$mount()
  45. expect('invalid template option').toHaveBeenWarned()
  46. })
  47. it('warn error in generated function', () => {
  48. new Vue({
  49. template: '<div v-if="!@"><span>{{ a"" }}</span><span>{{ do + 1 }}</span></div>'
  50. }).$mount()
  51. expect('Error compiling template').toHaveBeenWarned()
  52. expect('invalid expression: v-if="!@"').toHaveBeenWarned()
  53. expect('invalid expression: {{ a"" }}').toHaveBeenWarned()
  54. expect('avoid using JavaScript keyword as property name: "do" in expression {{ do + 1 }}').toHaveBeenWarned()
  55. })
  56. it('warn error in generated function (v-for)', () => {
  57. new Vue({
  58. template: '<div><div v-for="(1, 2) in a----"></div></div>'
  59. }).$mount()
  60. expect('Error compiling template').toHaveBeenWarned()
  61. expect('invalid v-for alias "1"').toHaveBeenWarned()
  62. expect('invalid v-for iterator "2"').toHaveBeenWarned()
  63. expect('invalid expression: v-for="(1, 2) in a----"').toHaveBeenWarned()
  64. })
  65. })