LDSTechForumProjects

GWT Intro Lab 2

GWT Development Mode

This lab assumes you have done Lab 1.

Run Development Mode

To use GWT Development Mode in Eclipse you must do the following:

  1. From the drop down menus, select Run | Run Configurations....
  2. Select Eclipse google web application.png from the list of options and then select the Eclipse new launch configuration.png icon to create a new launch configuration.
  3. Give your launch configuration a Name: of something like "Hello GWT World".
  4. Select the Eclipse gwt tab.png tab.
  5. On the URL: field select the Browse... button. Select the .html file under your module and push the OK button.
  6. Select the Run button.

This will launch the GWT Development Mode shell.

Open your GWT app using the Development Mode shell

To bring your application up using the GWT Development Mode shell, do the following:

  1. Select the Launch Default Browser button. This should launch your web browser.
  2. When you web browser comes up, it will prompt you to install a plug-in from Google. Follow the directions for your browser for installing this plug-in.
  3. Once the plug-in is installed your index.html page should come up similar to when we loaded the page after compiling your GWT module.

Experience the awesomeness of Development Mode

  1. Go back to the LDS Tech IDE and modify your entry point so that the alert displays the string "GWT Development Mode is Cool!"
  2. Save your change.
  3. Go back to your browser and reload the page.
  4. Your page should have bring up an alert with the new string.

Debugging in Development Mode

To make debugging more interesting, let's modify the entry point to look like the following:

@Override
public void onModuleLoad() {
    int total = 0;
    String str = "";
    for (int i = 0; i < 10; i++) {
        str += " " + i;
        total += i;
    }
    com.google.gwt.user.client.Window.alert(str + " " + total);
}
  1. Shutdown the GWT Development Mode shell.
  2. Place a breakpoint on the first line of your onModuleLoad() method.
  3. Start the GWT Development Mode shell in debug mode by selecting from the drop down menus Run | Debug.
  4. Reload your page, you will be prompted to changed to the debug perspective by the LDSTech IDE; do so. You may also see a warning in your browser indicating that the script is taking a long time. Disregard this message. It is unreasonable for the browser to expect you to be able to debug so quickly.
  5. Step through your code in the LDSTech IDE. Notice how this is the same experience as debugging any other Java application.
  6. After stepping over your code, resume your JVM by pushing the F8 key.
This page was last modified on 8 June 2010, at 21:20.

Note: Content found in this wiki may not always reflect official Church information. See Terms of Use.