Directory

← Back

ScreenDump

Takes a screen dump of the HTML in browser

Author

Rating

Popularity

<100

The ScreenDumper is an invisible component that, when requested with takeDump(), takes the entire HTML tree in the browser and sends it back to the server. You can use a ScreenDumpListener to receive the dump.

This could be used for various purposes, such as generating PDF from HTML on the server-side, replacement for taking screenshots, for debugging, support purposes, etc.

You can view a dump almost directly in a static HTML page by putting it inside a element. You have to 1) remove the Vaadin loader scripts from the beginning of the element, and 2) put all the application and Vaadin themes to the proper location in the server.

Experimental, tested so far only on Firefox 4, but should work in others as well.

Works only in Vaadin 6. Taking screen dumps is so much easier in Vaadin 7 that the add-on is probably not even needed. See the code example below.

Sample code

// Add an invisible dumper component
final ScreenDumper dumper = new ScreenDumper();
mainWindow.addComponent(dumper);

// Initiate a dump
Button takeDump = new Button("Take a Dump");
takeDump.addListener(new ClickListener() {
    
    private static final long serialVersionUID = 2613016819047484879L;

    public void buttonClick(ClickEvent event) {
        dumper.takeDump();
    }
});
mainWindow.addComponent(takeDump);

final Panel dumpResult = new Panel("Dump Result");
dumpResult.setWidth("100em");
dumpResult.setHeight("40em");
dumpResult.setVisible(false);
dumpResult.addStyleName("dumpresult");
dumpResult.getContent().setSizeUndefined(); // To get horizontal scrollbar
mainWindow.addComponent(dumpResult);

// Receive a dump
dumper.addListener(new ScreenDumpListener() {
    private static final long serialVersionUID = -8856181654249953320L;

    public void screenDump(ScreenDumpEvent event) {
        dumpResult.getContent().removeAllComponents();
        Label dumpLabel = new Label(event.getDump(), Label.CONTENT_PREFORMATTED);
        dumpLabel.setSizeUndefined();
        dumpResult.addComponent(dumpLabel);
        dumpResult.setVisible(true);
    }
});
// ScreenDump probably won't be ported to Vaadin 7 as it's so easy to take a screen dump
// without the necessity of a widget.
// Note though that the dumped HTML contains the Vaadin Client Engine loading code, which
// must be stripped out if you want to view a dump in a browser.

// Panel to display HTML of dumped content
final Panel panel = new Panel("Dumped Content");
panel.setWidth("640px");
panel.setHeight("400px");
final Label dumpContent = new Label();
panel.setContent(dumpContent);
layout.addComponent(panel);

// Handle dump content from server-side
Page.getCurrent().getJavaScript().addFunction("dumpcontent",
    new JavaScriptFunction() {
    @Override
    public void call(JSONArray arguments)
            throws JSONException {
        // Display the dumped HTML as text
        dumpContent.setValue(arguments.getString(0));
    }
});
       
// Button for dumping the content
Button takeadump = new Button("Take a Dump");
takeadump.addClickListener(new ClickListener() {
    @Override
    public void buttonClick(ClickEvent event) {
        Page.getCurrent().getJavaScript().execute(
            "dumpcontent(document.documentElement.innerHTML)");
    }
});
layout.addComponent(takeadump);

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Initial release of the experimental version.

Released
2011-04-14
Maturity
EXPERIMENTAL
License
Apache License 2.0

Compatibility

Framework
Vaadin 6.5+
Browser
Firefox

ScreenDump - Vaadin Add-on Directory

Takes a screen dump of the HTML in browser ScreenDump - Vaadin Add-on Directory
The ScreenDumper is an invisible component that, when requested with takeDump(), takes the entire HTML tree in the browser and sends it back to the server. You can use a ScreenDumpListener to receive the dump. This could be used for various purposes, such as generating PDF from HTML on the server-side, replacement for taking screenshots, for debugging, support purposes, etc. You can view a dump almost directly in a static HTML page by putting it inside a element. You have to 1) remove the Vaadin loader scripts from the beginning of the element, and 2) put all the application and Vaadin themes to the proper location in the server. Experimental, tested so far only on Firefox 4, but should work in others as well. Works only in Vaadin 6. Taking screen dumps is so much easier in Vaadin 7 that the add-on is probably not even needed. See the code example below.
Author Homepage
Online Demo
Source Code
Taking a Dump in Vaadin 7

ScreenDump version 0.1.0
Initial release of the experimental version.

Online