9a000b97 by Michael Richards

Add set of functional/smoke tests to ensure that iteration binding works as expected.

1 parent 225578d0
...@@ -2,7 +2,7 @@ describe('Functional', function() { ...@@ -2,7 +2,7 @@ describe('Functional', function() {
2 var data, bindData, el, input; 2 var data, bindData, el, input;
3 3
4 beforeEach(function() { 4 beforeEach(function() {
5 data = new Data({foo: 'bar'}); 5 data = new Data({foo: 'bar', items: [{name: 'a'}, {name: 'b'}]});
6 bindData = {data: data}; 6 bindData = {data: data};
7 el = document.createElement('div'); 7 el = document.createElement('div');
8 input = document.createElement('input'); 8 input = document.createElement('input');
...@@ -100,6 +100,52 @@ describe('Functional', function() { ...@@ -100,6 +100,52 @@ describe('Functional', function() {
100 expect(input.value).toBe(data.get('foo')); 100 expect(input.value).toBe(data.get('foo'));
101 }); 101 });
102 }); 102 });
103
104 describe('Iteration', function() {
105 beforeEach(function(){
106 list = document.createElement('ul');
107 el.appendChild(list);
108 listItem = document.createElement('li');
109 listItem.setAttribute('data-each-item', 'data.items');
110 list.appendChild(listItem);
111 });
112
113 it('should loop over a collection and create new instances of that element + children', function() {
114 expect(el.getElementsByTagName('li').length).toBe(1);
115 rivets.bind(el, bindData);
116 expect(el.getElementsByTagName('li').length).toBe(2);
117 });
118
119 it('should re-loop over the collection and create new instances when the array changes', function() {
120 rivets.bind(el, bindData);
121 expect(el.getElementsByTagName('li').length).toBe(2);
122
123 newItems = [{name: 'a'}, {name: 'b'}, {name: 'c'}];
124 data.set({items: newItems});
125 expect(el.getElementsByTagName('li').length).toBe(3);
126 });
127
128 it('should allow binding to the iterated item as well as any parent contexts', function() {
129 span1 = document.createElement('span');
130 span1.setAttribute('data-text', 'item:name')
131 span2 = document.createElement('span');
132 span2.setAttribute('data-text', 'data.foo')
133 listItem.appendChild(span1);
134 listItem.appendChild(span2);
135
136 rivets.bind(el, bindData);
137 expect(el.getElementsByTagName('span')[0]).toHaveTheTextContent('a');
138 expect(el.getElementsByTagName('span')[1]).toHaveTheTextContent('bar');
139 });
140
141 it('should allow binding to the iterated element directly', function() {
142 listItem.setAttribute('data-text', 'item:name');
143 listItem.setAttribute('data-class', 'data.foo');
144 rivets.bind(el, bindData);
145 expect(el.getElementsByTagName('li')[0]).toHaveTheTextContent('a');
146 expect(el.getElementsByTagName('li')[0].className).toBe('bar');
147 });
148 });
103 }); 149 });
104 150
105 describe('Updates', function() { 151 describe('Updates', function() {
......