Bug 460146 - CSS3 border-image images should appear in Page Info ? Media. r=db48x
☠☠ backed out by 710c9b8252fb ☠ ☠
authorMaxim Iorsh <iorsh@users.sourceforge.net>
Wed, 25 Jan 2012 18:49:23 -0800
changeset 86648 2e37e7223aa3bc75d90157c1dfccb027d42a9b87
parent 86647 59f3e45dc542f576aa372feaa57aa677198f7a76
child 86649 a89575b19f6c58f34161a81ba2c4f9ff1b60b9e6
push id805
push userakeybl@mozilla.com
push dateWed, 01 Feb 2012 18:17:35 +0000
treeherdermozilla-aurora@6fb3bf232436 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdb48x
bugs460146
milestone12.0a1
Bug 460146 - CSS3 border-image images should appear in Page Info ? Media. r=db48x
browser/base/content/pageinfo/pageInfo.js
browser/base/content/test/Makefile.in
browser/base/content/test/browser_bug460146.js
browser/locales/en-US/chrome/browser/pageInfo.properties
--- a/browser/base/content/pageinfo/pageInfo.js
+++ b/browser/base/content/pageinfo/pageInfo.js
@@ -279,16 +279,19 @@ var onUnloadRegistry = [ ];
  */
 function onLoadPageInfo()
 {
   gBundle = document.getElementById("pageinfobundle");
   gStrings.unknown = gBundle.getString("unknown");
   gStrings.notSet = gBundle.getString("notset");
   gStrings.mediaImg = gBundle.getString("mediaImg");
   gStrings.mediaBGImg = gBundle.getString("mediaBGImg");
+  gStrings.mediaBorderImg = gBundle.getString("mediaBorderImg");
+  gStrings.mediaListImg = gBundle.getString("mediaListImg");
+  gStrings.mediaCursor = gBundle.getString("mediaCursor");
   gStrings.mediaObject = gBundle.getString("mediaObject");
   gStrings.mediaEmbed = gBundle.getString("mediaEmbed");
   gStrings.mediaLink = gBundle.getString("mediaLink");
   gStrings.mediaInput = gBundle.getString("mediaInput");
 #ifdef MOZ_MEDIA
   gStrings.mediaVideo = gBundle.getString("mediaVideo");
   gStrings.mediaAudio = gBundle.getString("mediaAudio");
 #endif
@@ -608,23 +611,45 @@ function addImage(url, type, alt, elem, 
     gImageView.data[i][COL_IMAGE_COUNT]++;
     if (elem == gImageElement)
       gImageView.data[i][COL_IMAGE_NODE] = elem;
   }
 }
 
 function grabAll(elem)
 {
-  // check for background images, any node may have multiple
+  // check for images defined in CSS (e.g. background, borders), any node may have multiple
   var computedStyle = elem.ownerDocument.defaultView.getComputedStyle(elem, "");
+
   if (computedStyle) {
-    Array.forEach(computedStyle.getPropertyCSSValue("background-image"), function (url) {
-      if (url.primitiveType == CSSPrimitiveValue.CSS_URI)
-        addImage(url.getStringValue(), gStrings.mediaBGImg, gStrings.notSet, elem, true);
-    });
+    var addImgFunc = function (label, val) {
+      if (val.primitiveType == CSSPrimitiveValue.CSS_URI) {
+        addImage(val.getStringValue(), label, gStrings.notSet, elem, true);
+      }
+      else if (val.primitiveType == CSSPrimitiveValue.CSS_STRING) {
+        // This is for -moz-image-rect.
+        // TODO: Reimplement once bug 714757 is fixed
+        var strVal = val.getStringValue();
+        if (strVal.search(/^.*url\(\"?/) > -1) {
+          url = strVal.replace(/^.*url\(\"?/,"").replace(/\"?\).*$/,"");
+          addImage(url, label, gStrings.notSet, elem, true);
+        }
+      }
+      else if (val.cssValueType == CSSValue.CSS_VALUE_LIST) {
+        // recursively resolve multiple nested CSS value lists
+        for (var i = 0; i < val.length; i++)
+          addImgFunc(label, val.item(i));
+      }
+    };
+
+    addImgFunc(gStrings.mediaBGImg, computedStyle.getPropertyCSSValue("background-image"));
+    addImgFunc(gStrings.mediaBorderImg, computedStyle.getPropertyCSSValue("-moz-border-image"));
+    // TODO: support unprefixed "border-image" once bug 713643 is fixed.
+    addImgFunc(gStrings.mediaListImg, computedStyle.getPropertyCSSValue("list-style-image"));
+    addImgFunc(gStrings.mediaCursor, computedStyle.getPropertyCSSValue("cursor"));
   }
 
   // one swi^H^H^Hif-else to rule them all
   if (elem instanceof HTMLImageElement)
     addImage(elem.src, gStrings.mediaImg,
              (elem.hasAttribute("alt")) ? elem.alt : gStrings.notSet, elem, false);
   else if (elem instanceof SVGImageElement) {
     try {
--- a/browser/base/content/test/Makefile.in
+++ b/browser/base/content/test/Makefile.in
@@ -113,16 +113,17 @@ endif
                  browser_bug422590.js \
                  browser_bug424101.js \
                  browser_bug427559.js \
                  browser_bug432599.js \
                  browser_bug435035.js \
                  browser_bug441778.js \
                  browser_popupNotification.js \
                  browser_bug455852.js \
+                 browser_bug460146.js \
                  browser_bug462673.js \
                  browser_bug477014.js \
                  browser_bug479408.js \
                  browser_bug479408_sample.html \
                  browser_bug481560.js \
                  browser_bug484315.js \
                  browser_bug491431.js \
                  browser_bug495058.js \
new file mode 100644
--- /dev/null
+++ b/browser/base/content/test/browser_bug460146.js
@@ -0,0 +1,51 @@
+/* Check proper image url retrieval from all kinds of elements/styles */
+
+function test() {
+  waitForExplicitFinish();
+
+  gBrowser.selectedTab = gBrowser.addTab();
+  
+  gBrowser.selectedBrowser.addEventListener("load", function () {
+    gBrowser.selectedBrowser.removeEventListener("load", arguments.callee, true);
+
+    var doc = gBrowser.contentDocument;
+    var pageInfo = BrowserPageInfo(doc, "mediaTab");
+
+    pageInfo.addEventListener("load", function () {
+      pageInfo.removeEventListener("load", arguments.callee, true);
+      pageInfo.onFinished.push(function () {
+        executeSoon(function () {
+          var imageTree = pageInfo.document.getElementById("imagetree");
+          var imageRowsNum = imageTree.view.rowCount;
+
+          ok(imageTree, "Image tree is null (media tab is broken)");
+
+          ok(imageRowsNum == 7, "Number of images listed: " +
+                                imageRowsNum + ", should be 7");
+
+          pageInfo.close();
+          gBrowser.removeCurrentTab();
+          finish();
+        });
+      });
+    }, true);
+  }, true);
+
+  content.location =
+    "data:text/html," +
+    "<html>" +
+    "  <head>" +
+    "    <title>Test for media tab</title>" +
+    "    <link rel='shortcut icon' href='file:///dummy_icon.ico'>" + // Icon
+    "  </head>" +
+    "  <body style='background-image:url(about:logo?a);'>" + // Background
+    "    <img src='file:///dummy_image.gif'>" + // Image
+    "    <ul>" +
+    "      <li style='list-style:url(about:logo?b);'>List Item 1</li>" + // Bullet
+    "    </ul>  " +
+    "    <div style='-moz-border-image: url(about:logo?c) 20 20 20 20;'>test</div>" + // Border
+    "    <a href='' style='cursor: url(about:logo?d),default;'>test link</a>" + // Cursor
+    "    <object type='image/svg+xml' width=20 height=20 data='file:///dummy_object.svg'></object>" + // Object
+    "  </body>" +
+    "</html>";
+}
--- a/browser/locales/en-US/chrome/browser/pageInfo.properties
+++ b/browser/locales/en-US/chrome/browser/pageInfo.properties
@@ -46,16 +46,19 @@ unknown=Unknown
 notset=Not specified
 yes=Yes
 no=No
 
 mediaImg=Image
 mediaVideo=Video
 mediaAudio=Audio
 mediaBGImg=Background
+mediaBorderImg=Border
+mediaListImg=Bullet
+mediaCursor=Cursor
 mediaObject=Object
 mediaEmbed=Embed
 mediaLink=Icon
 mediaInput=Input
 mediaFileSize=%S KB
 mediaSize=%Spx \u00D7 %Spx
 mediaSelectFolder=Select a Folder to Save the Images
 mediaBlockImage=Block Images from %S