From 02f5f708470b9b7e8d85774a1a2d7c97a333d67a Mon Sep 17 00:00:00 2001
From: Ursula Sarracini <ursulasarracini@gmail.com>
Date: Fri, 20 May 2016 13:00:24 -0700
Subject: [PATCH] fix(content): #632 Bug 1269777 - Google search string from
 context menu wrongly searches

---
 content-src/components/SiteIcon/SiteIcon.js   | 2 +-
 content-src/components/SiteIcon/SiteIcon.scss | 4 ++++
 content-test/components/SiteIcon.test.js      | 5 ++++-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/content-src/components/SiteIcon/SiteIcon.js b/content-src/components/SiteIcon/SiteIcon.js
index 191b109a30..3020e8628a 100644
--- a/content-src/components/SiteIcon/SiteIcon.js
+++ b/content-src/components/SiteIcon/SiteIcon.js
@@ -34,7 +34,7 @@ const SiteIcon = React.createClass({
       <div ref="border" hidden={!showBackground || !showBorder} className="inner-border" />
       <div className="site-icon-wrapper">
         <img ref="favicon" width={faviconSize} height={faviconSize} className="site-icon-favicon" hidden={showFallback} src={site.favicon} />
-        <span ref="fallback" className="site-icon-fallback" style={fallbackStyle} hidden={!showFallback}>{site.firstLetter}</span>
+        <span ref="fallback" className="site-icon-fallback" style={fallbackStyle} hidden={!showFallback} data-first-letter={site.firstLetter} />
       </div>
       <div ref="title" hidden={!showTitle} className="site-icon-title">{site.label}</div>
     </div>);
diff --git a/content-src/components/SiteIcon/SiteIcon.scss b/content-src/components/SiteIcon/SiteIcon.scss
index d5b3dec38c..41b7aaa02d 100644
--- a/content-src/components/SiteIcon/SiteIcon.scss
+++ b/content-src/components/SiteIcon/SiteIcon.scss
@@ -27,6 +27,10 @@
   .site-icon-fallback {
     text-transform: uppercase;
     opacity: 0.75;
+
+    &::after {
+      content: attr(data-first-letter);
+    }
   }
 
   .site-icon-title {
diff --git a/content-test/components/SiteIcon.test.js b/content-test/components/SiteIcon.test.js
index 78835cb9ca..b660c75de1 100644
--- a/content-test/components/SiteIcon.test.js
+++ b/content-test/components/SiteIcon.test.js
@@ -97,7 +97,10 @@ describe("SiteIcon", () => {
       assert.equal(instance.refs.background.style.backgroundColor, "rgb(0, 0, 0)");
     });
     it("should use the first letter of the host name", () => {
-      assert.equal(instance.refs.fallback.innerHTML, "f");
+      assert.equal(instance.refs.fallback.dataset.firstLetter, "f");
+    });
+    it("should not affect the content text", () => {
+      assert.equal(instance.refs.fallback.innerHTML, "");
     });
   });
 });