Closed
Bug 964014
Opened 11 years ago
Closed 11 years ago
Add "Copy as data URI" for images in the Inspector
Categories
(DevTools :: Inspector, defect)
DevTools
Inspector
Tracking
(Not tracked)
RESOLVED
FIXED
Firefox 29
People
(Reporter: vporof, Assigned: pbro)
References
Details
Attachments
(1 file)
(deleted),
patch
|
harth
:
review+
|
Details | Diff | Splinter Review |
This is useful.
Assignee | ||
Comment 1•11 years ago
|
||
I wanted to file this bug at the same time :)
Indeed, useful, and easy.
- The inspector has a contextual menu (in inspector.xul): inspectorPopupSet. It's easy enough to add one item in there "copy as data-uri" that would be enabled only for image nodes.
- NodeActor objects have a handy method called getImageData() that returns the data-uri for any image node.
- We can import the nsIClipboardHelper service and use its copyString method to get the data-uri into the user's clipboard!
Assignee | ||
Updated•11 years ago
|
Assignee: nobody → pbrosset
Assignee | ||
Updated•11 years ago
|
Assignee | ||
Comment 2•11 years ago
|
||
This patch adds the following things:
- new menuitem in the inspector.xul menupopup
- logic in inspector-panel.js to switch that item on and off depending if the selected node is an image or canvas or not
- new function in markup-view.js to actually do the copy, this function sends a request to the NodeActor to get the image data (the getImageData actor method was already present)
- a new mochitest
Attachment #8367172 -
Flags: review?(fayearthur)
Updated•11 years ago
|
Attachment #8367172 -
Flags: review?(fayearthur) → review+
Assignee | ||
Comment 3•11 years ago
|
||
Thanks Heather for the review.
I forgot to paste the try build URL earlier: https://tbpl.mozilla.org/?tree=Try&rev=1583487f6118
It's all green.
So I'm going to check this in now.
Assignee | ||
Comment 4•11 years ago
|
||
Fixed in fx-team: https://hg.mozilla.org/integration/fx-team/rev/16dbb9ba6d52
Whiteboard: [fixed-in-fx-team]
Comment 6•11 years ago
|
||
Status: NEW → RESOLVED
Closed: 11 years ago
Flags: in-testsuite+
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 29
Comment 7•11 years ago
|
||
I'm not sure how to translate "Copy Image Data-URL". How is it different from "Copy Image URL"?
Assignee | ||
Comment 8•11 years ago
|
||
(In reply to Eduardo Trápani from comment #7)
> I'm not sure how to translate "Copy Image Data-URL". How is it different
> from "Copy Image URL"?
It is different because the image url points to the original resource on its server, whereas the image data-url contains the image itself.
A data-url looks like this: data:image/png;base64,iVBORw0KGgoAA....
Since it's a standard url, it can be used in the browser location bar, or as a background-image in a CSS stylesheet for example, but instead of pointing to a remote resource, it actually contains the data of the image (encoded in base64).
So clicking on "Copy Image Data-URL" will actually extract the data from the image, and turn it into a data-url.
Comment 9•11 years ago
|
||
> It is different because the image url points to the original resource on its
> server, whereas the image data-url contains the image itself.
Ok, now I get it, thanks.
Updated•6 years ago
|
Product: Firefox → DevTools
You need to log in
before you can comment on or make changes to this bug.
Description
•