Use custom scrollbars for print preview on non-retina mac displays.

This is a hack to workaround a blink bug where overlay scrollbars aren't
rendered correctly in print preview. This bug is being looked at but
until then we use custom scrollbars that imitate mac scrollbars only
in this specific case.

BUG=466039

Review URL: https://codereview.chromium.org/1036943004

Cr-Commit-Position: refs/heads/master@{#322331}

chrome/browser/resources/component_extension_resources.grd

@@ -178,6 +178,9 @@
         <include name="IDR_PDF_VIEWPORT_SCROLLER_JS" file="pdf/viewport_scroller.js" type="BINDATA" />
         <include name="IDR_PDF_PDF_SCRIPTING_API_JS" file="pdf/pdf_scripting_api.js" type="BINDATA" />
         <include name="IDR_PDF_CONTENT_SCRIPT_JS" file="pdf/content_script.js" type="BINDATA" />
+        <if expr="is_macosx">
+          <include name="IDR_PDF_SCROLLBARS_CSS" file="pdf/scrollbars_mac.css" type="BINDATA" />
+        </if>
 
         <include name="IDR_PDF_VIEWER_BOOKMARK_CSS" file="pdf/elements/viewer-bookmark/viewer-bookmark.css" type="BINDATA" />
         <include name="IDR_PDF_VIEWER_BOOKMARK_HTML" file="pdf/elements/viewer-bookmark/viewer-bookmark.html" type="BINDATA" />

chrome/browser/resources/pdf/main.js

@@ -42,6 +42,18 @@ var viewer;
 
   function generateStreamDetailsAndInitViewer() {
     var url = window.location.search.substring(1);
+
+    // Hack to enable custom scrollbars for print preview on non-retina mac
+    // displays. Remove after crbug.com/466039 is fixed.
+    if (url.indexOf(IS_MAC_PARAM) === 0) {
+      url = url.substring(IS_MAC_PARAM.length);
+      var link = document.createElement('link');
+      link.rel = 'stylesheet';
+      link.type = 'text/css';
+      link.href = 'scrollbars_mac.css';
+      document.getElementsByTagName('head')[0].appendChild(link);
+    }
+
     var streamDetails = {
       streamUrl: url,
       originalUrl: url,

chrome/browser/resources/pdf/pdf_scripting_api.js

@@ -250,6 +250,8 @@ PDFScriptingAPI.prototype = {
   },
 };
 
+var IS_MAC_PARAM = 'isMac&';
+
 /**
  * Creates a PDF viewer with a scripting interface. This is basically 1) an
  * iframe which is navigated to the PDF viewer extension and 2) a scripting
@@ -260,9 +262,11 @@ PDFScriptingAPI.prototype = {
  */
 function PDFCreateOutOfProcessPlugin(src) {
   var iframe = window.document.createElement('iframe');
+  var isMac = cr.isMac ? IS_MAC_PARAM : '';
   iframe.setAttribute(
       'src',
-      'chrome-extension://mhjfbmdgcfjbbpaeojofohoefgiehjai/index.html?' + src);
+      'chrome-extension://mhjfbmdgcfjbbpaeojofohoefgiehjai/index.html?' +
+      isMac + src);
   // Prevent the frame from being tab-focusable.
   iframe.setAttribute('tabindex', '-1');
   var client = new PDFScriptingAPI(window);

chrome/browser/resources/pdf/scrollbars_mac.css

+/* Copyright 2015 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file. */
+
+/*
+ * Imitate mac scrollbars on non-retina displays to workaround crbug.com/466039.
+ */
+@media
+(-webkit-max-device-pixel-ratio: 1) {
+
+::-webkit-scrollbar {
+  height: 14px;
+  width: 14px;
+}
+
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-corner {
+  background-color: rgb(242,242,242);
+}
+
+::-webkit-scrollbar-thumb:vertical,
+::-webkit-scrollbar-thumb:horizontal {
+  -webkit-border-radius: 7px;
+  background-color: rgb(198,198,198);
+  border: 3px solid rgb(242,242,242);
+}
+
+::-webkit-scrollbar-thumb:vertical:hover,
+::-webkit-scrollbar-thumb:horizontal:hover {
+  background-color: rgb(126,126,126);
+}
+
+}