book
/
book_admin


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361
							<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="test.css">
  <title>Zepto Data unit tests</title>
  <script src="../vendor/evidence.js"></script>
  <script src="evidence_runner.js"></script>
  <script>
    // avoid caching
    (function(){
      function load(scripts){
        scripts.split(' ').forEach(function(script){
          document.write('<script src="../src/'+script+'.js?'+(+new Date)+'"></scr'+'ipt>')
        })
      }

      load('zepto data ie')
    })()
  </script>
</head>
<body>
  <h1>Zepto Data unit tests</h1>
  <p id="results">
    Running… see browser console for results
  </p>
  <div id="fixtures">
  <div id="data_attr"
    data-one="uno"
    data-two="due"
    data-foo-bar="baz"
    data-under_score="kuuq"
    ></div>
  <div id="data_full" data-mode="awesome"></div>
  <div id="data_obj" data-mode="awesome"></div>
  <ol id="data_list">
    <li data-category="arts"></li>
    <li data-category="science"></li>
  </ol>
  <ol id="data_list2">
    <li></li>
    <li></li>
  </ol>
  </div>

  <script>
    Evidence('ZeptoExtendedDataTest', {
      testEmptyCollection: function(t){
        var el = $('#does_not_exist')
        t.assertUndefined(el.data('one'))
      },

      testAttributeDoesNotExist: function(t){
        var el = $('#data_attr')
        t.assertUndefined(el.data('missing'))
      },

      testReadingAttribute: function(t){
        var el = $('#data_attr')
        t.assertEqual('uno', el.data('one'))
      },

      testCamelized: function(t){
        var el = $('#data_attr')
        t.assertEqual('baz', el.data('foo-bar'))
        t.assertEqual('baz', el.data('fooBar'))

        el.data('fooBar', 'bam')
        t.assertEqual('bam', el.data('foo-bar'))
        t.assertEqual('bam', el.data('fooBar'))

        el.data('a-b', 'c')
        t.assertEqual('c', el.data().aB)
        t.assertUndefined(el.data()['a-b'])
      },

      testUnderscore: function(t){
        var el = $('#data_attr')
        t.assertEqual('kuuq', el.data('under_score'))
        t.assertUndefined(el.data('under-score'))
        t.assertUndefined(el.data('underScore'))
      },

      testNotChangingAttribute: function(t){
        var el = $('#data_attr')
        t.assertEqual('due', el.data('two'))
        el.data('two', 'changed')
        t.assertEqual('due', el.attr('data-two'))
      },

      testExtendedData: function(t){
        var els = $('#data_attr'),
          els2 = $('#data_attr'),
          obj  = { a: 'A', b: 'B' }

        els.data('obj', obj)
        t.assertIdentical(obj, els.data('obj'))
        t.assertIdentical(obj, els2.data('obj'))

        els2.data('els', els)
        t.assertIdentical(els, els.data('els'))
      },

      testMultipleElements: function(t){
        var items = $('#data_list li')

        items.data('each', 'mark')

        var values = items.map(function(){ return $(this).data('each') }).get()
        t.assertEqual('mark, mark', values.join(', '))
      },

      testFunctionArg: function(t){
        var els = $('#data_attr')

        var data = "hello"

        els.data("addio", function () {
          data = "goodbye"
        })

        t.assertEqual('hello', data)

        els.data("addio")()

        t.assertEqual('goodbye', data)
      },

      testAllData: function(t){
        var el = $('#data_full')

        el.data().samurai = 7
        el.data('one', 'ichi').data('two', 'ni')
        el.data('person', {name: 'Kurosawa'})

        var all = el.data()
        t.assertEqual(7, all.samurai)
        t.assertEqual('ichi', all.one)
        t.assertEqual('ni', all.two)
        t.assertEqual('Kurosawa', all.person.name)
      },

      testInitialDataFromAttributes: function(t){
        var el = $('<div data-foo=bar data-foo-bar=baz data-empty data-num=42 />'),
            store = el.data()

        t.assertEqual('bar', store.foo)
        t.assertEqual('baz', store.fooBar)
        t.assertUndefined(store['foo-bar'])
        t.assertIdentical('', store.empty)
        t.assertIdentical(42, store.num)
      },

      testGettingBlanks: function(t){
        var el = $('#data_attr'),
            store = el.data()

        store.nil = null
        store.undef = undefined
        store.blank = ''
        store.bool = false

        t.assertNull(el.data('nil'))
        t.assertUndefined(el.data('undef'))
        t.assertIdentical('', el.data('blank'))
        t.assertFalse(el.data('bool'))
      },

      testRemoveData: function(t){
        var el = $('<div data-foo=bar />')

        el.data('foo', 'bam').data('bar', 'baz')
        el.removeData('foo').removeData('bar')
        t.assertEqual('bar', el.data('foo'))
        t.assertUndefined(el.data('bar'))

        el.data('uno', 'one').data('due', 'two')
        el.removeData('uno due')
        t.assertUndefined(el.data('uno'))
        t.assertUndefined(el.data('due'))

        el.data('one', 1).data('twoThree', 23)
        el.removeData(['one', 'two-three'])
        t.assertUndefined(el.data('one'))
        t.assertUndefined(el.data('twoThree'))
      },

      testRemoveAllData: function(t){
        var el = $('<div data-attr-test=val />')

        el.data('one', { foo: 'bar' })
        el.data('two', 'two').data('three', 3)
        el.removeData()

        t.assertEqual('val', el.data('attrTest'))
        t.assertUndefined(el.data('one'))
        t.assertUndefined(el.data('two'))
        t.assertUndefined(el.data('three'))
      },

      testRemoveDataNoop: function(t){
        var empty = $(),
            vanilla = $('<div />')

        t.assertIdentical(empty, empty.removeData('foo'))
        t.assertIdentical(vanilla, vanilla.removeData('foo'))
      },

      testRemoveDataOnElementRemoval: function(t){
        var el = $('<div data-attr-test=val />'),
          childEl = $('<span />').appendTo(el),
          elData = { foo: 'bar' }

        el.data('test', elData)
        childEl.data('test', 1)

        el.remove()
        t.assertEqual('val', el.data('attrTest'))
        t.assertUndefined(el.data('test'))
        t.assertUndefined(childEl.data('test'))
      },

      testRemoveDataOnElementEmpty: function(t){
        var el = $('<div data-attr-test=val />'),
          childEl = $('<span />').appendTo(el),
          elData = { foo: 'bar' }

        el.data('test', elData)
        childEl.data('test', 1)

        el.empty()
        t.assertEqual('val', el.data('attrTest'))
        t.assertEqual(elData, el.data('test'))
        t.assertUndefined(childEl.data('test'))
      },

      testRemoveDataOnElementReplacement: function(t){
        var el = $('<div data-attr-test=val />'),
          childEl = $('<span />').appendTo(el),
          elData = { foo: 'bar' }

        el.data('test', elData)
        childEl.data('test', 1)

        el.replaceWith('<div />')
        t.assertEqual('val', el.data('attrTest'))
        t.assertUndefined(el.data('test'))
        t.assertUndefined(childEl.data('test'))
      },

      testRemoveDataOnElementReplacementHtml: function(t){
        var el = $('<div data-attr-test=val />'),
          childEl = $('<span />').appendTo(el),
          wrapper = $('<div />'),
          elData = { foo: 'bar' }

        el.wrap(wrapper).data('test', elData)
        childEl.data('test', 1)

        wrapper.html('<b>New content</b>')
        t.assertEqual('val', el.data('attrTest'))
        t.assertUndefined(el.data('test'))
        t.assertUndefined(childEl.data('test'))
      },

      testKeepDataOnElementDetach: function(t){
        var el = $('<div data-attr-test=val />'),
          childEl = $('<span />').appendTo(el),
          elData = { foo: 'bar' }

        el.data('test', elData)
        childEl.data('test', 1)

        el.detach()
        t.assertEqual('val', el.data('attrTest'))
        t.assertEqual(elData, el.data('test'))
        t.assertEqual(1, childEl.data('test'))
      },

      testSettingDataWithObj: function(t){
          var el = $('#data_obj')

          el.data({
              'foo': 'bar',
              'answer': 42,
              'color': 'blue'
          })

          var all = el.data()

          t.assertEqual(all.answer, 42)
          t.assertEqual(all.color, 'blue')
          t.assertEqual(all.foo, 'bar')

          el.data('foo', 'baz')

          t.assertEqual(all.foo, 'baz')
          t.assertEqual(all.answer, 42)
      },

      testSettingDataWithObjOnManyElements: function(t){
          var items = $('#data_list2 li')

          items.data({
              'foo': 'bar',
              'answer': 42,
              'color': 'purple'
          })

          var values = items.map(function(){ return $(this).data('foo') }).get()
          t.assertEqual('bar, bar', values.join(', '))

          var values2 = items.map(function(){ return $(this).data('answer') }).get()
          t.assertEqual('42, 42', values2.join(', '))
      },

      testSettingDataOnObjectWithoutAttributes: function(t) {
        var el = $(window)

        t.assertUndefined(el.data('foo'))
        el.data('foo', 'bar')
        t.assertEqual(el.data('foo'), 'bar')

        delete window[$.expando]
      },

      testDollarData: function(t) {
        var el = $('<div>')
        el.data('hello', 'world')
        t.assertEqual($.data(el, 'hello'), 'world')
        t.assertEqual($.data(el[0], 'hello'), 'world')

        $.data(el[0], 'hello', 'again')
        t.assertEqual($.data(el, 'hello'), 'again')
        t.assertEqual($.data(el[0], 'hello'), 'again')
      },

      testDollarHasData: function(t) {
        var el = $('<div>')
        t.assertFalse($.hasData(el[0]))

        el.data('hello', 'world')
        t.assertTrue($.hasData(el[0]))

        el.removeData()
        t.assertFalse($.hasData(el[0]))

        var error
        try {
          $.hasData()
        } catch (e) {
          error = e
        }
        t.assert(error)
      }

    })
  </script>
</body>
</html>