github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/libs/vue-1.0.24/test/unit/specs/parsers/template_spec.js (about)

     1  var templateParser = require('src/parsers/template')
     2  var parse = templateParser.parseTemplate
     3  var testString = '<div>hello</div><p class="test">world</p>'
     4  
     5  describe('Template Parser', function () {
     6    it('should return same if argument is already a fragment', function () {
     7      var frag = document.createDocumentFragment()
     8      var res = parse(frag)
     9      expect(res).toBe(frag)
    10    })
    11  
    12    it('should parse if argument is a template string', function () {
    13      var res = parse(testString)
    14      expect(res.nodeType).toBe(11)
    15      expect(res.childNodes.length).toBe(2)
    16      expect(res.querySelector('.test').textContent).toBe('world')
    17    })
    18  
    19    it('should work if the template string doesn\'t contain tags', function () {
    20      var res = parse('hello!')
    21      expect(res.nodeType).toBe(11)
    22      expect(res.childNodes.length).toBe(1)
    23      expect(res.firstChild.nodeType).toBe(3) // Text node
    24    })
    25  
    26    it('should handle string that contains html entities', function () {
    27      var res = parse('foo&lt;bar')
    28      expect(res.nodeType).toBe(11)
    29      expect(res.childNodes.length).toBe(1)
    30      expect(res.firstChild.nodeValue).toBe('foo<bar')
    31      // #1330
    32      res = parse('hello &#x2F; hello')
    33      expect(res.nodeType).toBe(11)
    34      expect(res.childNodes.length).toBe(1)
    35      expect(res.firstChild.nodeValue).toBe('hello / hello')
    36      // #2021
    37      res = parse('&#xe604;')
    38      expect(res.nodeType).toBe(11)
    39      expect(res.childNodes.length).toBe(1)
    40      expect(res.firstChild.nodeValue).toBe('')
    41    })
    42  
    43    it('should parse innerHTML if argument is a template node', function () {
    44      var templateNode = document.createElement('template')
    45      templateNode.innerHTML = testString
    46      var res = parse(templateNode)
    47      expect(res.nodeType).toBe(11)
    48      expect(res.childNodes.length).toBe(2)
    49      expect(res.querySelector('.test').textContent).toBe('world')
    50    })
    51  
    52    it('should parse textContent if argument is a script node', function () {
    53      var node = document.createElement('script')
    54      node.textContent = testString
    55      var res = parse(node)
    56      expect(res.nodeType).toBe(11)
    57      expect(res.childNodes.length).toBe(2)
    58      expect(res.querySelector('.test').textContent).toBe('world')
    59    })
    60  
    61    it('should parse innerHTML if argument is a normal node', function () {
    62      var node = document.createElement('div')
    63      node.innerHTML = testString
    64      var res = parse(node)
    65      expect(res.nodeType).toBe(11)
    66      expect(res.childNodes.length).toBe(2)
    67      expect(res.querySelector('.test').textContent).toBe('world')
    68    })
    69  
    70    it('should retrieve and parse if argument is an id selector', function () {
    71      var node = document.createElement('script')
    72      node.setAttribute('id', 'template-test')
    73      node.setAttribute('type', 'x/template')
    74      node.textContent = testString
    75      document.head.appendChild(node)
    76      var res = parse('#template-test')
    77      expect(res.nodeType).toBe(11)
    78      expect(res.childNodes.length).toBe(2)
    79      expect(res.querySelector('.test').textContent).toBe('world')
    80      document.head.removeChild(node)
    81    })
    82  
    83    it('should work for table elements', function () {
    84      var res = parse('<td>hello</td>')
    85      expect(res.nodeType).toBe(11)
    86      expect(res.childNodes.length).toBe(1)
    87      expect(res.firstChild.tagName).toBe('TD')
    88      expect(res.firstChild.textContent).toBe('hello')
    89    })
    90  
    91    it('should work for option elements', function () {
    92      var res = parse('<option>hello</option>')
    93      expect(res.nodeType).toBe(11)
    94      expect(res.childNodes.length).toBe(1)
    95      expect(res.firstChild.tagName).toBe('OPTION')
    96      expect(res.firstChild.textContent).toBe('hello')
    97    })
    98  
    99    it('should work for svg elements', function () {
   100      var res = parse('<circle></circle>')
   101      expect(res.nodeType).toBe(11)
   102      expect(res.childNodes.length).toBe(1)
   103      // SVG tagNames should be lowercase because they are XML nodes not HTML
   104      expect(res.firstChild.tagName).toBe('circle')
   105      expect(res.firstChild.namespaceURI).toBe('http://www.w3.org/2000/svg')
   106    })
   107  
   108    it('should cache template strings', function () {
   109      var res1 = parse(testString)
   110      var res2 = parse(testString)
   111      expect(res1).toBe(res2)
   112    })
   113  
   114    it('should clone', function () {
   115      var res1 = parse(testString, true)
   116      var res2 = parse(testString, true)
   117      expect(res1).not.toBe(res2)
   118    })
   119  
   120    it('should cache id selectors', function () {
   121      var node = document.createElement('script')
   122      node.setAttribute('id', 'template-test')
   123      node.setAttribute('type', 'x/template')
   124      node.textContent = '<div>never seen before content</div>'
   125      document.head.appendChild(node)
   126      var res1 = parse('#template-test')
   127      var res2 = parse('#template-test')
   128      expect(res1).toBe(res2)
   129      document.head.removeChild(node)
   130    })
   131  
   132    it('should be able to not use id selectors', function () {
   133      var res = parse('#hi', false, true)
   134      expect(res.nodeType).toBe(11)
   135      expect(res.firstChild.nodeValue).toBe('#hi')
   136    })
   137  
   138    it('should deal with Safari template clone bug', function () {
   139      var a = document.createElement('div')
   140      a.innerHTML = '<template>1</template>'
   141      var c = templateParser.cloneNode(a)
   142      expect(c.firstChild.innerHTML).toBe('1')
   143    })
   144  
   145    it('should deal with Safari template clone bug even when nested', function () {
   146      var a = document.createElement('div')
   147      a.innerHTML = '<template><div>1</div><template>2</template></template>'
   148      var c = templateParser.cloneNode(a)
   149      expect(c.firstChild.innerHTML).toBe('<div>1</div><template>2</template>')
   150    })
   151  
   152    it('should deal with IE textarea clone bug', function () {
   153      var t = document.createElement('textarea')
   154      t.placeholder = 't'
   155      var c = templateParser.cloneNode(t)
   156      expect(c.value).toBe('')
   157    })
   158  
   159    it('should trim empty text nodes and comments', function () {
   160      // string
   161      var res = parse('    <p>test</p>    ')
   162      expect(res.childNodes.length).toBe(1)
   163      expect(res.firstChild.tagName).toBe('P')
   164      // nodes
   165      var el = document.createElement('div')
   166      el.innerHTML = '<template>    <p>test</p>    </template>'
   167      res = parse(el.children[0])
   168      expect(res.childNodes.length).toBe(1)
   169      expect(res.firstChild.tagName).toBe('P')
   170      // comments
   171      res = parse('  <!-- yo -->  <p>test</p>  <!-- yo -->  ')
   172      expect(res.childNodes.length).toBe(1)
   173      expect(res.firstChild.tagName).toBe('P')
   174    })
   175  
   176    it('should reuse fragment from cache for the same string template', function () {
   177      var stringTemplate = '    <p>test</p>    '
   178      // When parsing a template, adds the created fragment to a cache
   179      var res = parse(stringTemplate)
   180  
   181      var newRes = parse(stringTemplate)
   182      expect(newRes).toBe(res)
   183    })
   184  })