Vaadi application - page source

Hello everyone,

I built a small vaadin application. There is something which I don’t understand. When I use different components like
Labels or Buttons,
they are not visible in the page source. Also when I load data from my
database and display them in the
, this has no effect to the content-length of my site. I always get the following page source[code]
<!doctype html>

html, body {height:100%;margin:0;}
You have to enable javascript in your browser to use an application built with Vaadin.
//<![CDATA[ if (!window.vaadin) alert("Failed to load the bootstrap javascript: ./VAADIN/vaadinBootstrap.js?v=7.7.3"); if (typeof window.__gwtStatsEvent != 'function') { vaadin.gwtStatsEvents = []; window.__gwtStatsEvent = function(event) {vaadin.gwtStatsEvents.push(event); return true;}; } vaadin.initApplication("ROOT-2521314",{ "theme": "mytheme", "versionInfo": { "vaadinVersion": "7.7.3", "atmosphereVersion": "2.2.9.vaadin2" }, "widgetset": "com.vaadin.DefaultWidgetSet", "widgetsetReady": true, "comErrMsg": { "caption": "Communication problem", "message": "Take note of any unsaved data, and click here or press ESC to continue.", "url": null }, "authErrMsg": { "caption": "Authentication problem", "message": "Take note of any unsaved data, and click here or press ESC to continue.", "url": null }, "sessExpMsg": { "caption": "Session Expired", "message": "Take note of any unsaved data, and click here or press ESC key to continue.", "url": null }, "vaadinDir": "./VAADIN/", "debug": true, "standalone": true, "heartbeatInterval": 300, "serviceUrl": "." }); [/code]I need to send HTTP requests to get the content-length. But in this situation it is always the same. Is there a way to change this page source or this the usual way? In case I can edit something, where do I have to do this? In some [b] .xml files? [/b] Please help! Best regards, Nazar Medeiros

The “View source”-functionality of the browser just shows you the initial page-source as received from the server. In Vaadin-application some serious javascript-mangling of that source occurs prior to displaying anything. You should try Chrome DevTools or Firefox Firebug, which will give you a live-view on the DOM. There you will also see all modifications that got done by javascript.

Ok… so when I understood this correcty, it is the usual way that the initial page-source appears? Is there a way to change this? I ask because I have a problem: I have a java program which sends HTTP-requests with a payload to my site. Now… how do I get the “actual” content with the Labels and Button etc. instead of the initial page?

You recommend me to use Firefox Firebug or Chrome Dev Tools but how can I change my java HTTP-requests in a way that all modifications can be displayed?

Please help!
Best regards,
Nazar Medeiros


If I’m reading you correctly, at the very least, you’ll need something that can run JavaScript. Something like a headless browser might do the trick, but really it sounds like a pretty complicated scenario.


Looks like a broken architecture for me. You should not need to interact with the UI if you want another program to send data into your app. Think about establishing a SOAP-/REST-interface for your business-logic on the server-side.

I guess this is correct. Thank you!