From 9ce3ec9139c6ef6f0efba2ec35bdee1d4ebcacd8 Mon Sep 17 00:00:00 2001
From: Ojan Vafai <ojan@chromium.org>
Date: Wed, 28 Jan 2015 21:48:28 -0800
Subject: [PATCH] Add a selection and outline to flights-app.

This is just to get basic paint coverage of selections
and outlines on positioned elements.

TBR=esprehn@chromium.org

Review URL: https://codereview.chromium.org/886683002
---
 examples/flights-app/app-search-input.sky       |  5 +++++
 examples/flights-app/app-toast.sky              | 13 +++++++++++++
 tests/framework/flights-app-expected.txt        |  7 +++++++
 tests/framework/flights-app-pixels-expected.sky |  2 +-
 4 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/examples/flights-app/app-search-input.sky b/examples/flights-app/app-search-input.sky
index f87953aa80d..32bc810f658 100644
--- a/examples/flights-app/app-search-input.sky
+++ b/examples/flights-app/app-search-input.sky
@@ -22,6 +22,11 @@
 </template>
 <script>
 module.exports = class extends SkyElement {
+  attached() {
+    var sel = window.getSelection();
+    var input = this.shadowRoot.querySelector('t');
+    sel.selectAllChildren(input);
+  }
 }.register();
 </script>
 </sky-element>
diff --git a/examples/flights-app/app-toast.sky b/examples/flights-app/app-toast.sky
index d7c1c5ae597..36626ff202b 100644
--- a/examples/flights-app/app-toast.sky
+++ b/examples/flights-app/app-toast.sky
@@ -23,6 +23,16 @@
       flex-shrink: 0;
       margin-right: 6px;
     }
+
+    .close-box {
+      position: absolute;
+      top: 3px;
+      right: 3px;
+      width: 1em;
+      overflow: hidden;
+      text-align: center;
+      outline: 1px solid #AEA477;
+    }
   </style>
   <div class="header">
     <content select=".toast-icon" />
@@ -30,6 +40,9 @@
   <div class="content">
     <content select=".toast-content" />
   </div>
+  <div class="close-box">
+   X
+  </div>
 </template>
 <script>
 module.exports = class extends SkyElement {
diff --git a/tests/framework/flights-app-expected.txt b/tests/framework/flights-app-expected.txt
index 7854353e233..7b5b4e6daf2 100644
--- a/tests/framework/flights-app-expected.txt
+++ b/tests/framework/flights-app-expected.txt
@@ -159,4 +159,11 @@ layer at (609,509) size 159x59 clip at (610,510) size 157x57
           RenderParagraph (anonymous) at (0,30) size 106.69x15
             RenderText {#text} at (0,0) size 107x15
               text run at (0,0) width 107: "cheaper tomorrow."
+layer at (751,513) size 13x15
+  RenderBlock (positioned) {div} at (141.89,4) size 12.80x15
+    RenderParagraph (anonymous) at (0,0) size 12.80x15
+      RenderText {#text} at (2,0) size 9x15
+        text run at (2,0) width 9: "X"
+selection start: position 0 of child 0 {#text} of child 0 {t} of child 2 {span} of {#document-fragment} of child 0 {app-search-input} of child 2 {app-toolbar} of {#document-fragment} of child 3 {flights-app} of child 0 {sky} of document
+selection end:   position 28 of child 0 {#text} of child 0 {t} of child 2 {span} of {#document-fragment} of child 0 {app-search-input} of child 2 {app-toolbar} of {#document-fragment} of child 3 {flights-app} of child 0 {sky} of document
 
diff --git a/tests/framework/flights-app-pixels-expected.sky b/tests/framework/flights-app-pixels-expected.sky
index 7ba4903f12e..f9a661081e0 100644
--- a/tests/framework/flights-app-pixels-expected.sky
+++ b/tests/framework/flights-app-pixels-expected.sky
@@ -1,7 +1,7 @@
 <sky>
   <import src="../resources/run-after-display.sky" as="runAfterDisplay" />
 
-  <img src="http://storage.googleapis.com/mojo/sky-pngs/fb6e2e548b500925439506ea4990bb5951ff0127" />
+  <img src="http://storage.googleapis.com/mojo/sky-pngs/5eb363566d6dbf6a3afdd9a0edd9f90a95f41582" />
 
   <script>
     window.addEventListener('load', function() {