Sencha Ext JS 7.7 is Here – Discover What’s New and Exciting – LEARN MORE

Getting Started with GWT Super Dev Mode

July 23, 2014 156 Views

Super Dev ModeIf you’ve been using GWT in the last few months, you’ve undoubtedly noticed that various browsers have been removing support for classic Dev Mode. This change has been a long time coming. It helps to ensure better performing browsers and plugins, but puts a kink in debugging GWT applications. The future is in Super Dev Mode, so we’ve been testing it regularly, making sure that GXT applications will work correctly in it, and improving the development process.

As of GWT 2.6.1, supported by GXT 3.1, Super Dev Mode works in all browsers on all operating systems. The next version of GWT will continue to streamline the development workflow, but until it gets here, we’ve been working on the Eclipse plugin to streamline getting Super Dev Mode running in your project.

Any project that uses Super Dev Mode must use a linker that supports it. Most projects use the default linker, and up until GWT 2.6.1, that is the ‘std’ linker, which loads the content of the application in an iframe. As of GWT 2.7, this default will change to xsiframe, but for now, we must modify our application to use it:

Using Super Dev Mode or SDM means running two servers, one for the web application and one for the Code Server that compiles classes for SDM when the compile button is pushed on the web page or in the bookmark. So in the future, classic Dev Mode is being modified to include a
-superDevMode argument to start the SDM Code Server for SDM debugging. This means having classic Dev Mode arguments but with SDM debugging all in one launch configuration package. To back port this feature in Google Plugin for Eclipse, a legacy jar is being added and used to override current Dev Mode bootstrapping to provide a seamless transition to the SDM experience.

Start by right clicking on a project and running the “Web Application (GWT SDM)” shortcut, which will create a new launch configuration.

Super Dev Mode

This produces a Development Mode tab that contains a quick link to load the browser for debugging.

Super Dev Mode

Once the browser initializes, it will start the first Super Dev Mode compiling.

Super Dev Mode

While the Code Server provides bookmarks for “Dev Mode on”, “Dev Mode off” and “Compile”, there is a new compile button overlayed on the application that can conveniently compile the application after a change. It’s found in the lower right hand corner of the App. This will recompile and reload the application, and the output can be viewed in Eclipse console.

Super Dev Mode

Changing around launch configuration is done by editing the application launch configuration. Both “Super Development Mode” or “Classic Development Mode“ can be used to debug the application, although Classic Dev Mode will have to use the older browsers.

Super Dev Mode

At this point, you can make changes to your application code and see them in the browser by clicking the “GWT” compile button again. You can also simply refresh the page to reload it without recompiling — handy for testing the app when you aren’t actively making code changes.

Check out this screencast demonstrating the steps above:

At the time this article was written, this new addition to the plugin hadn’t yet shipped, but it will be going out soon. The improvements will make it easier to get started with Super Dev Mode in 2.5.x to 2.6.x+ and streamlines the transition to Super Dev Mode. GWT 2.7 also has more changes to enhance the performance and development experience as well.

coming soon

Something Awesome Is