Use ShadowRoot to hide non-user content (for example, diagnostics).

dart/site/try/src/editor.dart

 // Copyright (c) 2013, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 library trydart.editor;
 
 import 'dart:html';
 
 import 'package:compiler/implementation/scanner/scannerlib.dart' show
     EOF_TOKEN,
@@ skipping 12 matching lines @@
     CodeCompletionDecoration,
     Decoration,
     DiagnosticDecoration,
     error,
     info,
     warning;
 
 import 'selection.dart' show
     isCollapsed;
 
+import 'shadow_root.dart' show
+    getShadowRoot;
+
 const String INDENT = '\u{a0}\u{a0}';
 
 Set<String> seenIdentifiers;
 
-Element moveActive(int distance) {
-  List<Element> entries = document.querySelectorAll('.dart-static>.dart-entry');
+Element moveActive(int distance, Node ui) {
+  var /* ShadowRoot or Element */ root = getShadowRoot(ui);
+  List<Element> entries = root.querySelectorAll('.dart-static>.dart-entry');
   int activeIndex = -1;
   for (var i = 0; i < entries.length; i++) {
     if (entries[i].classes.contains('activeEntry')) {
       activeIndex = i;
       break;
     }
   }
   int newIndex = activeIndex + distance;
   Element currentEntry;
   if (0 <= newIndex && newIndex < entries.length) {
     currentEntry = entries[newIndex];
   }
   if (currentEntry == null) return null;
   if (0 <= newIndex && activeIndex != -1) {
     entries[activeIndex].classes.remove('activeEntry');
   }
-  Element staticNode = document.querySelector('.dart-static');
+  Element staticNode = root.querySelector('.dart-static');
   String visibility = computeVisibility(currentEntry, staticNode);
   print(visibility);
-  var serverResults = document.querySelectorAll('.dart-server>.dart-entry');
+  var serverResults = root.querySelectorAll('.dart-server>.dart-entry');
   var serverResultCount = serverResults.length;
   if (serverResultCount > 0) {
     switch (visibility) {
       case obscured:
       case hidden: {
         Rectangle cr = currentEntry.getBoundingClientRect();
         Rectangle sr = staticNode.getBoundingClientRect();
         Element entry = serverResults[0];
         entry.remove();
         currentEntry.parentNode.insertBefore(entry, currentEntry);
         currentEntry = entry;
         serverResultCount--;
 
         staticNode.style.maxHeight = '${sr.boundingBox(cr).height}px';
       }
     }
   } else {
     currentEntry.scrollIntoView(ScrollAlignment.BOTTOM);
   }
   if (serverResultCount == 0) {
-    document.querySelector('.dart-server').style.display = 'none';
+    root.querySelector('.dart-server').style.display = 'none';
   }
   if (currentEntry != null) {
     currentEntry.classes.add('activeEntry');
   }
   // Discard mutations.
   observer.takeRecords();
   return currentEntry;
 }
 
 const visible = 'visible';
@@ skipping 135 matching lines @@
 
 diagnostic(text, tip) {
   if (text is String) {
     text = new Text(text);
   }
   return new AnchorElement()
       ..classes.add('diagnostic')
       ..append(text)
       ..append(tip);
 }