bower_components/iron-list/test/basic.html

<!doctype html>
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
The complete set of authors may be found at http://polymer.github.io/AUTHORS
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
-->
<html>
<head>
  <meta charset="UTF-8">
  <title>iron-list test</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
  <script src="../../web-component-tester/browser.js"></script>
  <link rel="import" href="helpers.html">
  <link rel="import" href="x-list.html">
</head>
<body>
  <test-fixture id="trivialList">
    <template>
      <x-list></x-list>
    </template>
  </test-fixture>
<script>
  suite('basic features', function() {
    var list, container;
    setup(function() {
      container = fixture('trivialList');
      list = container.list;
    });
    test('defaults', function() {
      assert.equal(list.items, null, 'items');
      assert.equal(list.as, 'item', 'as');
      assert.equal(list.indexAs, 'index', 'indexAs');
      assert.equal(list.selectedAs, 'selected', 'selectedAs');
      assert.equal(list.scrollTarget, list, 'scrollTarget');
      assert.isFalse(list.selectionEnabled, 'selectionEnabled');
      assert.isFalse(list.multiSelection, 'multiSelection');
    });
    test('check items length', function(done) {
      container.data = buildDataSet(100);
      flush(function() {
        assert.equal(list.items.length, container.data.length);
        done();
      });
    });
    test('check physical item heights', function(done) {
      container.data = buildDataSet(100);
      flush(function() {
        var rowHeight = list._physicalItems[0].offsetHeight;
        list._physicalItems.forEach(function(item) {
          assert.equal(item.offsetHeight, rowHeight);
        });
        done();
      });
    });
    test('check physical item size', function(done) {
      var setSize = 10;
      container.data = buildDataSet(setSize);
      flush(function() {
        assert.equal(list.items.length, setSize);
        done();
      });
    });
    test('first visible index', function(done) {
      container.data = buildDataSet(100);
      flush(function() {
        var setSize = list.items.length;
        var rowHeight = container.itemHeight;
        var viewportHeight = list.offsetHeight;
        var scrollToItem;
        function checkFirstVisible() {
          assert.equal(list.firstVisibleIndex, scrollToItem);
          assert.equal(getFirstItemFromList(list).textContent, scrollToItem);
        }
        function checkLastVisible() {
          var visibleItemsCount = Math.floor(viewportHeight / rowHeight);
          assert.equal(list.lastVisibleIndex, scrollToItem + visibleItemsCount - 1);
          assert.equal(getLastItemFromList(list).textContent, scrollToItem + visibleItemsCount - 1);
        }
        function doneScrollDown() {
          checkFirstVisible();
          checkLastVisible();
          scrollToItem = 1;
          flush(function() {
            simulateScroll({
              list: list,
              contribution: rowHeight,
              target: scrollToItem*rowHeight,
              onScrollEnd: doneScrollUp
            });
          });
        }
        function doneScrollUp() {
          checkFirstVisible();
          checkLastVisible();
          done();
        }
        scrollToItem = 50;
        simulateScroll({
          list: list,
          contribution: 50,
          target: scrollToItem*rowHeight,
          onScrollEnd: doneScrollDown
        });
      });
    });
    test('scroll to index', function(done) {
      list.items = buildDataSet(100);
      setTimeout(function() {
        list.scrollToIndex(30);
        assert.equal(list.firstVisibleIndex, 30);
        list.scrollToIndex(0);
        assert.equal(list.firstVisibleIndex, 0);
        var rowHeight = getFirstItemFromList(list).offsetHeight;
        var viewportHeight = list.offsetHeight;
        var itemsPerViewport = Math.floor(viewportHeight/rowHeight);
        list.scrollToIndex(99);
        assert.equal(list.firstVisibleIndex, list.items.length - itemsPerViewport);
        // make the height of the viewport same as the height of the row
        // and scroll to the last item
        list.style.height = list._physicalItems[0].offsetHeight + 'px';
        setTimeout(function() {
          list.scrollToIndex(99);
          assert.equal(list.firstVisibleIndex, 99);
          done();
        }, 100);
      }, 100);
    });
    test('reset items', function(done) {
      list.items = buildDataSet(100);
      flush(function() {
        assert.equal(getFirstItemFromList(list).textContent, '0');
        list.items = null;
        flush(function() {
          assert.notEqual(getFirstItemFromList(list).textContent, '0');
          list.items = buildDataSet(100);
          flush(function() {
            assert.equal(getFirstItemFromList(list).textContent, '0');
            done();
          });
        });
      });
    });
  });
</script>
</body>
</html>