test/unit/Ext/XTemplate.js

   1 /*!
   2  * Ext JS Library 3.2.2
   3  * Copyright(c) 2006-2010 Ext JS, Inc.
   4  * licensing@extjs.com
   5  * http://www.extjs.com/license
   6  */
   7
   8 Ext.test.session.addTest( 'Ext', new Y.Test.Case({
   9
  10     name: 'XTemplate',
  11
  12     planned: 3,
  13
  14     // 3
  15     test_apply: function() {
  16         var data = {
  17             hello: 'Hello',
  18             world: 'World',
  19             items1: [
  20                 'test1',
  21                 'test2',
  22                 'test3'
  23             ],
  24             items2: [
  25                 { name: 'test1' },
  26                 { name: 'test2' },
  27                 { name: 'test3' }
  28             ],
  29             kids: [{
  30                 name: 'Sara Grace',
  31                 gender: 'f',
  32                 age:3
  33             },{
  34                 name: 'Zachary',
  35                 gender: 'm',
  36                 age:2
  37             },{
  38                 name: 'John James',
  39                 gender: 'm',
  40                 age:.5
  41             }]
  42         };
  43         var tpl1 = new Ext.XTemplate( '{hello} {world}. <tpl for="items1">{.}{[ xindex === xcount ? "" : ":" ]}</tpl>', { compiled: true });
  44         Y.Assert.areEqual( 'Hello World. test1:test2:test3', tpl1.apply( data ), 'Test apply with an object with an array' );
  45
  46         var tpl2 = new Ext.XTemplate( '<tpl for="items2">{name}{[ xindex === xcount ? "" : ":" ]}</tpl>', { compiled: true });
  47         Y.Assert.areEqual( 'test1:test2:test3', tpl2.apply( data ), 'Test apply with an object with an array of hashes' );
  48
  49         var tpl3 = new Ext.XTemplate(
  50             '<ul><tpl for="kids">',
  51                 '<tpl if="this.isGirl(gender)">',
  52                     '<li>Girl: {name} - {age}</li>',
  53                 '</tpl>',
  54                 '<tpl if="!this.isGirl(gender)">',
  55                     '<tpl if="age &lt; 1">',
  56                         '<li>Baby Boy: {name} - {age*12} months</li>',
  57                     '</tpl>',
  58                     '<tpl if="age &gt;= 1">',
  59                         '<li>Boy: {name} - {age}</li>',
  60                     '</tpl>',
  61                 '</tpl>',
  62             '</tpl></ul>',
  63             {
  64                 compiled: true,
  65                 disableFormats: true,
  66                 isGirl: function(gender){
  67                     return gender == 'f';
  68                 }
  69             }
  70         );
  71         Y.Assert.areEqual( '<ul><li>Girl: Sara Grace - 3</li><li>Boy: Zachary - 2</li><li>Baby Boy: John James - 6 months</li></ul>',
  72             tpl3.apply( data ), 'Test apply with template member functions, basic comparison operators, and math' );
  73     }
  74
  75     // apply is an alias for applyTemplate
  76
  77 }));