📜 ⬆️ ⬇️

Web Developer - how to fix View Image Information

At some point, Web Developer 's all-in-one ceased to display background images in the Graphics → Image Information section. If, for example, look at the information about the images of the site webo.in , we will not see anything there, except for the icon. Where are the menu icons, logo, banner and Ivashka from the Palace of Pioneers? On the offsite there is a record of this bug and several topics on the forum , one already 2006.

Let's try to fix it.

Go to the profile folder, then extensions / {c45c406e-ab73-11d8-be73-000a95be3b12} . This is an extension folder. We are interested in the functionality in the form of scripts packed in chrome / webdeveloper.jar , unpack it (in the chrome should appear the folder content , locale and skin ). Now you need to make the browser use the unpacked content, for this we will correct chrome.manifest in the root folder, replacing all the jar references there : chrome / webdeveloper.jar! on just chrome . To be sure, we delete or rename the .jar file, restart the browser and check the operation of the extension. While everything works.
')
Now let's pay attention to the content folder, which we extracted from a .jar archive, more precisely, to the contents of the webdeveloper folder attached to it. You can get into the webdeveloper.xul file that we saw in the manifest in the overlay line, find the menu item in it and see what it has in the oncommand . And you can notice, among other things, the images.js file (most likely, it is he who is responsible for the operations with graphics) and look for information in it. Both the one and the other way quickly lead us to the webdeveloper_viewImageInformation () function, in which we see the following line:

imageList = webdeveloper_getImagesForDocument(pageDocument, true, true); 

We find this function in the content / webdeveloper / common / dom.js file and look at the code responsible for selecting background images:

 else if(includeBackgroundImages) { computedStyle = element.ownerDocument.defaultView.getComputedStyle(element, null); // If the computed style is set if(computedStyle) { backgroundImage = computedStyle.getPropertyCSSValue("background-image"); // If this element has a background image and it is a URI if(backgroundImage && backgroundImage.primitiveType == cssURI) { image = new Image(); image.src = backgroundImage.getStringValue(); // If this is not a chrome image if(image.src.indexOf("chrome://") != 0) { images.push(image); } } } } 

Obviously, a snag somewhere in this place. I don't know how to debug extensions, so I just added a couple of alerts and found out that the primitiveType property being checked is always undefined . Let's look at the documentation : the CSSValue object has the cssValueType property, and, according to the logic of the things and the author of the extension, the background-image has to be equal to CSS_PRIMITIVE_VALUE (1). However, in practice it turns out to be equal to CSS_VALUE_LIST (2), why it is not clear. But God bless him, look at the CSSValueList interface, which implements our object in this case. It has an item () method that returns a CSSValue object, and use it:

 else if(includeBackgroundImages) { computedStyle = element.ownerDocument.defaultView.getComputedStyle(element, null); // If the computed style is set if(computedStyle) { backgroundImage = computedStyle.getPropertyCSSValue("background-image"); // If this element has a background image if(backgroundImage) { // If property is CSSValueList (WTF?) if (backgroundImage.cssValueType == backgroundImage.CSS_VALUE_LIST) { backgroundImage = backgroundImage.item(0); } // If background image is a URI if (backgroundImage.primitiveType == cssURI) { image = new Image(); image.src = backgroundImage.getStringValue(); } // If this is an image and not a chrome image if(image && image.src && image.src.indexOf("chrome://") != 0) { images.push(image); } } } } 

Now, when detecting CSSValueList, we replace the backgroundImage object with its first element and work with it as before. Restart the browser and check - voila! 14 pictures, including data: URI . Now you can pack the contents of the extension folder in a zip-archive, give it the extension .xpi and use it for installation in the future.

Update: FF 3.6–4.0b12, Web Developer 1.1.9, Windows 7.

Source: https://habr.com/ru/post/114960/


All Articles