OLD | NEW |
1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2014, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 import 'dart:async'; | 5 import 'dart:async'; |
6 import 'dart:html'; | 6 import 'dart:html'; |
7 import 'package:unittest/unittest.dart'; | 7 import 'package:unittest/unittest.dart'; |
8 import 'package:unittest/html_config.dart'; | 8 import 'package:unittest/html_config.dart'; |
9 import 'package:polymer/polymer.dart'; | 9 import 'package:polymer/polymer.dart'; |
10 | 10 |
11 class XFoo extends PolymerElement { | 11 class XFoo extends PolymerElement { |
12 XFoo.created() : super.created(); | 12 XFoo.created() : super.created(); |
13 | 13 |
14 @published var foo = ''; | 14 @PublishedProperty(reflect: true) var foo = ''; |
15 @published String baz = ''; | 15 @PublishedProperty(reflect: true) String baz = ''; |
| 16 |
| 17 @PublishedProperty(reflect: true) var def1, def2; |
16 } | 18 } |
17 | 19 |
18 class XBar extends XFoo { | 20 class XBar extends XFoo { |
19 XBar.created() : super.created(); | 21 XBar.created() : super.created(); |
20 | 22 |
21 @published int zot = 3; | 23 @PublishedProperty(reflect: true) int zot = 3; |
22 @published bool zim = false; | 24 @PublishedProperty(reflect: true) bool zim = false; |
23 @published String str = 'str'; | 25 @PublishedProperty(reflect: true) String str = 'str'; |
24 @published Object obj; | 26 @PublishedProperty(reflect: true) Object obj; |
| 27 } |
| 28 |
| 29 class XZot extends XBar { |
| 30 // Dart note: trying to make this roughly equivalent to the JS |
| 31 @PublishedProperty(reflect: false) int get zot => super.zot; |
| 32 @PublishedProperty(reflect: false) set zot(int x) { super.zot = x; } |
| 33 |
| 34 XZot.created() : super.created() { |
| 35 zot = 2; |
| 36 str = 'str2'; |
| 37 } |
25 } | 38 } |
26 | 39 |
27 class XCompose extends PolymerElement { | 40 class XCompose extends PolymerElement { |
28 XCompose.created() : super.created(); | 41 XCompose.created() : super.created(); |
29 | 42 |
30 @published bool zim = false; | 43 @observable bool zim = false; |
31 } | 44 } |
32 | 45 |
33 Future onAttributeChange(Element node) { | 46 Future onAttributeChange(Element node) { |
34 var completer = new Completer(); | 47 var completer = new Completer(); |
35 new MutationObserver((records, observer) { | 48 new MutationObserver((records, observer) { |
36 observer.disconnect(); | 49 observer.disconnect(); |
37 completer.complete(); | 50 completer.complete(); |
38 })..observe(node, attributes: true); | 51 })..observe(node, attributes: true); |
39 scheduleMicrotask(Observable.dirtyCheck); | 52 scheduleMicrotask(Observable.dirtyCheck); |
40 return completer.future; | 53 return completer.future; |
41 } | 54 } |
42 | 55 |
43 main() => initPolymer().run(() { | 56 main() => initPolymer().run(() { |
44 useHtmlConfiguration(); | 57 useHtmlConfiguration(); |
45 | 58 |
46 setUp(() => Polymer.onReady); | 59 setUp(() => Polymer.onReady); |
47 | 60 |
48 // Most tests use @CustomTag, here we test out the impertive register: | 61 // Most tests use @CustomTag, here we test out the impertive register: |
49 Polymer.register('x-foo', XFoo); | 62 Polymer.register('x-foo', XFoo); |
50 Polymer.register('x-bar', XBar); | 63 Polymer.register('x-bar', XBar); |
| 64 Polymer.register('x-zot', XZot); |
51 Polymer.register('x-compose', XCompose); | 65 Polymer.register('x-compose', XCompose); |
52 | 66 |
53 test('property attribute reflection', () { | 67 test('property to attribute reflection', () { |
54 var xcompose = querySelector('x-compose'); | 68 var xcompose = querySelector('x-compose'); |
55 var xfoo = querySelector('x-foo'); | 69 var xfoo = querySelector('x-foo'); |
56 var xbar = querySelector('x-bar'); | 70 var xbar = querySelector('x-bar'); |
| 71 var xzot = querySelector('x-zot'); |
57 xfoo.foo = 5; | 72 xfoo.foo = 5; |
| 73 xfoo.attributes['def1'] = '15'; |
| 74 xfoo.def2 = 15; |
| 75 |
| 76 // Dart note: our test here is more async than JS until we change |
| 77 // Polymer.dart bindings to work like observe.js "bindToInstance". |
58 return onAttributeChange(xfoo).then((_) { | 78 return onAttributeChange(xfoo).then((_) { |
59 expect(xcompose.$['bar'].attributes.containsKey('zim'), false, | 79 expect(xcompose.$['bar'].attributes.containsKey('zim'), false, |
60 reason: 'attribute bound to property updates when binding is made'); | 80 reason: 'attribute bound to property updates when binding is made'); |
61 | 81 |
| 82 expect(xfoo.attributes['def2'], '15', |
| 83 reason: 'default valued published property reflects to attr'); |
| 84 |
| 85 expect(xfoo.def1, 15, |
| 86 reason: 'attr updates default valued published property'); |
| 87 |
62 expect('${xfoo.foo}', xfoo.attributes['foo'], | 88 expect('${xfoo.foo}', xfoo.attributes['foo'], |
63 reason: 'attribute reflects property as string'); | 89 reason: 'attribute reflects property as string'); |
64 xfoo.attributes['foo'] = '27'; | 90 xfoo.attributes['foo'] = '27'; |
65 // TODO(jmesserly): why is JS leaving this as a String? From the code it | 91 // TODO(jmesserly): why is JS leaving this as a String? From the code it |
66 // looks like it should use the type of 5 and parse it as a number. | 92 // looks like it should use the type of 5 and parse it as a number. |
67 expect('${xfoo.foo}', xfoo.attributes['foo'], | 93 expect('${xfoo.foo}', xfoo.attributes['foo'], |
68 reason: 'property reflects attribute'); | 94 reason: 'property reflects attribute'); |
69 // | 95 // |
70 xfoo.baz = 'Hello'; | 96 xfoo.baz = 'Hello'; |
71 }).then((_) => onAttributeChange(xfoo)).then((_) { | 97 }).then((_) => onAttributeChange(xfoo)).then((_) { |
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
106 reason: 'property reflects attribute as object'); | 132 reason: 'property reflects attribute as object'); |
107 xbar.zim = false; | 133 xbar.zim = false; |
108 }).then((_) => onAttributeChange(xbar)).then((_) { | 134 }).then((_) => onAttributeChange(xbar)).then((_) { |
109 expect(xbar.attributes.containsKey('zim'), false, reason: | 135 expect(xbar.attributes.containsKey('zim'), false, reason: |
110 'attribute reflects false valued boolean property as NOT ' | 136 'attribute reflects false valued boolean property as NOT ' |
111 'having attribute'); | 137 'having attribute'); |
112 xbar.obj = 'hi'; | 138 xbar.obj = 'hi'; |
113 }).then((_) => onAttributeChange(xbar)).then((_) { | 139 }).then((_) => onAttributeChange(xbar)).then((_) { |
114 expect(xbar.attributes['obj'], 'hi', reason: | 140 expect(xbar.attributes['obj'], 'hi', reason: |
115 'reflect property based on current type'); | 141 'reflect property based on current type'); |
| 142 |
| 143 expect(xzot.str, 'str2'); |
| 144 expect(xzot.zot, 2); |
| 145 xzot.str = 'hello'; |
| 146 xzot.zot = 5; |
| 147 }).then((_) => onAttributeChange(xzot)).then((_) { |
| 148 expect(xzot.attributes['str'], xzot.str); |
| 149 // TODO(jmesserly): the JS test seems backwards of the description text. |
| 150 // Is it because it doesn't do "Platform.flush()"? |
| 151 expect(xzot.attributes['zot'], '5', |
| 152 reason: 'extendee reflect false not honored'); |
116 }); | 153 }); |
117 }); | 154 }); |
118 }); | 155 }); |
OLD | NEW |