Continue updating MDV.

sdk/lib/html/dart2js/html_dart2js.dart

 /// The Dart HTML library.
 ///
 /// For examples, see
 /// [Dart HTML5 Samples](https://github.com/dart-lang/dart-html5-samples)
 /// on Github.
 library dart.dom.html;
 
 import 'dart:async';
 import 'dart:collection';
 import 'dart:_collection-dev' hide Symbol;
@@ skipping 8270 matching lines @@
 
   @Creates('Null')  // Set from Dart code; does not instantiate a native type.
   Element _templateInstanceRef;
 
   // Note: only used if `this is! TemplateElement`
   @Creates('Null')  // Set from Dart code; does not instantiate a native type.
   DocumentFragment _templateContent;
 
   bool _templateIsDecorated;
 
+
   /**
    * Gets the template this node refers to.
    * This is only supported if [isTemplate] is true.
    */
   @Experimental
   Element get ref {
     _ensureTemplate();
 
     Element ref = null;
     var refId = attributes['ref'];
     if (refId != null) {
-      ref = document.getElementById(refId);
+      var treeScope = this;
+      while (treeScope.parentNode != null) {
+        treeScope = treeScope.parentNode;
+      }
+
+      // Note: JS code tests that getElementById is present. We can't do that
+      // easily, so instead check for the types known to implement it.
+      if (treeScope is Document ||
+          treeScope is ShadowRoot ||
+          treeScope is svg.SvgSvgElement) {
+
+        ref = treeScope.getElementById(refId);
+      }
     }
 
     return ref != null ? ref : _templateInstanceRef;
   }
 
   /**
    * Gets the content of this template.
    * This is only supported if [isTemplate] is true.
    */
   @Experimental
@@ skipping 32 matching lines @@
     'colgroup': null,
     'tbody': null,
     'td': null,
     'tfoot': null,
     'th': null,
     'thead': null,
     'tr': null,
   };
 
   bool get _isAttributeTemplate => attributes.containsKey('template') &&
-      (localName == 'option' || _TABLE_TAGS.containsKey(localName));
+      (localName == 'option' || localName == 'optgroup' ||
+       _TABLE_TAGS.containsKey(localName));
 
   /**
    * Returns true if this node is a template.
    *
    * A node is a template if [tagName] is TEMPLATE, or the node has the
    * 'template' attribute and this tag supports attribute form for backwards
    * compatibility with existing HTML parsers. The nodes that can use attribute
    * form are table elments (THEAD, TBODY, TFOOT, TH, TR, TD, CAPTION, COLGROUP
-   * and COL) and OPTION.
+   * and COL), OPTION, and OPTGROUP.
    */
   // TODO(jmesserly): this is not a public MDV API, but it seems like a useful
   // place to document which tags our polyfill considers to be templates.
   // Otherwise I'd be repeating it in several other places.
   // See if we can replace this with a TemplateMixin.
   @Experimental
   bool get isTemplate => tagName == 'TEMPLATE' || _isAttributeTemplate;
 
   void _ensureTemplate() {
     if (!isTemplate) {
@@ skipping 12746 matching lines @@
     // template.
     // TODO(jmesserly): content is DocumentFragment or Element
     var descendents = (content as dynamic).queryAll(_allTemplatesSelectors);
     if (content is Element && (content as Element).isTemplate) {
       _bootstrap(content);
     }
 
     descendents.forEach(_bootstrap);
   }
 
-  static final String _allTemplatesSelectors = 'template, option[template], ' +
+  static final String _allTemplatesSelectors =
+      'template, option[template], optgroup[template], ' +
       Element._TABLE_TAGS.keys.map((k) => "$k[template]").join(", ");
 
   static bool _initStyles;
 
   static void _injectStylesheet() {
     if (_initStyles == true) return;
     _initStyles = true;
 
     var style = new StyleElement();
     style.text = r'''
@@ skipping 7634 matching lines @@
       _position = nextPosition;
       return true;
     }
     _current = null;
     _position = _array.length;
     return false;
   }
 
   T get current => _current;
 }