Merge branch 'specs'
Showing
4 changed files
with
185 additions
and
2 deletions
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | "http://www.w3.org/TR/html4/loose.dtd"> | 2 | "http://www.w3.org/TR/html4/loose.dtd"> |
3 | <html> | 3 | <html> |
4 | <head> | 4 | <head> |
5 | <title>Rivets test suite</title> | 5 | <title>Rivets.js test suite</title> |
6 | 6 | ||
7 | <link rel="stylesheet" type="text/css" href="lib/jasmine.css"> | 7 | <link rel="stylesheet" type="text/css" href="lib/jasmine.css"> |
8 | 8 | ||
... | @@ -13,7 +13,9 @@ | ... | @@ -13,7 +13,9 @@ |
13 | 13 | ||
14 | <script type="text/javascript" src="matchers.js"></script> | 14 | <script type="text/javascript" src="matchers.js"></script> |
15 | <script type="text/javascript" src="mock.data.js"></script> | 15 | <script type="text/javascript" src="mock.data.js"></script> |
16 | <script type="text/javascript" src="rivets.js"></script> | 16 | <script type="text/javascript" src="rivets/binding.js"></script> |
17 | <script type="text/javascript" src="rivets/routines.js"></script> | ||
18 | <script type="text/javascript" src="rivets/functional.js"></script> | ||
17 | 19 | ||
18 | <script type="text/javascript"> | 20 | <script type="text/javascript"> |
19 | (function() { | 21 | (function() { | ... | ... |
spec/rivets/binding.js
0 → 100644
1 | describe('Rivets.Binding', function() { | ||
2 | var model, el, view, binding; | ||
3 | |||
4 | beforeEach(function() { | ||
5 | rivets.configure({ | ||
6 | adapter: { | ||
7 | subscribe: function() {}, | ||
8 | unsubscribe: function() {}, | ||
9 | read: function() {}, | ||
10 | publish: function() {} | ||
11 | } | ||
12 | }); | ||
13 | |||
14 | el = document.createElement('div'); | ||
15 | el.setAttribute('data-text', 'obj.name'); | ||
16 | view = rivets.bind(el, {obj: {}}); | ||
17 | binding = view.bindings[0]; | ||
18 | }); | ||
19 | |||
20 | it('gets assigned the routine function matching the identifier', function() { | ||
21 | expect(binding.routine).toBe(rivets.routines.text); | ||
22 | }); | ||
23 | |||
24 | describe('set()', function() { | ||
25 | it('performs the binding routine with the supplied value', function() { | ||
26 | spyOn(binding, 'routine'); | ||
27 | binding.set('sweater'); | ||
28 | expect(binding.routine).toHaveBeenCalledWith(el, 'sweater'); | ||
29 | }); | ||
30 | |||
31 | it('applies any formatters to the value before performing the routine', function() { | ||
32 | rivets.config.formatters = { | ||
33 | awesome: function(value) { return 'awesome ' + value } | ||
34 | }; | ||
35 | binding.formatters.push('awesome'); | ||
36 | spyOn(binding, 'routine'); | ||
37 | binding.set('sweater'); | ||
38 | expect(binding.routine).toHaveBeenCalledWith(el, 'awesome sweater'); | ||
39 | }); | ||
40 | |||
41 | describe('on an event binding', function() { | ||
42 | beforeEach(function() { | ||
43 | binding.bindType = 'event'; | ||
44 | }); | ||
45 | |||
46 | it('performs the binding routine with the supplied function and current listener', function() { | ||
47 | spyOn(binding, 'routine'); | ||
48 | func = function() { return 1 + 2; } | ||
49 | binding.set(func); | ||
50 | expect(binding.routine).toHaveBeenCalledWith(el, func, undefined); | ||
51 | }); | ||
52 | |||
53 | it('passes the previously set funcation as the current listener on subsequent calls', function() { | ||
54 | spyOn(binding, 'routine'); | ||
55 | funca = function() { return 1 + 2; }; | ||
56 | funcb = function() { return 2 + 5; }; | ||
57 | |||
58 | binding.set(funca); | ||
59 | expect(binding.routine).toHaveBeenCalledWith(el, funca, undefined); | ||
60 | |||
61 | binding.set(funcb); | ||
62 | expect(binding.routine).toHaveBeenCalledWith(el, funcb, funca); | ||
63 | }); | ||
64 | }); | ||
65 | }); | ||
66 | }); |
spec/rivets/functional.js
0 → 100644
1 | describe('Functional', function() { | ||
2 | var data, bindData, el, input; | ||
3 | |||
4 | beforeEach(function() { | ||
5 | data = new Data({foo: 'bar'}); | ||
6 | bindData = {data: data}; | ||
7 | el = document.createElement('div'); | ||
8 | input = document.createElement('input'); | ||
9 | input.setAttribute('type', 'text'); | ||
10 | |||
11 | rivets.configure({ | ||
12 | preloadData: true, | ||
13 | adapter: { | ||
14 | subscribe: function(obj, keypath, callback) { | ||
15 | obj.on(keypath, callback); | ||
16 | }, | ||
17 | read: function(obj, keypath) { | ||
18 | return obj.get(keypath); | ||
19 | }, | ||
20 | publish: function(obj, keypath, value) { | ||
21 | attributes = {}; | ||
22 | attributes[keypath] = value; | ||
23 | obj.set(attributes); | ||
24 | } | ||
25 | } | ||
26 | }); | ||
27 | }); | ||
28 | |||
29 | describe('Adapter', function() { | ||
30 | it('should read the initial value', function() { | ||
31 | spyOn(data, 'get'); | ||
32 | el.setAttribute('data-text', 'data.foo'); | ||
33 | rivets.bind(el, bindData); | ||
34 | expect(data.get).toHaveBeenCalledWith('foo'); | ||
35 | }); | ||
36 | |||
37 | it('should read the initial value unless preloadData is false', function() { | ||
38 | rivets.configure({preloadData: false}); | ||
39 | spyOn(data, 'get'); | ||
40 | el.setAttribute('data-value', 'data.foo'); | ||
41 | rivets.bind(el, bindData); | ||
42 | expect(data.get).not.toHaveBeenCalled(); | ||
43 | }); | ||
44 | |||
45 | it('should subscribe to updates', function() { | ||
46 | spyOn(data, 'on'); | ||
47 | el.setAttribute('data-value', 'data.foo'); | ||
48 | rivets.bind(el, bindData); | ||
49 | expect(data.on).toHaveBeenCalled(); | ||
50 | }); | ||
51 | }); | ||
52 | |||
53 | describe('Binds', function() { | ||
54 | describe('Text', function() { | ||
55 | it('should set the text content of the element', function() { | ||
56 | el.setAttribute('data-text', 'data.foo'); | ||
57 | rivets.bind(el, bindData); | ||
58 | expect(el.textContent || el.innerText).toBe(data.get('foo')); | ||
59 | }); | ||
60 | |||
61 | it('should correctly handle HTML in the content', function() { | ||
62 | el.setAttribute('data-text', 'data.foo'); | ||
63 | value = '<b>Fail</b>'; | ||
64 | data.set({foo: value}); | ||
65 | rivets.bind(el, bindData); | ||
66 | expect(el.textContent || el.innerText).toBe(value); | ||
67 | }); | ||
68 | }); | ||
69 | |||
70 | describe('HTML', function() { | ||
71 | it('should set the html content of the element', function() { | ||
72 | el.setAttribute('data-html', 'data.foo'); | ||
73 | rivets.bind(el, bindData); | ||
74 | expect(el).toHaveTheTextContent(data.get('foo')); | ||
75 | }); | ||
76 | |||
77 | it('should correctly handle HTML in the content', function() { | ||
78 | el.setAttribute('data-html', 'data.foo'); | ||
79 | value = '<b>Fail</b>'; | ||
80 | data.set({foo: value}); | ||
81 | rivets.bind(el, bindData); | ||
82 | expect(el.innerHTML).toBe(value); | ||
83 | }); | ||
84 | }); | ||
85 | |||
86 | describe('Value', function() { | ||
87 | it('should set the value of the element', function() { | ||
88 | input.setAttribute('data-value', 'data.foo'); | ||
89 | rivets.bind(input, bindData); | ||
90 | expect(input.value).toBe(data.get('foo')); | ||
91 | }); | ||
92 | }); | ||
93 | }); | ||
94 | |||
95 | describe('Updates', function() { | ||
96 | it('should change the value', function() { | ||
97 | el.setAttribute('data-text', 'data.foo'); | ||
98 | rivets.bind(el, bindData); | ||
99 | data.set({foo: 'some new value'}); | ||
100 | expect(el).toHaveTheTextContent(data.get('foo')); | ||
101 | }); | ||
102 | }); | ||
103 | |||
104 | describe('Input', function() { | ||
105 | it('should update the model value', function() { | ||
106 | input.setAttribute('data-value', 'data.foo'); | ||
107 | rivets.bind(input, bindData); | ||
108 | input.value = 'some new value'; | ||
109 | var event = document.createEvent('HTMLEvents') | ||
110 | event.initEvent('change', true, true); | ||
111 | input.dispatchEvent(event); | ||
112 | expect(input.value).toBe(data.get('foo')); | ||
113 | }); | ||
114 | }); | ||
115 | }); |
This diff is collapsed.
Click to expand it.
-
Please register or sign in to post a comment