As a developer, one drawback of using Google Web Toolkit (GWT) for the oVirt Administration Portal (aka webadmin) is that the GWT compile process takes an exceptionally long time. If you make a change in some code and rebuild the ovirt-engine project using make install-dev ..., you’ll be waiting several minutes to test your change. In practice, such a long delay in the usual code-compile-refresh-test cycle would be unbearable.

Luckily, we can use GWT Super Dev Mode (“SDM”) to start up a quick refresh-capable instance of the application. With SDM running, you can make a change in GWT and test the refreshed change within seconds.

If you want to step through code and use the Chrome debugger, oVirt and SDM don’t work well together for debugging due to the oVirt Administration Portal’s code and source map size. Therefore, below we demonstrate how to disable source maps.

Demo (40 seconds)

demo

Steps

  1. Open a terminal, build the engine normally, and start it.

     make clean install-dev PREFIX=$HOME/ovirt-engine DEV_EXTRA_BUILD_FLAGS_GWT_DEFAULTS="-Dgwt.cssResourceStyle=pretty -Dgwt.userAgent=safari" BUILD_UT=0 DEV_EXTRA_BUILD_FLAGS="-Dgwt.compiler.localWorkers=1"

 ...

 $HOME/ovirt-engine/share/ovirt-engine/services/ovirt-engine/ovirt-engine.py start

    screen

    screen

    screen

  2. In a second terminal, run:

    Chrome:

     make gwt-debug DEV_BUILD_GWT_SUPER_DEV_MODE=1 DEV_EXTRA_BUILD_FLAGS_GWT_DEFAULTS="-Dgwt.userAgent=safari"

    or

    Firefox:

     make gwt-debug DEV_BUILD_GWT_SUPER_DEV_MODE=1 DEV_EXTRA_BUILD_FLAGS_GWT_DEFAULTS="-Dgwt.userAgent=gecko1_8"

    screen

    Wait about two minutes until “code server running at http://<>:9876/” displays, and then the GWT Dev Mode app will open.

    screen

  3. Open your browser and go to http://localhost:9876/ *You must use localhost. The procedure breaks with IPs.

    Now you’ll see two buttons, Dev Mode On and Dev Mode Off.

    screen

    Drag those buttons to the browser bookmark bar, as it says on that page.

    screen

  4. Ignore the link under the two buttons. Instead, open another browser window and enter http://localhost:8080 in the address bar to go to webadmin.

    screen

  5. Log in and navigate to the Administration Portal.

  6. [Chrome only] Press F12 and click the hamburger menu, followed by Settings. Disable both JavaScript and CSS source maps. The Administration Portal is too large and the source maps crash Chrome.

    screen

    screen

    screen

  7. Click Dev Mode On

    screen

  8. Drag the Compile button to your bookmarks bar

    screen

  9. Click Compile

    screen

    The first compilation is slow, taking up to two minutes.

  10. Make a change to the GWT code. Here I am creating a new “About” dialog box that has an image as a background. I will tweak the font properties of the dialog’s Close button to demonstrate the refresh.

    Before:

    screen

    screen

    Change:

    screen

    Let’s test.

  11. Click Compile. Make sure it says “On”. If it doesn’t, did you use localhost above?

    screen

    screen

    In the second terminal, you will see:

      Link succeeded
  [INFO]          Linking succeeded -- 3.654s
  [INFO]       7.537s total -- Compile completed

The browser should refresh, and the app will now display the change.
screen