Open Bug 1327698 Opened 6 years ago Updated 6 months ago

Context menu for <canvas> element's openning tag should allow to access the image

Categories

(DevTools :: Inspector, enhancement, P3)

enhancement

Tracking

(Not tracked)

UNCONFIRMED

People

(Reporter: arni2033, Unassigned)

Details

>>>   My Info:   Win7_64, Nightly 49, 32bit, ID 20160526082509
STR_1:
1. Open http://spaceflipper.madebyfibb.com (or any other canvas with that displays image you can save)
2. Right-click on the center of canvas, click "Inspect element" in context menu
3. Right-click the openning tag of selected element in inspector twice (bug 1201831)

AR:
 Step 2 - context menu of <canvas> element allows to view and save image
 Step 3 - tooltip with image (!) appears near <canvas> element in markup, but context menu of <canvas>
          element in markup doesn't allow to access
ER:  Either X or Y
 X) Step 3 - context menu should show additional menuitems "Open Image in New Tab" or "View Image"
             or "Copy Image" or "Copy Image as Data URI"
 Y) There should be another easy way to access image drawn in <canvas> element if it's possible 
   (unlike in bug 749824 it seems), from inspector. "Screenshot node" is not suitable, because
    screenshot contains some other elements covering original <canvas> element. See Note 2



Notes:
1) Apparently (bug 749824 comment 33) accessing image is impossible even via normal context menu
2) There's really a work around, but it seems too long. Also there're some cases (C) that require me
   to use that same workaround anyway:

   A) Sometimes I as developer want to get image in current <canvas> element
     (it's covered by some buttons/other <canvas> elements with irrelevant stuff)
      In this case I can do the same as in case (C), but I'd prefer to have (X)

   B) Sometimes I want to get screenshot of a containter with several elements including given canvas
     (it's covered by some buttons/other <canvas> elements with relevant stuff / parts of image)
      In this case, I would just right-click the container and choose "Screenshot node"
      
   C) Sometimes I want to get screenshot of a containter with some children but not other
     (several <canvas> elements display relevant stuff, some other elements align above them and
      display irrelevant stuff, like zoom in/out buttons, fullscreen button etc)
      In this case I have_to hide all irrelevant elements and make screenshot of the container node.
Component: Untriaged → Developer Tools: Animation Inspector
No longer blocks: 1277113
Component: Developer Tools: Animation Inspector → Developer Tools: Inspector
Inspector bug triage. Filter on CLIMBING SHOES.
Priority: -- → P3
Product: Firefox → DevTools
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.