This is an awesome feature, I love how browser dev tools have been continuously improving in recent years. Taking screenshots of DOM elements has been something I've dedicated a lot of time to recently. Most of the extensions available for doing this rely on taking a screenshot of the available viewport so in order to capture larger DOM elements they need to scroll around taking repeated screenshots (which can be kind of frustrating if it takes a long time).
We just launched a browser extension [0] for taking screenshots of Facebook posts and we were basically tasked with accomplishing the same thing. We approached it by fetching all of the external resources and inlining them as data URIs, wrapping the HTML in an SVG element, drawing the SVG to a canvas, and finally extracting the data URI for the canvas. It works really well and eliminates the jitter/delay associated with scrolling around to capture multiple screenshots.
Good thing we also automate the anonymization of private information or this announcement might have obsoleted us on Firefox :-).