[Blink] Display images on a dark background

third_party/WebKit/Source/core/html/ImageDocument.cpp

Index: third_party/WebKit/Source/core/html/ImageDocument.cpp
diff --git a/third_party/WebKit/Source/core/html/ImageDocument.cpp b/third_party/WebKit/Source/core/html/ImageDocument.cpp
index a3d63fca4c7b905591e9d751fec82c526f22ccf4..e46e44290053c192c8124dc7b429c8bd91c6f549 100644
--- a/third_party/WebKit/Source/core/html/ImageDocument.cpp
+++ b/third_party/WebKit/Source/core/html/ImageDocument.cpp
@@ -200,6 +200,27 @@ DocumentParser* ImageDocument::createParser() {
   return ImageDocumentParser::create(this);
 }
 
+void ImageDocument::finishedParsing() {

[pdr., 2016/10/26 03:59:06]

This isn't your fault but I think the call to finishedParsing in
ImageDocumentParser is a bug.

Document::finishedParsing kicks off the DOMContentLoaded event which is
generally when the document has finished loading but resources may still be
coming in. It makes sense for HTMLViewSourceParser to call Document::finish
because there are no subresources to load, but I don't think it's right for
ImageDocumentParser. I wonder if this is related to why we weren't getting the
onload event?

What do you think of the following tweak to this patch which avoids adding a
virtual to Document?
1) Add "void ImageDocument::imageLoaded()" which changes the background.
2) In the cachedImage() conditional in ImageDocumentParser::finish(), add a call
to document()->imageLoaded().

+  Document::finishedParsing();
+
+  // Images appear on of a checkerboard background rendered via CSS.
+  // This needs to be set when the image is finished loading.
+  if (shouldShrinkToFit()) {
+    StringBuilder imageStyle;
+    imageStyle.append(m_imageElement->getAttribute(styleAttr));
+    imageStyle.append(
+        "background-position: 0px 0px, 8px 8px;"
+        "background-size: 16px 16px;"
+        "background-color: white;"
+        "background-image:"
+        "linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, "
+        "#eee 75%, #eee 100%),"
+        "linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, "
+        "#eee 75%, #eee 100%);");
+    m_imageElement->setAttribute(styleAttr, imageStyle.toAtomicString());
+  }
+}
+
 void ImageDocument::createDocumentStructure() {
   HTMLHtmlElement* rootElement = HTMLHtmlElement::create(*this);
   appendChild(rootElement);
@@ -218,7 +239,7 @@ void ImageDocument::createDocumentStructure() {
 
   if (shouldShrinkToFit()) {
     // Display the image prominently centered in the frame.
-    body->setAttribute(styleAttr, "margin: 0px;");
+    body->setAttribute(styleAttr, "margin: 0px; background: #0e0e0e;");
 
     // See w3c example on how to centering an element:
     // https://www.w3.org/Style/Examples/007/center.en.html
@@ -246,7 +267,7 @@ void ImageDocument::createDocumentStructure() {
   StringBuilder imageStyle;
   imageStyle.append("-webkit-user-select: none;");
   if (shouldShrinkToFit() && m_shrinkToFitMode == Viewport)
-    imageStyle.append("max-width: 100%");
+    imageStyle.append("max-width: 100%;");
   m_imageElement = HTMLImageElement::create(*this);
   m_imageElement->setAttribute(styleAttr, imageStyle.toAtomicString());
   m_imageElement->setLoadingImageDocument();
@@ -260,9 +281,9 @@ void ImageDocument::createDocumentStructure() {
     // Add event listeners
     EventListener* listener = ImageEventListener::create(this);
     if (LocalDOMWindow* domWindow = this->domWindow())
-      domWindow->addEventListener("resize", listener, false);
+      domWindow->addEventListener(EventTypeNames::resize, listener, false);
     if (m_shrinkToFitMode == Desktop)
-      m_imageElement->addEventListener("click", listener, false);
+      m_imageElement->addEventListener(EventTypeNames::click, listener, false);
   }
 
   rootElement->appendChild(head);