Skip to content
This repository
Browse code

New pub release - changes to comply with new SDK.

  • Loading branch information...
commit b01ee11ffd1d63176f09043e42d0b834b292fa7d 1 parent 0b13152
sigmundch sigmundch authored
35 CHANGELOG.md
Source Rendered
@@ -4,7 +4,22 @@ This file contains highlights of what changes on each version of the web
4 4 components package. This file is normally updated whenever we push a new version
5 5 to pub.
6 6
7   -## Unreleased
  7 +## Pub version 0.2.8+3 (SDK 15595)
  8 +
  9 + * Upgrades for new trunk release (mainly breaking changes in dart:html)
  10 + * Bug fix:
  11 + * URI attributes are now checked for XSS: use SafeUri if validation is too
  12 + strict.
  13 +
  14 +## Pub version 0.2.8+2 (SDK 15355)
  15 +
  16 + * Bug fix: hosted and sdk dependencies errors due to changes in html5lib.
  17 +
  18 +## Pub version 0.2.8+1 (SDK 15355)
  19 +
  20 + * Accept, but ignore, the new editor flag '--machine' in build.dart
  21 +
  22 +## Pub version 0.2.8 (SDK 15355)
8 23
9 24 * Two-way binding changes:
10 25 * New syntax: `bind-attribute="dartAssignableValue"`, `data-bind` is
@@ -12,8 +27,24 @@ to pub.
12 27 * Support for radio buttons
13 28 * Support for valueAsDate and valueAsNumber
14 29 * Better detection of error conditions, like duplicate value attributes.
  30 +
  31 + * Binding in components:
  32 + * you can use `attribute="{{}}"` and `bind-attribute="x"` to initialize,
  33 + update, and bind fields of components (exposed as attributes in the HTML
  34 + tag).
  35 +
  36 + * Conditional templates:
  37 + * Added new experimental syntax `<template if="exp">`.
  38 +
15 39 * Bug fixes:
16 40 * Make dartium extension use the latest dart.js
  41 + * html fragments: fix issues with text nodes mixed with elements
  42 + * Internally data bindings watch the result of 'toString()', so types
  43 + implementing toString (like Maps or StringBuffer) can be used directly in
  44 + templates.
  45 + * Most generated identifiers are now hidden: all identifiers generated for
  46 + html elements in the template are hidden, except '_root'. Root will be
  47 + hidden in the future.
17 48
18 49 ## Pub version 0.2.7 - Nov 26 (SDK 15355)
19 50
@@ -48,4 +79,4 @@ to pub.
48 79 * Allow text bindings and fragments in conditions an iterations
49 80 * Support text nodes and fragments at the top level of components
50 81
51   -See git version tags for older changes.
  82 +See git version tags for older changes.
25 build/gen_html_setters.dart
@@ -40,10 +40,13 @@ The information is used to create "$OUTPUT_NAME".
40 40 }
41 41
42 42 var htmlPath = new Path('dart:html');
43   - var libPath = new Path(sdk);
  43 + var audioPath = new Path('dart:web_audio');
  44 + var svgPath = new Path('dart:svg');
  45 + var libPath = new Path(sdk).append('/');
44 46 var pkgPath = new Path(sdk).append('pkg/');
45 47
46   - var mirrors = new Compilation.library([htmlPath], libPath, pkgPath).mirrors;
  48 + var mirrors = new Compilation.library(
  49 + [htmlPath, audioPath, svgPath], libPath, pkgPath).mirrors;
47 50 var html = mirrors.libraries['html'];
48 51
49 52
@@ -56,20 +59,22 @@ The information is used to create "$OUTPUT_NAME".
56 59
57 60 var elemSet = new Set();
58 61 for (var name in htmlElementNames.values) {
59   - _addElement(html.classes[name], elemSet);
  62 + var qualifiedName = name.split('.');
  63 + var lib = mirrors.libraries[qualifiedName[0]];
  64 + _addElement(lib.classes[qualifiedName[1]], elemSet);
60 65 }
61 66 _addElement(html.classes['UnknownElement'], elemSet);
62 67
63 68 code.add('var htmlElementFields = const {\n');
64 69 var elements = new List.from(elemSet);
65   - elements.sort();
66   - for (var element in elements) {
67   - var cls = html.classes[element];
  70 + elements.sort((a, b) => a.displayName.compareTo(b.displayName));
  71 + for (var cls in elements) {
  72 + var element = cls.qualifiedName;
68 73 var setters = [];
69 74
70 75 if (cls.superclass != null
71 76 && cls.superclass.displayName.endsWith('Element')) {
72   - extendsCode.add(" '$element': '${cls.superclass.displayName}',\n");
  77 + extendsCode.add(" '$element': '${cls.superclass.qualifiedName}',\n");
73 78 }
74 79
75 80 // TODO(jmesserly): using "cls.setters" does not seem to work
@@ -108,11 +113,11 @@ The information is used to create "$OUTPUT_NAME".
108 113 /** Add an element class and its element super classes to [elemSet]. */
109 114 void _addElement(ClassMirror cls, Set elemSet) {
110 115 while (cls != null) {
111   - var name = cls.displayName;
112   - if (!name.endsWith('Element') || elemSet.contains(name)) {
  116 + if (!cls.isOriginalDeclaration) cls = cls.originalDeclaration;
  117 + if (!cls.displayName.endsWith('Element') || elemSet.contains(cls)) {
113 118 break;
114 119 }
115   - elemSet.add(name);
  120 + elemSet.add(cls);
116 121 cls = cls.superclass;
117 122 }
118 123 }
7 lib/src/codegen.dart
@@ -23,8 +23,11 @@ library $libraryName;
23 23 $imports
24 24 """;
25 25
  26 +// TODO(sigmund): include only those imports that are used by the code.
26 27 String get imports => """
27   -import 'dart:html' as autogenerated;
  28 +import 'dart:html' as autogenerated_html;
  29 +import 'dart:web_audio' as autogenerated_audio;
  30 +import 'dart:svg' as autogenerated_svg;
28 31 import 'package:web_components/web_components.dart' as autogenerated;
29 32 """;
30 33
@@ -80,7 +83,7 @@ $originalCode
80 83 // Additional generated code
81 84 /** Create the views and bind them to models. */
82 85 void init_autogenerated() {
83   - var _root = autogenerated.document.body;
  86 + var _root = autogenerated_html.document.body;
84 87 $topLevelFields
85 88
86 89 // Initialize fields.
24 lib/src/emitters.dart
@@ -132,7 +132,7 @@ class ElementFieldEmitter extends Emitter<ElementInfo> {
132 132 void emitDeclarations(Context context) {
133 133 if (!info.isRoot) {
134 134 var type = typeForHtmlTag(info.node.tagName);
135   - context.declarations.add('autogenerated.$type ${info.identifier};');
  135 + context.declarations.add('autogenerated_$type ${info.identifier};');
136 136 }
137 137 }
138 138
@@ -182,7 +182,7 @@ class ContentFieldEmitter extends Emitter<TextInfo> {
182 182
183 183 void emitCreated(Context context) {
184 184 context.createdMethod.add(
185   - "${info.identifier} = new autogenerated.Text('');");
  185 + "${info.identifier} = new autogenerated_html.Text('');");
186 186 }
187 187
188 188 void emitRemoved(Context context) {
@@ -206,7 +206,7 @@ class EventListenerEmitter extends Emitter<ElementInfo> {
206 206 var listenerName = '__listener${info.identifier}_${name}_';
207 207 event.listenerField = newName(context, listenerName);
208 208 context.declarations.add(
209   - 'autogenerated.EventListener ${event.listenerField};');
  209 + 'autogenerated_html.EventListener ${event.listenerField};');
210 210 }
211 211 });
212 212 }
@@ -481,7 +481,7 @@ class ConditionalEmitter extends DataBindingEmitter<TemplateInfo> {
481 481 var id = info.identifier;
482 482 var printer = context.declarations;
483 483 if (info.isTemplateElement) {
484   - printer.add('autogenerated.Node _endPosition$id;');
  484 + printer.add('autogenerated_html.Node _endPosition$id;');
485 485 }
486 486 printer.add('bool _isVisible$id = false;');
487 487 }
@@ -579,7 +579,7 @@ class ListEmitter extends DataBindingEmitter<TemplateInfo> {
579 579 var printer = context.declarations;
580 580 printer.add('List<Function> _removeChild$id = [];');
581 581 if (info.isTemplateElement) {
582   - printer.add('autogenerated.Node _endPosition$id;');
  582 + printer.add('autogenerated_html.Node _endPosition$id;');
583 583 }
584 584 }
585 585
@@ -764,7 +764,7 @@ class WebComponentEmitter extends RecursiveEmitter {
764 764 }
765 765
766 766 if (info.element.attributes['apply-author-styles'] != null) {
767   - _context.createdMethod.add('if (_root is autogenerated.ShadowRoot) '
  767 + _context.createdMethod.add('if (_root is autogenerated_html.ShadowRoot) '
768 768 '_root.applyAuthorStyles = true;');
769 769 // TODO(jmesserly): warn at runtime if apply-author-styles was not set,
770 770 // and we don't have Shadow DOM support? In that case, styles won't have
@@ -773,7 +773,7 @@ class WebComponentEmitter extends RecursiveEmitter {
773 773 if (info.template != null && !elemInfo.childrenCreatedInCode) {
774 774 // TODO(jmesserly): we need to emit code to run the <content> distribution
775 775 // algorithm for browsers without ShadowRoot support.
776   - _context.createdMethod.add("_root.innerHTML = '''")
  776 + _context.createdMethod.add("_root.innerHtml = '''")
777 777 .addRaw(escapeDartString(elemInfo.node.innerHTML, triple: true))
778 778 .addRaw("''';\n");
779 779 }
@@ -893,7 +893,7 @@ String _createChildExpression(NodeInfo info) {
893 893 */
894 894 String _emitCreateHtml(Node node) {
895 895 if (node is Text) {
896   - return "new autogenerated.Text('${escapeDartString(node.value)}')";
  896 + return "new autogenerated_html.Text('${escapeDartString(node.value)}')";
897 897 }
898 898
899 899 // Namespace constants from:
@@ -908,15 +908,15 @@ String _emitCreateHtml(Node node) {
908 908 if (isEmpty && elemName != null && isHtml) {
909 909 constructor = '$elemName()';
910 910 } else if (isEmpty && isHtml) {
911   - constructor = "Element.tag('${node.tagName}')";
  911 + constructor = "html.Element.tag('${node.tagName}')";
912 912 } else if (isEmpty && isSvg) {
913   - constructor = "SVGElement.tag('${node.tagName}')";
  913 + constructor = "svg.Element.tag('${node.tagName}')";
914 914 } else {
915 915 // TODO(sigmund): does this work for the mathml namespace?
916   - var target = isSvg ? 'SVGElement.svg' : 'Element.html';
  916 + var target = isSvg ? 'svg.Element.svg' : 'html.Element.html';
917 917 constructor = "$target('${escapeDartString(node.outerHTML)}')";
918 918 }
919   - return 'new autogenerated.$constructor';
  919 + return 'new autogenerated_$constructor';
920 920 }
921 921
922 922 /**
232 lib/src/html5_setters.g.dart
... ... @@ -1,7 +1,7 @@
1 1 // This file is autogenerated by build/gen_html_setters.sh. Do not edit.
2 2 library html5_setters;
3 3 var htmlElementFields = const {
4   - 'AnchorElement': const {
  4 + 'html.AnchorElement': const {
5 5 'charset': 'charset',
6 6 'coords': 'coords',
7 7 'download': 'download',
@@ -22,7 +22,7 @@ var htmlElementFields = const {
22 22 'target': 'target',
23 23 'type': 'type',
24 24 },
25   - 'AreaElement': const {
  25 + 'html.AreaElement': const {
26 26 'alt': 'alt',
27 27 'coords': 'coords',
28 28 'href': 'href',
@@ -31,21 +31,21 @@ var htmlElementFields = const {
31 31 'shape': 'shape',
32 32 'target': 'target',
33 33 },
34   - 'BRElement': const {
  34 + 'html.BRElement': const {
35 35 'clear': 'clear',
36 36 },
37   - 'BaseElement': const {
  37 + 'html.BaseElement': const {
38 38 'href': 'href',
39 39 'target': 'target',
40 40 },
41   - 'BodyElement': const {
  41 + 'html.BodyElement': const {
42 42 'alink': 'aLink',
43 43 'background': 'background',
44 44 'bgcolor': 'bgColor',
45 45 'link': 'link',
46 46 'vlink': 'vLink',
47 47 },
48   - 'ButtonElement': const {
  48 + 'html.ButtonElement': const {
49 49 'autofocus': 'autofocus',
50 50 'disabled': 'disabled',
51 51 'formaction': 'formAction',
@@ -57,24 +57,24 @@ var htmlElementFields = const {
57 57 'type': 'type',
58 58 'value': 'value',
59 59 },
60   - 'CanvasElement': const {
  60 + 'html.CanvasElement': const {
61 61 'height': 'height',
62 62 'width': 'width',
63 63 },
64   - 'DListElement': const {
  64 + 'html.DListElement': const {
65 65 'compact': 'compact',
66 66 },
67   - 'DetailsElement': const {
  67 + 'html.DetailsElement': const {
68 68 'open': 'open',
69 69 },
70   - 'Element': const {
  70 + 'html.Element': const {
71 71 'xtag': 'xtag',
72 72 'contenteditable': 'contentEditable',
73 73 'dir': 'dir',
74 74 'draggable': 'draggable',
75 75 'hidden': 'hidden',
76 76 'id': 'id',
77   - 'innerhtml': 'innerHTML',
  77 + 'innerhtml': 'innerHtml',
78 78 'lang': 'lang',
79 79 'spellcheck': 'spellcheck',
80 80 'tabindex': 'tabIndex',
@@ -84,7 +84,7 @@ var htmlElementFields = const {
84 84 'scrollleft': 'scrollLeft',
85 85 'scrolltop': 'scrollTop',
86 86 },
87   - 'EmbedElement': const {
  87 + 'html.EmbedElement': const {
88 88 'align': 'align',
89 89 'height': 'height',
90 90 'name': 'name',
@@ -92,11 +92,11 @@ var htmlElementFields = const {
92 92 'type': 'type',
93 93 'width': 'width',
94 94 },
95   - 'FieldSetElement': const {
  95 + 'html.FieldSetElement': const {
96 96 'disabled': 'disabled',
97 97 'name': 'name',
98 98 },
99   - 'FormElement': const {
  99 + 'html.FormElement': const {
100 100 'accept-charset': 'acceptCharset',
101 101 'action': 'action',
102 102 'autocomplete': 'autocomplete',
@@ -107,19 +107,19 @@ var htmlElementFields = const {
107 107 'novalidate': 'noValidate',
108 108 'target': 'target',
109 109 },
110   - 'HRElement': const {
  110 + 'html.HRElement': const {
111 111 'align': 'align',
112 112 'noshade': 'noShade',
113 113 'size': 'size',
114 114 'width': 'width',
115 115 },
116   - 'HeadElement': const {
  116 + 'html.HeadElement': const {
117 117 'profile': 'profile',
118 118 },
119   - 'HeadingElement': const {
  119 + 'html.HeadingElement': const {
120 120 'align': 'align',
121 121 },
122   - 'IFrameElement': const {
  122 + 'html.IFrameElement': const {
123 123 'align': 'align',
124 124 'frameborder': 'frameBorder',
125 125 'height': 'height',
@@ -133,7 +133,7 @@ var htmlElementFields = const {
133 133 'srcdoc': 'srcdoc',
134 134 'width': 'width',
135 135 },
136   - 'ImageElement': const {
  136 + 'html.ImageElement': const {
137 137 'align': 'align',
138 138 'alt': 'alt',
139 139 'border': 'border',
@@ -149,7 +149,7 @@ var htmlElementFields = const {
149 149 'vspace': 'vspace',
150 150 'width': 'width',
151 151 },
152   - 'InputElement': const {
  152 + 'html.InputElement': const {
153 153 'accept': 'accept',
154 154 'align': 'align',
155 155 'alt': 'alt',
@@ -194,24 +194,24 @@ var htmlElementFields = const {
194 194 'webkitdirectory': 'webkitdirectory',
195 195 'width': 'width',
196 196 },
197   - 'KeygenElement': const {
  197 + 'html.KeygenElement': const {
198 198 'autofocus': 'autofocus',
199 199 'challenge': 'challenge',
200 200 'disabled': 'disabled',
201 201 'keytype': 'keytype',
202 202 'name': 'name',
203 203 },
204   - 'LIElement': const {
  204 + 'html.LIElement': const {
205 205 'type': 'type',
206 206 'value': 'value',
207 207 },
208   - 'LabelElement': const {
  208 + 'html.LabelElement': const {
209 209 'for': 'htmlFor',
210 210 },
211   - 'LegendElement': const {
  211 + 'html.LegendElement': const {
212 212 'align': 'align',
213 213 },
214   - 'LinkElement': const {
  214 + 'html.LinkElement': const {
215 215 'charset': 'charset',
216 216 'disabled': 'disabled',
217 217 'href': 'href',
@@ -223,10 +223,10 @@ var htmlElementFields = const {
223 223 'target': 'target',
224 224 'type': 'type',
225 225 },
226   - 'MapElement': const {
  226 + 'html.MapElement': const {
227 227 'name': 'name',
228 228 },
229   - 'MediaElement': const {
  229 + 'html.MediaElement': const {
230 230 'autoplay': 'autoplay',
231 231 'controller': 'controller',
232 232 'controls': 'controls',
@@ -243,16 +243,13 @@ var htmlElementFields = const {
243 243 'webkitclosedcaptionsvisible': 'webkitClosedCaptionsVisible',
244 244 'webkitpreservespitch': 'webkitPreservesPitch',
245 245 },
246   - 'MenuElement': const {
247   - 'compact': 'compact',
248   - },
249   - 'MetaElement': const {
  246 + 'html.MetaElement': const {
250 247 'content': 'content',
251 248 'http-equiv': 'httpEquiv',
252 249 'name': 'name',
253 250 'scheme': 'scheme',
254 251 },
255   - 'MeterElement': const {
  252 + 'html.MeterElement': const {
256 253 'high': 'high',
257 254 'low': 'low',
258 255 'max': 'max',
@@ -260,17 +257,17 @@ var htmlElementFields = const {
260 257 'optimum': 'optimum',
261 258 'value': 'value',
262 259 },
263   - 'ModElement': const {
  260 + 'html.ModElement': const {
264 261 'cite': 'cite',
265 262 'datetime': 'dateTime',
266 263 },
267   - 'OListElement': const {
  264 + 'html.OListElement': const {
268 265 'compact': 'compact',
269 266 'reversed': 'reversed',
270 267 'start': 'start',
271 268 'type': 'type',
272 269 },
273   - 'ObjectElement': const {
  270 + 'html.ObjectElement': const {
274 271 'align': 'align',
275 272 'archive': 'archive',
276 273 'border': 'border',
@@ -288,44 +285,44 @@ var htmlElementFields = const {
288 285 'vspace': 'vspace',
289 286 'width': 'width',
290 287 },
291   - 'OptGroupElement': const {
  288 + 'html.OptGroupElement': const {
292 289 'disabled': 'disabled',
293 290 'label': 'label',
294 291 },
295   - 'OptionElement': const {
  292 + 'html.OptionElement': const {
296 293 'defaultselected': 'defaultSelected',
297 294 'disabled': 'disabled',
298 295 'label': 'label',
299 296 'selected': 'selected',
300 297 'value': 'value',
301 298 },
302   - 'OutputElement': const {
  299 + 'html.OutputElement': const {
303 300 'default': 'defaultValue',
304 301 'for': 'htmlFor',
305 302 'name': 'name',
306 303 'value': 'value',
307 304 },
308   - 'ParagraphElement': const {
  305 + 'html.ParagraphElement': const {
309 306 'align': 'align',
310 307 },
311   - 'ParamElement': const {
  308 + 'html.ParamElement': const {
312 309 'name': 'name',
313 310 'type': 'type',
314 311 'value': 'value',
315 312 'valuetype': 'valueType',
316 313 },
317   - 'PreElement': const {
  314 + 'html.PreElement': const {
318 315 'width': 'width',
319 316 'wrap': 'wrap',
320 317 },
321   - 'ProgressElement': const {
  318 + 'html.ProgressElement': const {
322 319 'max': 'max',
323 320 'value': 'value',
324 321 },
325   - 'QuoteElement': const {
  322 + 'html.QuoteElement': const {
326 323 'cite': 'cite',
327 324 },
328   - 'ScriptElement': const {
  325 + 'html.ScriptElement': const {
329 326 'async': 'async',
330 327 'charset': 'charset',
331 328 'crossorigin': 'crossOrigin',
@@ -335,7 +332,7 @@ var htmlElementFields = const {
335 332 'src': 'src',
336 333 'type': 'type',
337 334 },
338   - 'SelectElement': const {
  335 + 'html.SelectElement': const {
339 336 'autofocus': 'autofocus',
340 337 'disabled': 'disabled',
341 338 'length': 'length',
@@ -346,21 +343,21 @@ var htmlElementFields = const {
346 343 'size': 'size',
347 344 'value': 'value',
348 345 },
349   - 'SourceElement': const {
  346 + 'html.SourceElement': const {
350 347 'media': 'media',
351 348 'src': 'src',
352 349 'type': 'type',
353 350 },
354   - 'StyleElement': const {
  351 + 'html.StyleElement': const {
355 352 'disabled': 'disabled',
356 353 'media': 'media',
357 354 'scoped': 'scoped',
358 355 'type': 'type',
359 356 },
360   - 'TableCaptionElement': const {
  357 + 'html.TableCaptionElement': const {
361 358 'align': 'align',
362 359 },
363   - 'TableCellElement': const {
  360 + 'html.TableCellElement': const {
364 361 'abbr': 'abbr',
365 362 'align': 'align',
366 363 'axis': 'axis',
@@ -376,7 +373,7 @@ var htmlElementFields = const {
376 373 'valign': 'vAlign',
377 374 'width': 'width',
378 375 },
379   - 'TableColElement': const {
  376 + 'html.TableColElement': const {
380 377 'align': 'align',
381 378 'ch': 'ch',
382 379 'choff': 'chOff',
@@ -384,7 +381,7 @@ var htmlElementFields = const {
384 381 'valign': 'vAlign',
385 382 'width': 'width',
386 383 },
387   - 'TableElement': const {
  384 + 'html.TableElement': const {
388 385 'align': 'align',
389 386 'bgcolor': 'bgColor',
390 387 'border': 'border',
@@ -398,20 +395,20 @@ var htmlElementFields = const {
398 395 'thead': 'tHead',
399 396 'width': 'width',
400 397 },
401   - 'TableRowElement': const {
  398 + 'html.TableRowElement': const {
402 399 'align': 'align',
403 400 'bgcolor': 'bgColor',
404 401 'ch': 'ch',
405 402 'choff': 'chOff',
406 403 'valign': 'vAlign',
407 404 },
408   - 'TableSectionElement': const {
  405 + 'html.TableSectionElement': const {
409 406 'align': 'align',
410 407 'ch': 'ch',
411 408 'choff': 'chOff',
412 409 'valign': 'vAlign',
413 410 },
414   - 'TextAreaElement': const {
  411 + 'html.TextAreaElement': const {
415 412 'autofocus': 'autofocus',
416 413 'cols': 'cols',
417 414 'default': 'defaultValue',
@@ -429,17 +426,18 @@ var htmlElementFields = const {
429 426 'value': 'value',
430 427 'wrap': 'wrap',
431 428 },
432   - 'TrackElement': const {
  429 + 'html.TrackElement': const {
  430 + 'default': 'defaultValue',
433 431 'kind': 'kind',
434 432 'label': 'label',
435 433 'src': 'src',
436 434 'srclang': 'srclang',
437 435 },
438   - 'UListElement': const {
  436 + 'html.UListElement': const {
439 437 'compact': 'compact',
440 438 'type': 'type',
441 439 },
442   - 'VideoElement': const {
  440 + 'html.VideoElement': const {
443 441 'height': 'height',
444 442 'poster': 'poster',
445 443 'width': 'width',
@@ -447,64 +445,64 @@ var htmlElementFields = const {
447 445 };
448 446
449 447 var htmlElementExtends = const {
450   - 'AnchorElement': 'Element',
451   - 'AreaElement': 'Element',
452   - 'AudioElement': 'MediaElement',
453   - 'BRElement': 'Element',
454   - 'BaseElement': 'Element',
455   - 'BodyElement': 'Element',
456   - 'ButtonElement': 'Element',
457   - 'CanvasElement': 'Element',
458   - 'DListElement': 'Element',
459   - 'DataListElement': 'Element',
460   - 'DetailsElement': 'Element',
461   - 'DivElement': 'Element',
462   - 'EmbedElement': 'Element',
463   - 'FieldSetElement': 'Element',
464   - 'FormElement': 'Element',
465   - 'HRElement': 'Element',
466   - 'HeadElement': 'Element',
467   - 'HeadingElement': 'Element',
468   - 'HtmlElement': 'Element',
469   - 'IFrameElement': 'Element',
470   - 'ImageElement': 'Element',
471   - 'InputElement': 'Element',
472   - 'KeygenElement': 'Element',
473   - 'LIElement': 'Element',
474   - 'LabelElement': 'Element',
475   - 'LegendElement': 'Element',
476   - 'LinkElement': 'Element',
477   - 'MapElement': 'Element',
478   - 'MediaElement': 'Element',
479   - 'MenuElement': 'Element',
480   - 'MetaElement': 'Element',
481   - 'MeterElement': 'Element',
482   - 'ModElement': 'Element',
483   - 'OListElement': 'Element',
484   - 'ObjectElement': 'Element',
485   - 'OptGroupElement': 'Element',
486   - 'OptionElement': 'Element',
487   - 'OutputElement': 'Element',
488   - 'ParagraphElement': 'Element',
489   - 'ParamElement': 'Element',
490   - 'PreElement': 'Element',
491   - 'ProgressElement': 'Element',
492   - 'QuoteElement': 'Element',
493   - 'ScriptElement': 'Element',
494   - 'SelectElement': 'Element',
495   - 'SourceElement': 'Element',
496   - 'SpanElement': 'Element',
497   - 'StyleElement': 'Element',
498   - 'TableCaptionElement': 'Element',
499   - 'TableCellElement': 'Element',
500   - 'TableColElement': 'Element',
501   - 'TableElement': 'Element',
502   - 'TableRowElement': 'Element',
503   - 'TableSectionElement': 'Element',
504   - 'TextAreaElement': 'Element',
505   - 'TitleElement': 'Element',
506   - 'TrackElement': 'Element',
507   - 'UListElement': 'Element',
508   - 'UnknownElement': 'Element',
509   - 'VideoElement': 'MediaElement',
  448 + 'html.AnchorElement': 'html.Element',
  449 + 'html.AreaElement': 'html.Element',
  450 + 'web_audio.AudioElement': 'html.MediaElement',
  451 + 'html.BRElement': 'html.Element',
  452 + 'html.BaseElement': 'html.Element',
  453 + 'html.BodyElement': 'html.Element',
  454 + 'html.ButtonElement': 'html.Element',
  455 + 'html.CanvasElement': 'html.Element',
  456 + 'html.DListElement': 'html.Element',
  457 + 'html.DataListElement': 'html.Element',
  458 + 'html.DetailsElement': 'html.Element',
  459 + 'html.DivElement': 'html.Element',
  460 + 'html.EmbedElement': 'html.Element',
  461 + 'html.FieldSetElement': 'html.Element',
  462 + 'html.FormElement': 'html.Element',
  463 + 'html.HRElement': 'html.Element',
  464 + 'html.HeadElement': 'html.Element',
  465 + 'html.HeadingElement': 'html.Element',
  466 + 'html.HtmlElement': 'html.Element',
  467 + 'html.IFrameElement': 'html.Element',
  468 + 'html.ImageElement': 'html.Element',
  469 + 'html.InputElement': 'html.Element',
  470 + 'html.KeygenElement': 'html.Element',
  471 + 'html.LIElement': 'html.Element',
  472 + 'html.LabelElement': 'html.Element',
  473 + 'html.LegendElement': 'html.Element',
  474 + 'html.LinkElement': 'html.Element',
  475 + 'html.MapElement': 'html.Element',
  476 + 'html.MediaElement': 'html.Element',
  477 + 'html.MenuElement': 'html.Element',
  478 + 'html.MetaElement': 'html.Element',
  479 + 'html.MeterElement': 'html.Element',
  480 + 'html.ModElement': 'html.Element',
  481 + 'html.OListElement': 'html.Element',
  482 + 'html.ObjectElement': 'html.Element',
  483 + 'html.OptGroupElement': 'html.Element',
  484 + 'html.OptionElement': 'html.Element',
  485 + 'html.OutputElement': 'html.Element',
  486 + 'html.ParagraphElement': 'html.Element',
  487 + 'html.ParamElement': 'html.Element',
  488 + 'html.PreElement': 'html.Element',
  489 + 'html.ProgressElement': 'html.Element',
  490 + 'html.QuoteElement': 'html.Element',
  491 + 'html.ScriptElement': 'html.Element',
  492 + 'html.SelectElement': 'html.Element',
  493 + 'html.SourceElement': 'html.Element',
  494 + 'html.SpanElement': 'html.Element',
  495 + 'html.StyleElement': 'html.Element',
  496 + 'html.TableCaptionElement': 'html.Element',
  497 + 'html.TableCellElement': 'html.Element',
  498 + 'html.TableColElement': 'html.Element',
  499 + 'html.TableElement': 'html.Element',
  500 + 'html.TableRowElement': 'html.Element',
  501 + 'html.TableSectionElement': 'html.Element',
  502 + 'html.TextAreaElement': 'html.Element',
  503 + 'html.TitleElement': 'html.Element',
  504 + 'html.TrackElement': 'html.Element',
  505 + 'html.UListElement': 'html.Element',
  506 + 'html.UnknownElement': 'html.Element',
  507 + 'html.VideoElement': 'html.MediaElement',
510 508 };
222 lib/src/html5_utils.dart
@@ -16,7 +16,7 @@ String typeForHtmlTag(String tag) {
16 16 var type = htmlElementNames[tag];
17 17 // Note: this will eventually be the component's class name if it is a
18 18 // known x-tag.
19   - return type == null ? 'UnknownElement' : type;
  19 + return type == null ? 'html.UnknownElement' : type;
20 20 }
21 21
22 22 /**
@@ -30,116 +30,116 @@ String typeForHtmlTag(String tag) {
30 30 * command, data, dialog, td, th, and time.
31 31 */
32 32 const htmlElementNames = const {
33   - 'a': 'AnchorElement',
34   - 'abbr': 'Element',
35   - 'address': 'Element',
36   - 'area': 'AreaElement',
37   - 'article': 'Element',
38   - 'aside': 'Element',
39   - 'audio': 'AudioElement',
40   - 'b': 'Element',
41   - 'base': 'BaseElement',
42   - 'bdi': 'Element',
43   - 'bdo': 'Element',
44   - 'blockquote': 'QuoteElement',
45   - 'body': 'BodyElement',
46   - 'br': 'BRElement',
47   - 'button': 'ButtonElement',
48   - 'canvas': 'CanvasElement',
49   - 'caption': 'TableCaptionElement',
50   - 'cite': 'Element',
51   - 'code': 'Element',
52   - 'col': 'TableColElement',
53   - 'colgroup': 'TableColElement',
54   - 'command': 'Element', // see doc comment, was: 'CommandElement'
55   - 'data': 'Element', // see doc comment, was: 'DataElement'
56   - 'datalist': 'DataListElement',
57   - 'dd': 'Element',
58   - 'del': 'ModElement',
59   - 'details': 'DetailsElement',
60   - 'dfn': 'Element',
61   - 'dialog': 'Element', // see doc comment, was: 'DialogElement'
62   - 'div': 'DivElement',
63   - 'dl': 'DListElement',
64   - 'dt': 'Element',
65   - 'em': 'Element',
66   - 'embed': 'EmbedElement',
67   - 'fieldset': 'FieldSetElement',
68   - 'figcaption': 'Element',
69   - 'figure': 'Element',
70   - 'footer': 'Element',
71   - 'form': 'FormElement',
72   - 'h1': 'HeadingElement',
73   - 'h2': 'HeadingElement',
74   - 'h3': 'HeadingElement',
75   - 'h4': 'HeadingElement',
76   - 'h5': 'HeadingElement',
77   - 'h6': 'HeadingElement',
78   - 'head': 'HeadElement',
79   - 'header': 'Element',
80   - 'hgroup': 'Element',
81   - 'hr': 'HRElement',
82   - 'html': 'HtmlElement',
83   - 'i': 'Element',
84   - 'iframe': 'IFrameElement',
85   - 'img': 'ImageElement',
86   - 'input': 'InputElement',
87   - 'ins': 'ModElement',
88   - 'kbd': 'Element',
89   - 'keygen': 'KeygenElement',
90   - 'label': 'LabelElement',
91   - 'legend': 'LegendElement',
92   - 'li': 'LIElement',
93   - 'link': 'LinkElement',
94   - 'map': 'MapElement',
95   - 'mark': 'Element',
96   - 'menu': 'MenuElement',
97   - 'meta': 'MetaElement',
98   - 'meter': 'MeterElement',
99   - 'nav': 'Element',
100   - 'noscript': 'Element',
101   - 'object': 'ObjectElement',
102   - 'ol': 'OListElement',
103   - 'optgroup': 'OptGroupElement',
104   - 'option': 'OptionElement',
105   - 'output': 'OutputElement',
106   - 'p': 'ParagraphElement',
107   - 'param': 'ParamElement',
108   - 'pre': 'PreElement',
109   - 'progress': 'ProgressElement',
110   - 'q': 'QuoteElement',
111   - 'rp': 'Element',
112   - 'rt': 'Element',
113   - 'ruby': 'Element',
114   - 's': 'Element',
115   - 'samp': 'Element',
116   - 'script': 'ScriptElement',
117   - 'section': 'Element',
118   - 'select': 'SelectElement',
119   - 'small': 'Element',
120   - 'source': 'SourceElement',
121   - 'span': 'SpanElement',
122   - 'strong': 'Element',
123   - 'style': 'StyleElement',
124   - 'sub': 'Element',
125   - 'summary': 'Element',
126   - 'sup': 'Element',
127   - 'table': 'TableElement',
128   - 'tbody': 'TableSectionElement',
129   - 'td': 'TableCellElement', // see doc comment, was: 'TableDataCellElement'
130   - 'textarea': 'TextAreaElement',
131   - 'tfoot': 'TableSectionElement',
132   - 'th': 'TableCellElement', // see doc comment, was: 'TableHeaderCellElement'
133   - 'thead': 'TableSectionElement',
134   - 'time': 'Element', // see doc comment, was: 'TimeElement'
135   - 'title': 'TitleElement',
136   - 'tr': 'TableRowElement',
137   - 'track': 'TrackElement',
138   - 'u': 'Element',
139   - 'ul': 'UListElement',
140   - 'var': 'Element',
141   - 'video': 'VideoElement',
142   - 'wbr': 'Element',
  33 + 'a': 'html.AnchorElement',
  34 + 'abbr': 'html.Element',
  35 + 'address': 'html.Element',
  36 + 'area': 'html.AreaElement',
  37 + 'article': 'html.Element',
  38 + 'aside': 'html.Element',
  39 + 'audio': 'web_audio.AudioElement',
  40 + 'b': 'html.Element',
  41 + 'base': 'html.BaseElement',
  42 + 'bdi': 'html.Element',
  43 + 'bdo': 'html.Element',
  44 + 'blockquote': 'html.QuoteElement',
  45 + 'body': 'html.BodyElement',
  46 + 'br': 'html.BRElement',
  47 + 'button': 'html.ButtonElement',
  48 + 'canvas': 'html.CanvasElement',
  49 + 'caption': 'html.TableCaptionElement',
  50 + 'cite': 'html.Element',
  51 + 'code': 'html.Element',
  52 + 'col': 'html.TableColElement',
  53 + 'colgroup': 'html.TableColElement',
  54 + 'command': 'html.Element', // see doc comment, was: 'CommandElement'
  55 + 'data': 'html.Element', // see doc comment, was: 'DataElement'
  56 + 'datalist': 'html.DataListElement',
  57 + 'dd': 'html.Element',
  58 + 'del': 'html.ModElement',
  59 + 'details': 'html.DetailsElement',
  60 + 'dfn': 'html.Element',
  61 + 'dialog': 'html.Element', // see doc comment, was: 'DialogElement'
  62 + 'div': 'html.DivElement',
  63 + 'dl': 'html.DListElement',
  64 + 'dt': 'html.Element',
  65 + 'em': 'html.Element',
  66 + 'embed': 'html.EmbedElement',
  67 + 'fieldset': 'html.FieldSetElement',
  68 + 'figcaption': 'html.Element',
  69 + 'figure': 'html.Element',
  70 + 'footer': 'html.Element',
  71 + 'form': 'html.FormElement',
  72 + 'h1': 'html.HeadingElement',
  73 + 'h2': 'html.HeadingElement',
  74 + 'h3': 'html.HeadingElement',
  75 + 'h4': 'html.HeadingElement',
  76 + 'h5': 'html.HeadingElement',
  77 + 'h6': 'html.HeadingElement',
  78 + 'head': 'html.HeadElement',
  79 + 'header': 'html.Element',
  80 + 'hgroup': 'html.Element',
  81 + 'hr': 'html.HRElement',
  82 + 'html': 'html.HtmlElement',
  83 + 'i': 'html.Element',
  84 + 'iframe': 'html.IFrameElement',
  85 + 'img': 'html.ImageElement',
  86 + 'input': 'html.InputElement',
  87 + 'ins': 'html.ModElement',
  88 + 'kbd': 'html.Element',
  89 + 'keygen': 'html.KeygenElement',
  90 + 'label': 'html.LabelElement',
  91 + 'legend': 'html.LegendElement',
  92 + 'li': 'html.LIElement',
  93 + 'link': 'html.LinkElement',
  94 + 'map': 'html.MapElement',
  95 + 'mark': 'html.Element',
  96 + 'menu': 'html.MenuElement',
  97 + 'meta': 'html.MetaElement',
  98 + 'meter': 'html.MeterElement',
  99 + 'nav': 'html.Element',
  100 + 'noscript': 'html.Element',
  101 + 'object': 'html.ObjectElement',
  102 + 'ol': 'html.OListElement',
  103 + 'optgroup': 'html.OptGroupElement',
  104 + 'option': 'html.OptionElement',
  105 + 'output': 'html.OutputElement',
  106 + 'p': 'html.ParagraphElement',
  107 + 'param': 'html.ParamElement',
  108 + 'pre': 'html.PreElement',
  109 + 'progress': 'html.ProgressElement',
  110 + 'q': 'html.QuoteElement',
  111 + 'rp': 'html.Element',
  112 + 'rt': 'html.Element',
  113 + 'ruby': 'html.Element',
  114 + 's': 'html.Element',
  115 + 'samp': 'html.Element',
  116 + 'script': 'html.ScriptElement',
  117 + 'section': 'html.Element',
  118 + 'select': 'html.SelectElement',
  119 + 'small': 'html.Element',
  120 + 'source': 'html.SourceElement',
  121 + 'span': 'html.SpanElement',
  122 + 'strong': 'html.Element',
  123 + 'style': 'html.StyleElement',
  124 + 'sub': 'html.Element',
  125 + 'summary': 'html.Element',
  126 + 'sup': 'html.Element',
  127 + 'table': 'html.TableElement',
  128 + 'tbody': 'html.TableSectionElement',
  129 + 'td': 'html.TableCellElement', // see doc comment, was: 'TableDataCellElement'
  130 + 'textarea': 'html.TextAreaElement',
  131 + 'tfoot': 'html.TableSectionElement',
  132 + 'th': 'html.TableCellElement', // see doc comment, was: 'TableHeaderCellElement'
  133 + 'thead': 'html.TableSectionElement',
  134 + 'time': 'html.Element', // see doc comment, was: 'TimeElement'
  135 + 'title': 'html.TitleElement',
  136 + 'tr': 'html.TableRowElement',
  137 + 'track': 'html.TrackElement',
  138 + 'u': 'html.Element',
  139 + 'ul': 'html.UListElement',
  140 + 'var': 'html.Element',
  141 + 'video': 'html.VideoElement',
  142 + 'wbr': 'html.Element',
143 143 };
144 144
145 145
44 lib/web_components.dart
@@ -328,6 +328,9 @@ abstract class WebComponent implements Element {
328 328 _element.dataAttributes = value;
329 329 }
330 330
  331 + Map<String, String> getNamespacedAttributes(String namespace) =>
  332 + _element.getNamespacedAttributes(namespace);
  333 +
331 334 Future<CSSStyleDeclaration> get computedStyle => _element.computedStyle;
332 335
333 336 Future<CSSStyleDeclaration> getComputedStyle(String pseudoElement)
@@ -349,13 +352,22 @@ abstract class WebComponent implements Element {
349 352
350 353 String get id => _element.id;
351 354
352   - String get innerHTML => _element.innerHTML;
  355 + String get innerHTML => _element.innerHtml;
  356 +
  357 + void set innerHTML(String v) {
  358 + _element.innerHtml = v;
  359 + }
  360 +
  361 + String get innerHtml => _element.innerHtml;
  362 + void set innerHtml(String v) {
  363 + _element.innerHtml = v;
  364 + }
353 365
354 366 bool get isContentEditable => _element.isContentEditable;
355 367
356 368 String get lang => _element.lang;
357 369
358   - String get outerHTML => _element.outerHTML;
  370 + String get outerHtml => _element.outerHtml;
359 371
360 372 bool get spellcheck => _element.spellcheck;
361 373
@@ -374,8 +386,8 @@ abstract class WebComponent implements Element {
374 386 Element insertAdjacentElement(String where, Element element) =>
375 387 _element.insertAdjacentElement(where, element);
376 388
377   - void insertAdjacentHTML(String where, String html) {
378   - _element.insertAdjacentHTML(where, html);
  389 + void insertAdjacentHtml(String where, String html) {
  390 + _element.insertAdjacentHtml(where, html);
379 391 }
380 392
381 393 void insertAdjacentText(String where, String text) {
@@ -476,6 +488,20 @@ abstract class WebComponent implements Element {
476 488 String $dom_getAttribute(String name) =>
477 489 _element.$dom_getAttribute(name);
478 490
  491 + String $dom_getAttributeNS(String namespaceUri, String localName) =>
  492 + _element.$dom_getAttributeNS(namespaceUri, localName);
  493 +
  494 + String $dom_setAttributeNS(
  495 + String namespaceUri, String localName, String value) {
  496 + _element.$dom_setAttributeNS(namespaceUri, localName, value);
  497 + }
  498 +
  499 + bool $dom_hasAttributeNS(String namespaceUri, String localName) =>
  500 + _element.$dom_hasAttributeNS(namespaceUri, localName);
  501 +
  502 + void $dom_removeAttributeNS(String namespaceUri, String localName) =>
  503 + _element.$dom_removeAttributeNS(namespaceUri, localName);
  504 +
479 505 ClientRect getBoundingClientRect() => _element.getBoundingClientRect();
480 506
481 507 List<ClientRect> getClientRects() => _element.getClientRects();
@@ -509,6 +535,10 @@ abstract class WebComponent implements Element {
509 535
510 536 Node get $dom_lastChild => _element.$dom_lastChild;
511 537
  538 + String get $dom_localName => _element.$dom_localName;
  539 +
  540 + String get $dom_namespaceUri => _element.$dom_namespaceUri;
  541 +
512 542 int get nodeType => _element.nodeType;
513 543
514 544 void $dom_addEventListener(String type, EventListener listener,
@@ -534,9 +564,11 @@ abstract class WebComponent implements Element {
534 564
535 565 set xtag(value) { _element.xtag = value; }
536 566
537   - void addText(String text) => _element.addText(text);
  567 + void append(Element e) => _element.append(e);
  568 +
  569 + void appendText(String text) => _element.appendText(text);
538 570
539   - void addHtml(String html) => _element.addHtml(html);
  571 + void appendHtml(String html) => _element.appendHtml(html);
540 572 }
541 573
542 574 /**
2  pubspec.yaml
@@ -2,7 +2,7 @@ name: web_components
2 2 author: "Dart Team <misc@dartlang.org>"
3 3 homepage: https://github.com/dart-lang/dart-web-components
4 4 description: An easy way to build web apps in Dart.
5   -version: 0.2.8+2
  5 +version: 0.2.8+3
6 6 dependencies:
7 7 args: any
8 8 # Pin html5lib so we don't get unexpected API breaks.
4 test/data/input/bind_hyphenated_attribute_test.html
@@ -18,8 +18,8 @@
18 18 String topLevelVar = "hi";
19 19 main() {
20 20 window.on.load.add((e) {
21   - document.body.addText('expected data-hi to be "hi", got '
22   - '"${query('div').dataAttributes['hi']}"');
  21 + document.body.appendText('expected data-hi to be "hi", got '
  22 + '"${query('div').dataAttributes['hi']}"');
23 23 window.setTimeout(() => window.postMessage('done', '*'), 0);
24 24 });
25 25 }
4 test/data/input/component_field_2way_test.html
@@ -43,10 +43,10 @@
43 43 window.setTimeout(() {
44 44 var actual = query('#actual');
45 45 var greet = query('#greet');
46   - expect(actual.innerHTML, 'hello world');
  46 + expect(actual.innerHtml, 'hello world');
47 47 greet.xtag.changeStuff();
48 48 dispatch();
49   - expect(actual.innerHTML, contains('Yo dawg I heard'));
  49 + expect(actual.innerHtml, contains('Yo dawg I heard'));
50 50 window.postMessage('done', '*');
51 51 }, 0);
52 52 }
8 test/data/input/dom_accessor_binding2_test.html
@@ -20,12 +20,12 @@
20 20 main() {
21 21 window.on.load.add((e) {
22 22 var input = query('input');
23   - document.body.addText('expected input.checked to be false, got '
24   - '${input.checked}');
  23 + document.body.appendText('expected input.checked to be false, got '
  24 + '${input.checked}');
25 25 boolVar = true;
26 26 dispatch();
27   - document.body.addText('expected input.checked to be true, got '
28   - '${input.checked}');
  27 + document.body.appendText('expected input.checked to be true, got '
  28 + '${input.checked}');
29 29 window.setTimeout(() => window.postMessage('done', '*'), 0);
30 30 });
31 31 }
8 test/data/input/dom_accessor_binding_test.html
@@ -20,13 +20,13 @@
20 20 main() {
21 21 window.on.load.add((e) {
22 22 var input = query('input');
23   - document.body.addText('expected input.value to be "A", got '
24   - '${input.value}');
  23 + document.body.appendText('expected input.value to be "A", got '
  24 + '${input.value}');
25 25 input.value = "B";
26 26 topLevelVar = "C";
27 27 dispatch();
28   - document.body.addText('expected input.value to be "C", got '
29   - '${input.value}');
  28 + document.body.appendText('expected input.value to be "C", got '
  29 + '${input.value}');
30 30 window.setTimeout(() => window.postMessage('done', '*'), 0);
31 31 });
32 32 }
2  test/data/input/if_attribute_test.html
@@ -30,7 +30,7 @@
30 30 window.setTimeout(() {
31 31 var div = document.query('#test');
32 32 expect(div, isNotNull);
33   - expect(div.innerHTML, equals('3'));
  33 + expect(div.innerHtml, equals('3'));
34 34 expect(div.previousNode, same(placeholder));
35 35 window.setTimeout(() => window.postMessage('done', '*'), 0);
36