From 217eb0e5fa3181e79aa06822e3a444052402ba63 Mon Sep 17 00:00:00 2001
From: Ilya Kantor <iliakan@gmail.com>
Date: Sat, 14 Oct 2017 23:52:37 +0300
Subject: [PATCH] minor

---
 2-ui/2-events/02-bubbling-and-capturing/article.md        | 2 +-
 .../bubble-target.view/script.js                          | 8 +++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/2-ui/2-events/02-bubbling-and-capturing/article.md b/2-ui/2-events/02-bubbling-and-capturing/article.md
index e1c287cc..bc5d70dc 100644
--- a/2-ui/2-events/02-bubbling-and-capturing/article.md
+++ b/2-ui/2-events/02-bubbling-and-capturing/article.md
@@ -5,7 +5,7 @@ Let's start with an example.
 This handler is assigned to `<div>`, but also runs if you click any nested tag like `<em>` or `<code>`:
 
 ```html autorun height=60
-<div onclick="alert('The handler !')">
+<div onclick="alert('The handler!')">
   <em>If you click on <code>EM</code>, the handler on <code>DIV</code> runs.</em>
 </div>
 ```
diff --git a/2-ui/2-events/02-bubbling-and-capturing/bubble-target.view/script.js b/2-ui/2-events/02-bubbling-and-capturing/bubble-target.view/script.js
index d3959a68..b1353712 100644
--- a/2-ui/2-events/02-bubbling-and-capturing/bubble-target.view/script.js
+++ b/2-ui/2-events/02-bubbling-and-capturing/bubble-target.view/script.js
@@ -2,7 +2,9 @@
 form.onclick = function(event) {
   event.target.style.backgroundColor = 'yellow';
 
-  alert("target = " + event.target.tagName + ", this=" + this.tagName);
-
-  event.target.style.backgroundColor = '';
+  // chrome needs some time to paint yellow
+  setTimeout(() => {
+    alert("target = " + event.target.tagName + ", this=" + this.tagName);
+    event.target.style.backgroundColor = ''
+  }, 0);
 };