template.spec.js 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  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. })