Google Web Toolkit Blog

Google Plugin for Eclipse (GPE) is Now Open Source

2011-11-16T09:58:00.000-08:00

Today is quite a milestone for the Google Plugin for Eclipse (GPE). Our team is very happy to announce that all of GPE (including GWT Designer) is open source under the Eclipse Public License (EPL) v1.0. GPE is a set of software development tools that enables Java developers to quickly design, build, optimize, and deploy cloud-based applications using the Google Web Toolkit (GWT), Speed Tracer, App Engine, and other Google Cloud services.

Because of the large ecosystem that has developed around GWT, App Engine, and Google’s Cloud services, and because our primary mission is to help users (as opposed to creating proprietary development tools), it makes a lot of sense for us to open source GPE and make it easier for the community to enhance and extend the tools.

According to Red Hat’s Max Andersen, “We have many developers using Google's Eclipse plugin to develop GWT-based applications targeting the JBoss Application Server. With the open sourcing of the plugin we are looking forward to working even more closely with the Google team and the rest of the community on making the developer experience even more productive and an integrated part of Eclipse platform. We are especially interested in seeing the Google Eclipse plugins being able to target multiple runtimes such as the JBoss Enterprise Application Platform and Google App Engine in a uniform way, working more seamlessly with standards-based tools and frameworks.”

As of today, all of the code is available directly from the new GPE project and GWT Designer project on Google Code. Note that GWT Designer itself is based upon the WindowBuilder open source project at Eclipse.org (contributed by Google last year). We will be adopting the same guidelines for contributing code used by the GWT project.

In the months to come we expect to start bringing on more committers, but don't let that stop you from contributing. The project will only grow with the community's input. Submitting bugs via the issue tracker and engaging with other users on the forums will go a long way towards ensuring the overall quality of the product.

GWT and Dart

2011-11-10T07:39:00.000-08:00

The Google Web Toolkit team has been asked recently about our plans following the announcement of the Dart programming language a few weeks ago.

Dart and GWT both share the goal of enabling structured web programming. In fact, many of the same engineers who brought you GWT are working on Dart. We view Dart as an ambitious evolution of GWT’s mission to make web apps better for end users, and we’re optimistic about its potential. As Dart evolves and becomes ready for prime time, we anticipate working closely with the GWT developer community to explore Dart.

Meanwhile, rest assured that GWT will continue to be a productive and reliable way to build the most ambitious web apps — and even games like Angry Birds. Key projects within Google rely on GWT every day, and we plan to continue improving (and open-sourcing) GWT based on their real-world needs.

Pictarine: pictures in the cloud

2011-09-19T11:32:00.000-07:00

Cross posted from the Google App Engine blog.

Pictarine is a photo management web application, launched in 2010, that allows people to easily manage and share all of their photos from Flickr, Picasa, Facebook, Twitter and other sites. Pictarine developers Guillaume Martin and Maxime Rafalimanana have contributed the following post discussing their experiences using Google App Engine and Google Web Toolkit.

From the start, we used Google technologies in developing Pictarine and we wanted to share our experience with them so far. In this post, we will shed some light on the weaknesses and strengths we found in Google Web Toolkit (GWT) and Google App Engine. We will also discuss how we leveraged GWT to build a new technology that allows Pictarine to seamlessly display photos from the computer directly into the browser. The following diagram is an overview of how our application works.

Building a mashup in the cloud with Google App Engine

The Pictarine team is made of a web designer and two developers who previously worked mainly with Java based enterprise technologies and had a little experience with web technologies. When we started the project in early 2009, we were quite open on learning new languages like Python or Ruby, but when App Engine announced that Java would be supported, we were really excited to give Google App Engine a try.

The first few months, learning about the App Engine environment was quite easy and dare I say fun. Testing our code on Google’s servers from Eclipse IDE was only one click away. So we built our first prototype fast and we quickly decided to adopt App Engine. Then we started to build the core of our application: the engine that uses the API from Flickr, Picasa, Facebook to fetch the users’ photos. This is where we hit the first limitations of App Engine. Most users have a lot of photos on these services and retrieving them can take some time. But App Engine has strict limits on how long a request should last: an outgoing HTTP request cannot last more than 10 seconds and cannot process a request for more than 30 seconds. So while building our architecture we found ourselves writing approximately one third of our code dealing with these limitations: paginating our requests, creating background tasks to store data in small batches, etc.

In early 2010, when we launched our alpha version, everything went smoothly. We had some good press coverage and App Engine met our expectations in handling our first users. During 2010, we worked on implementing new features requested by our users, and during this period of time we were really impressed by the way App Engine evolved. Many of the limitations were lifted and great new features were added. We are now able to use Task Queues for requests that last up to 10 minutes, which we fully use to sync our users’ photos and albums. One of the features we like the most is the Channel API, a push notification system that allows us to instantly show a photo in every connected browser as soon as it is uploaded. App Engine is still not perfect but has greatly improved and when we see its roadmap, we are quite confident it will continue to improve.

Building a fresh photo experience with Google Web Toolkit

When we started Pictarine, we wanted a fast, distraction free interface that would allow our users to focus on their photos. We wanted the interface to adapt to the screen resolution, displaying a lot of photos on large screens and fewer on small ones. We wanted it to be automatically updated when new comments or new photos are added. We wanted a web application. As we eliminated Flash quite quickly (based on our user experience...) we started to look at tools to build HTML/CSS/Javascript applications. We settled quickly on GWT: while coding in Java, with all the tools we are used to (even the debugger), we could produce optimized Javacript that would run in every browser! When we started with GWT, it was already 3 years old, so we had few complaints about it. The main issue was that we had to always keep in mind that the Java code we produced was ultimately translated to Javascript. So some Java methods, such as the Reflection API, are not allowed. Another thing that was not obvious to us when we started with GWT was that a java developer needs an intimate knowledge of HTML/CSS if he/she wants to go beyond the basic user interface provided by the GWT widgets.

What we really like about GWT in our architecture is the ability to share code between client and server: we can use the same Photo or Album class on the client and the server and the GWT RPC system allows us to automatically share the same Java object on both side. We can also have the same data validation code on both sides: we can alert the user immediately on errors and still validate the data on the server just in case.

Another great feature we like about GWT is its handling of internationalisation. From the beginning we wanted to build a website available for all Internet users, so supporting English as well as our native language (French) was almost obligatory. Fortunately, GWT makes it really easy to generate centralized localization files so that we just have to translate.

Finally, to illustrate how great Javascript generation is, when IE9 came out, we waited a few weeks for GWT to support it and our application was compatible after a recompile! Of course, the IE9 team also did a good job with their HTML5/CSS3 engine.

Building an universal uploader

After the launch of our alpha in 2010, our users were able to see and share their photos from Flickr, Picasa, Facebook. But they still had to put their photos on these websites first before coming to Pictarine. This limitation quickly became the first request on our feedback system. We needed to let our users do everything from Pictarine, including uploading photos. Uploading many photos from a website is still not a trivial process. Most websites choose Flash to allow users to upload multiple files at once, but our experience with it was that it often crashed after a while. Some use Java applets, but they are never well integrated and always look odd. At Pictarine we decided to tackle this problem by using Java Applet for their stability across all platforms but without using it to render photos or folders.

We have built a technology that uses the GWT RPC mechanism to talk to a Java Applet: photos, upload progression are rendered in HTML/CSS and the applet takes care of photos resizing and uploading. Sharing a photo from a camera is now a one-step process. This technology also allows users to browse their local files directly in their browser and it is fully integrated in our design.

We believe that this new use of Java applets can help blur the line between the Desktop and the Cloud by seamlessly integrating desktop files in any web application.

In conclusion, we can say that we are really happy with the choices we made with App Engine and GWT. App Engine is a great service that perfectly handled the spike in traffic we saw right after articles on Mashable and Lifehacker were published. So we recommend it to every lean startup out there who loves developing in Java, Python or Go.

Working with Maven and RequestFactory in GWT 2.4

2011-09-16T16:28:00.000-07:00

GWT 2.4 introduced changes to both Maven and RequestFactory, and we've recently updated the GWT wiki and sample apps with the latest and greatest:

WorkingWithMaven (with instructions for Eclipse 3.5, 3.6, 3.7)
RequestFactoryInterfaceValidation

RequestFactory now does compile-time validation to ensure that your service implementations match your client-side interfaces. This feature is implemented using an annotation processor which must be configured in Eclipse or in your Maven POM. When configured in Eclipse, you will now see warnings and errors in the IDE anywhere your client- and server-side RF code don't match.

In addition, the RequestFactory jars are now in Maven Central. Note that the Maven groupId for RF artifacts differs from the rest of the GWT artifacts since RF can be used in Android clients as well as GWT. If you're using RequestFactory instead of GWT-RPC, you no longer need gwt-servlet. Instead, you can use the much smaller requestfactory-server jar and requestfactory-apt (which contains the RF interface validation tool). You do not need requestfactory-client for GWT projects as the required classes are already included in gwt-user. The requestfactory-client jar is intended for non-GWT (Android) clients using RequestFactory.

  <dependency>
   <groupId>com.google.web.bindery</groupId>
   <artifactId>requestfactory-server</artifactId>
   <version>2.4.0</version>
  </dependency>
  
  <!-- see sample projects for correct placement -->
  <dependency>
   <groupId>com.google.web.bindery</groupId>
   <artifactId>requestfactory-apt</artifactId>
   <version>2.4.0</version>
  </dependency>

The mobilewebapp and dynatablerf samples show everything working together and have been tested in Eclipse 3.6 and 3.7.

If you also have the Eclipse Subversive plugin installed (see http://www.shareyourwork.org/roller/ralphsjavablog/entry/eclipse_indigo_maven_and_svn), you should be able to try the mobilewebapp sample as easily as

File > Import > Checkout Maven projects from SCM, point to https://google-web-toolkit.googlecode.com/svn/trunk/samples/mobilewebapp
Run as > Web application

Special thanks to Jeff Larsen for the RequestFactory POM sauce that works in Eclipse Indigo!

Tools to help monetize and mobilize your development: Announcing the Google Plugin for Eclipse 2.4

2011-09-08T12:45:00.000-07:00

At this year’s Google I/O conference, we announced a beta version of the Google Plugin for Eclipse that added App Engine Tools for Android developers. A release aimed at removing the friction associated with building installable Android apps that rely on App Engine for server-side support. Since then we’ve not only been working on bug fixes and polish, but we’ve also added a couple of new features and today we’re excited to announce the GA release of GPE and GWT 2.4.

To jump right in, you can download this release from our main GWT download page.

The new features and functionality added since the beta release including the following:

App Engine Tools for Android - Incremental RPC Tooling
For Android developers that want to take advantage of App Engine for their server-side code we’ve added incremental RPC tooling to GPE 2.4. Back at Google I/O we demoed the ability to easily create a connected App Engine and Android project, as well as an RPC layer between the two (using Eclipse-based wizards). In the GA release of GPE 2.4 developers can now add server-side methods to their App Engine code and GPE will generate the necessary serialization and Android code on the fly.

For example, say I have an EmployeeService that exposes typical CRUD methods, but I want to write a custom query that looks for Employees with a start date after some specified date. As a developer all I need to do is write the server-side code and GPE will prompt me to do the rest.

Apps Marketplace Support
In the GA release of GPE 2.4 we’ve also focused on making it easier to monetize apps by adding tooling that allows developers to deploy their apps to the Google Apps Marketplace in the same manner as we enable App Engine deployment. Below are some of the key aspects of this support.

First, GPE 2.4 now has the ability to create a default sample application that will help developers understand how to build an app that utilizes Google APIs (in this case Calendar), handles authentication, and is deployable to the Google Apps Marketplace. The sample is straightforward, prompts the user for the domain it is installed into, and fetches the user’s next 10 calendar entries.

Second, GPE 2.4 helps developers quickly get their applications listed (and updated) within the marketplace by offering an easy-to-use wizard to gather the necessary data, and communicate with the Apps Marketplace backend systems.

GWT Designer Enhancements
We have made lots of exciting GWT Designer enhancements over the last few months as well. In addition to substantial startup and editing speed improvements, we have added split-view editing support for UiBinder so you can now see your UiBinder XML code side-by-side with the rendered layout. Even if you aren't a fan of editing in the design view, you can write code in the source view and see the UI instantly rendered in the design view.

We have also added direct CSS editing from within the GWT Designer property view. This makes it very easy to add new CSS styles or edit existing CSS styles just like any other GWT property.

Want to get started? Download the GA release of GPE and GWT 2.4 here. Note, to try out the App Engine tools for Android you’ll need to install the Android Developer Tools (ADT) plugin as a prerequisite, which can be found here.

If you have any feedback, we’d love to hear it and the GWT/GPE Group is the right place to submit it. The App Engine and Android Developer Groups are also great sources of information.

Chris Ramsdale, Product Manager, Developer Tools cramsdale@google.com

GWT Spotlight: Buxus (Chile)

2011-08-24T13:04:00.000-07:00

Next on our tour of companies building with GWT we head to Latin America, where there has been a lot of recent interest. Based in Santiago, Chile, Buxus is a new personal finance Web app with 20k lines of GWT code and counting.

Chief engineer Andres Arellano cites five major reasons for choosing GWT:

App-oriented

At Buxus, we are building a web based personal finance manager. This kind of application has traditionally been desktop based, but GWT allows us to bring the same responsiveness and ease of use to a web application. GWT RPC allows us to write both front-end and back-end code in the same language and even allows us to code Buxus as if we were coding a desktop application. It also integrates well with standard components like Hibernate.

Optimized code

Every web designer knows that the world of Web browsers is a jungle. With GWT, we can be sure that for every browser, optimal JS code will be generated. Also, advanced features like code splitting and aggressive caching using ClientBundle allow us to ensure that users will enjoy both fast loading times and a snappy UI.

Templates

UI designers don’t want to write Java code to test new UI concepts. Thanks to UiBinder, designers can work with tools that are familiar to them, and programmers can easily bind design templates to their Java code.

Open source

Our workflow is based mostly on open source tools, and GWT’s Apache licensing is definitely a winner for us. Even more important than eliminating license fees, diagnosing bugs in GWT is easier, and providing fixes or adding new features is possible, greatly reducing the risk of getting stuck in our development because of a framework issue. It also means that if the documentation is not clear enough on a certain point, we can dive into the code and figure out what we want.

Active community

Since GWT is a widely used framework, it comes with a whole ecosystem of side projects. We’re happy users of GWTP, GWTQuery, and HighCharts-gxt. Reducing code duplication and getting the work done faster--what else could we hope for?

To learn more about Buxus, visit http://buxus.cl or meet in person at the upcoming StarTechConf in Santiago, Chile, where Buxus will be presenting on their experience with GWT.

To learn about more companies using GWT, also see the Developer Tools Sandbox from this year's Google I/O.

GWT Spotlight: Berger-Levrault

2011-07-27T14:10:00.000-07:00

GWT developers are always curious about who else is using GWT (besides Google), so I plan to post a few short articles spotlighting companies using GWT across various industries and countries. We'll start in Europe, where there is an especially large GWT community in Germany and France. French firm Berger-Levrault recently posted a short article on their use of GWT for HR and financial applications comprising almost 700k lines of code (can you imagine that in Javascript?). According to the article, Berger-Levrault's GWT applications are widely used in the French public sector. Like many GWT apps, these applications are presumably not publicly visible, but illustrate the scale of applications which can be built with GWT. To learn about more companies using GWT, also see the Developer Tools Sandbox from this year's Google I/O.

GWT apps featured in Google I/O videos

2011-06-29T05:55:00.000-07:00

Congrats to DayZipping, Eureka Streams, and Rovio on your case study videos from Google I/O! These were among the 19 companies selected for interviews on how they're innovating with Google technologies.

Watch the full playlist here.

GPE Support for Eclipse Indigo (3.7)

2011-06-24T13:43:00.000-07:00

Earlier this week Eclipse Indigo shipped to much fanfare. One of the features that we are personally happy to see ship is the embedded Window Builder support. Window Builder is the framework on which SWT, Swing, and (near and dear to our hearts) GWT Designer is built on top of.

To coincide with this announcement we now have a 2.3.2 version of GPE that is Indigo-compatible. For more information on installing this update, checkout the GPE quick start guide.

Chris Ramsdale, Product Manager, GWT and GPE cramsdale@google.com

Vaadin 6.6 Ships with GWT 2.3

2011-05-14T08:55:00.000-07:00

Guest blog post by Sami Ekblad, Vaadin.com.

Accompanying the GWT 2.3 release, Vaadin is happy to announce version 6.6 of the Vaadin Framework. Vaadin is a server-side UI component framework that uses GWT on the client-side for rich user experience. With origins in Finland (a "vaadin" is a reindeer), there is now a very active Vaadin community world-wide. The framework has become especially popular during the last two years, with nearly twenty thousand downloads monthly.

Vaadin UI components are similar to GWT widgets, but their state is stored at the server. Every component has a client-side peer widget responsible for the presentation, and the synchronization between the server and the browser is automatically handled by the framework.

This makes development with Vaadin fast. It is mainly used to develop business web applications where pure client-side web application development is not a feasible option, but the web browser as a platform provides unparalleled benefits. One can think of Vaadin as a simplified Swing for web applications.

Touch support and Eclipse plug-in

Vaadin 6.6 follows the latest trends in web application development and adds touch device support. With GWT's new touch features, we were able to touch-enable all Vaadin components. Touch scrolling, selections, and drag and drop work out-of-the-box. Also thanks to GWT, we were able to add official support for Internet Explorer 9, which has been requested a few times already.

In addition to the new framework version there is a new version of the Vaadin plug-in for Eclipse available. The main addition is the visual editor for Vaadin that has now been included by default. With that you can visually design the user interface and then just continue editing the generated Java code to add some logic.

Summary

Over the years, we have seen the development team behind GWT doing an excellent job adding new functionality while keeping the framework as a solid platform for our development.

Today we are also actively contributing new widgets to the GWT community. You can find some of them hosted at Google Code and also available in the Vaadin Add-on Directory. Take a look at the GWT Graphics, SparkLines and SimpleGesture for some interesting examples.

Vaadin 6.6 is a big thing for us and to celebrate it, we decided to release it at Google I/O 2011. Find out more and download at vaadin.com.

Google IO Session Overview: Android + App Engine: A Developer’s Dream Combination

2011-05-11T14:24:00.000-07:00

At Google IO this year, Brad Abrams and Xavier Ducrohet gave a great presentation on how to use GPE 2.4 to build an App Engine connected Android application. Here's a snippet from Brad's blog, as well as a link to the full post.

Xavier Ducrohet and I had a great time today demoing “BigDaddy” which is the codename for the Google Plugin for Eclipse 2.4 Beta that we released today.

I started off with the following products installed:

Eclipse Helios, Android Developments Tools and, of course the Google Plugin for Eclipse 2.4 beta.

Download the complete source code for the demo: https://code.google.com/p/cloud-tasks-io.

See the demo live (but please only use test data): http://androidcloudtasks.appspot.com. For the Android client, browse to the bottom of this page on your phone to find the link to the APK.

You can also check out the default Big Daddy application: http://bigdaddy-io.appspot.com/

Access the slides http://www.slideshare.net/brada/androidandroid-app-engine-a-developers-dream-combination

Our goal is to create a task tracking application for Larry Page. As he takes over as CEO, Larry has a lot of tasks that he needs to track and this app will help him (and the rest of us) track tasks...

The full blog post can be found here: Google IO Session Overview: Android + App Engine: A Developer’s Dream Combination.

Be sure to check out the Google IO session page for the video.

Android Meet App Engine, App Engine Meet Android

2011-05-10T14:17:00.000-07:00

Imagine this: you’ve spent the past few months hammering away at the latest mobile game sensation, Mystified Birds, and you are one level away from complete mastery. And then it happens. In a fit of excitement you throw your hands up, and along with them your Nexus S, which settles nicely at the bottom of the pool you happen to be relaxing next to. The phone is rendered useless. Luckily, your insurance policy covers the replacing the device and the Android Market handles replacing your apps. Unluckily though, all of your Mystified Birds data went the way of your device, leaving you to start from scratch.

Wouldn’t it be great if your new device not only contained all of your apps, but all of your valuable data as well? We think so. With Google Plugin for Eclipse (GPE) v2.4 it’s much easier to build native Android apps that can take data with them wherever they go. And there’s no better place to host your backend service and store your data than Google’s cloud service, App Engine.

With the latest release of GPE, we’re bringing together these two great Google platforms, Android and App Engine, with a set of easy-to-use developer tools. Diving a bit deeper, here are some of the features offered in GPE 2.4:

Project Creation
With GPE 2.4, you now have the ability to create App Engine-connected Android projects. This new Eclipse project wizard generates fully functioning Android and GWT clients that are capable of talking to the same App Engine backend using the same RPC code and business logic.

Cloud to Device Messaging Support
Polling for backend changes on a mobile device is inefficient and will result in poor app performance and battery drain. As a solution for Android developers, the Android team built Cloud to Device Messaging (C2DM), a service for sending lightweight pings to notify apps when they have pending data. We heard back from developers that integrating with C2DM results in a lot of boilerplate (and sometimes fragile) code that they would rather not maintain. With the 2.4 release of GPE, when you create a new App Engine connected Android project, you’ll get this code for free. All you have to do is hook up the app-specific code to customize the handling of the C2DM notification.

RPC Generation and Tooling
Writing and maintaining RPC code (code that allows your app to communicate with backend servers) is monotonous and error prone. Let's face it, you're a mobile developer and the last thing you want to be spending time on is writing (or debugging) this type of code. In GPE 2.4 we're introducing tooling that removes this task for you, and will generate all of the underlying RPC boilerplate code within a few clicks. You specify the model objects that will be used between client and server, and GPE generates the RPC service, DTOs, and client-side calling code. To make this even better, the generated code works across Android and GWT apps, so any future changes that you make will only need to be made once.

Want to get started? Download GPE 2.4 Beta here. Note that you’ll need to install the Android Developer Tools (ADT) plugin as a prerequisite, which can be found here.

If you have any feedback, we’d love to hear it and the GPE Group is the right place to submit it. The App Engine and Android Developer Groups are also great sources of information.

Chris Ramsdale, Product Manager, GWT and GPE cramsdale@google.com

GWT and the Google Plugin for Eclipse 2.3: Final Release Now Available!

2011-05-03T07:59:00.000-07:00

A few weeks ago we announced a Beta release of 2.3 that makes it easier to utilize Google’s Cloud within Eclipse. Since then we’ve been hard at work closing out issues and adding polish, and today we’re happy to announce that the final releases of GWT and the Google Plugin for Eclipse (GPE) are now available.

To get started, download GWT/GPE 2.3 here.

The key features in this release include:

For more info about each feature, click on the associated link above or check out the original blog post. We’ve also put together the following Intro to the Google Plugin for Eclipse screencast that walks you through all of the new features in GPE 2.3.

If you have any feedback, we’d love to hear it and the GWT Group is the right place to submit it.

Post by Chris Ramsdale, cramsdale@google.com

And the winners are...

2011-04-04T15:38:00.001-07:00

The results have been tabulated and the winners are in! In Round II of the Last Call for Google I/O GWT contest, we asked contestants to implement a countdown clock in GWT similar to the official Google I/O countdown and received 48 entries from the US (regrettably, other countries were ineligible due to contest legal requirements).

The three judges from the GWT team were very impressed with the overall creativity and productivity of the participants, with one of the winning entries coming in only seven hours into the 24-hr contest. We selected the top 10 entries based on originality, visual appeal, and performance, and used the size of the compiled Javascript as a tie-breaker in close calls. Here are a few of the judges' favorites:

Nine of our ten contest winners provided a little info about themselves, so in no particular order, here they are. Congratulations to all!

Towers of Hanoi
Christopher Troup
Santa Monica, CA, USA / Halifax, NS, Canada
GWT experience: 2 years
Web Application Developer for SheepDogInc.ca. We use GWT in lots of ways ranging from full-scale GWT applications to progressive enhancement layers over traditional web applications.

Conveyer Belt
Pierre Coirier
Boston, MA, USA
GWT experience: 3 years
Lead front-end developer at Xplana, working on new student learning platform that bridges social networking and the traditional elements of education (http://www.xplana.com), creator of Mvp4g (MVP/Event bus framework for GWT)

Whac-a-Droid
Brad Rydzewski
Scottsdale, AZ, USA
GWT experience: 3 years
I'm a technology product manager at a large corporation during the day ... and enjoy caffeine-fueled nights working on my open source projects gwt-cal, gwt-touch and a gwt nintendo emulator

Breakout
[Editor's note: move the mouse to play]
Brian Reilly
Cambridge, MA, USA
GWT experience: 20 months
Software developer for a biomedical research institution using GWT to develop applications to track DNA sequencing projects.

Morph
Yi Yang
Edmonton, AB, Canada
GWT experience: 1.5 years
Software developer for a local startup (CorpAv Inc.). We build awesome flight-scheduling software with awesome GWT technologies. We built our application entirely on pure GWT without using any third-party UI library (e.g. Ext-Gwt, SmartGwt) and managed to make it visually-appealing and user-friendly.

Word pixels
John Ho
Boston, MA, USA
GWT experience: 2 years
Web applications developer in the education software field. Our UI team primarily uses GWT for development.

Domino clock
James Wendel
Austin, TX, USA
GWT experience: 2 years
Software developer for a network security company. Have used GWT to create small utilities for personal websites. I started out as a Java UI developer and moved into web application development with GWT.
Source code: http://code.google.com/p/oldclock/

Jumping for Droids
[Editor's note: move your mouse over the developers to excite them by directing Androids their way]
Tom Burke
Scottsdale, AZ, USA
GWT experience: 2 years
Developer at a large Dilbert-style corporation in the finance industry. Been using GWT a little bit at work, and quite a lot on hobby projects.

Transitions
Andy Keller
Grand Rapids, MI, USA
GWT experience: 2 years
I'm the Director of Engineering at Traction Software, Inc. where we make collaboration software for business. Starting 2 years ago we re-implemented our entire interface using GWT and have shared some of our work in the gwt-traction project. We're huge fans of GWT.
Source code: http://code.google.com/p/pulazzo-lastcall/

Floor physics
[Editor's note: draw a line with the mouse under the clock and see the balls react]
Chi Hoang
USA
GWT experience: 3 years
I'm the Chief Architect at Solium Capital, a leading provider of stock plan administration technology and services. A rapidly increasing portion of the front end of our web based application is implemented in GWT.

Thanks again to all who participated!

GWT/GPE 2.3: Cloud Connecting Eclipse

2011-04-04T10:59:00.000-07:00

We’re not going to be shy about this, the GWT team loves tools and APIs that make developers' lives better. That’s why we’re happy to have reached an important milestone within the GWT 2.3 release, and are making the GWT 2.3 Beta available for public preview today. This release focuses on bringing Google Services and APIs directly into the Eclipse IDE, making it easier than ever to build fantastic apps using the GWT SDK and Google Plugin for Eclipse (GPE).

Easy Discovery and Access to Google APIs
The number of new APIs hosted by Google has been on the rise lately, and we think this is great for developers looking to add cool features to their apps, such as Google Maps overlays, Buzz streams, and Google Docs integration. To help developers build out these features, we’ve added the ability to browse and add Google APIs directly from Eclipse. Simply highlight a project and the select the “Google - Add Google APIs” menu item to get started.

Import Projects from Project Hosting
What developer tool would be cloud-enabled if it didn’t allow you to store your source code in the cloud? GPE 2.3 provides a simple UI that makes importing projects, from Project Hosting, into Eclipse a piece of cake. We’ve been eating our own dogfood for years, with Project Hosting being the home for GWT source, issue, tracking, wikis, and downloads, so we’re particularly excited to see this functionality within GPE.

One Login, Many Services
As we’ve increased the breadth of services that GPE is communicating with, we wanted to make sure that the user experience remained streamlined. To do so, we’ve included an option to specify your Google Account information only once (using the same authentication mechanisms as Gmail and Google Docs), and deploy to App Engine and import projects from Project Hosting as many times as necessary.

Local Storage APIs
One of the key differentiators between legacy desktop apps and modern web apps is their ability to access data quickly and continue to be usable offline. With the GWT 2.3 SDK we’ve included support for accessing Web Storage, leveling the playing field by allowing web apps to store and retrieve data locally. This is not only faster than typical RPCs, but more functional too, as it allows the app to access data even when there is no Internet connection.

Along with this new set of features and functionality, we have a handful of issue fixes such as updated IE9 support and better iFrame loading within Internet Explorer. The full list of fixes can be found within the GWT issue tracker.

If you're looking to get started, the Google Plugin for Eclipse, as well as other developer tools, can be downloaded here.

As always, if you have any feedback, we’d love to hear it and the GWT Groups is the right place to submit it.

Posted by Chris Ramsdale, cramsdale@google.com

Top Ten Reasons to use Google Plugin for Eclipse

2011-03-29T12:09:00.000-07:00

As I speak at JUGs and conferences around the world, I'm often surprised that some folks have never seen some of the best features of Google Plugin for Eclipse, such as using the Eclipse debugger with a GWT app. So in no particular order, here are 10 reasons you should use Google Plugin for Eclipse (GPE).

GWT+GAE made easy. GPE is the easiest way to get started with GWT and Google App Engine (GAE). Just check the SDKs box when you install the plugin through the Eclipse update site. It's easy to upgrade the SDKs this way (Help | Check for updates), and a status bar message in Eclipse will remind you when new versions are available.
Wizards. It's easy to create your first GWT+GAE project. Click File | New | Web application project and you'll get a sample app that you can run locally to kick the tires and then deploy to Google App Engine. Beyond creating a new project, there are wizards to create new UiBinder templates, ClientBundles, GWT modules, and entry points. To use the wizards, click File | New and look for the items with the GWT toolbox logo (or click File | New | Other... and browse to the Google Web Toolkit folder).
GWT Designer, now bundled with GPE, lets you quickly create a GUI. To see it in action, create a class that extends GWT's Composite class, then right-click on the file and Open With | GWT Designer. When the editor opens, click on the Design tab at the bottom. After GWT Designer launches, click a tool on the palette (say, LayoutPanel), then click on the empty design window to drop the widget in place. Click the source tab to see the code that GWT Designer wrote for you. It's a great way to learn the new cell widgets like CellTable and TextColumn, and GWT Designer has a built-in WYSIWYG CSS editor, too.
Quick fixes and warnings help you write good GWT code quickly. For example, when you create an interface that extends GWT's RemoteService class, GPE will prompt you to create the corresponding async interface required for GWT-RPC. Just click Ctrl+1 (Quick Fix) on the red squiggly and away you go.
Dev mode integration lets you test your code quickly. Run As | Web Application starts GWT development mode and the App Engine dev server (if applicable) so you can test your code in the browser. When dev mode starts, look for the Development Mode tab in Eclipse and double-click the URL to launch your app in the default browser. With GWT dev mode running, you can make changes to your Java code, hit Refresh in the browser, and see your changes live.
Debugging in dev mode rocks. Set a breakpoint in Eclipse, right-click on your project, and Debug As | Web Application. Switch to the browser and run your code. Eclipse will open the Debug perspective where you can step through your code line-by-line, inspect variables, etc.
One-click deploy to Google App Engine. Just click the Google App Engine logo on the toolbar.
Maven support. GPE works with Maven projects via m2eclipse (see setup instructions). Check out a Maven project like the Expenses GWT+GAE sample app into your workspace, then click File | Import | Existing maven project and point it to the pom.xml file. Maven will download all the jars and plugins required in the POM, and GPE will configure the project with the GWT and/or App Engine SDKs from the POM. You can then run Maven commands externally or Run As | Web Application in Eclipse.
Testing. Run As | GWT JUnit Test lets you easily run test cases that extend GWTTestCase.
SpeedTracer. You can launch SpeedTracer from within Eclipse. Click the green stopwatch icon on the GPE toolbar. GPE will compile your app, run it, and launch SpeedTracer in Chrome to profile your app.

Haven't tried it yet? Install Google Plugin for Eclipse now.

Update on GWT support for IE9

2011-03-18T06:14:00.000-07:00

In keeping with the GWT philosophy of making it possible to write no-compromise AJAX in any modern browser, GWT 2.3 (in progress) will support IE9. We're adding a new user.agent property "ie9" and the notion of fallback properties, so any browser-specific bindings not yet implemented in ie9 will fall back to ie8 and show a compile-time warning that a fallback impl was used.

In the mean time, you can tell IE9 to behave as IE8 by inserting the following in the head section of your GWT host page:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

Assuming that IE continues to maintain backward compatibility, you may want to insert the equivalent tag for IE9 once GWT 2.3 ships in order to make your app somewhat future-proof for future IE versions. For more information on document compatibility in Internet Explorer, see http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx

The IE9 dev mode issue reported back in Dec is fixed in GWT 2.2.0: http://googlewebtoolkit.blogspot.com/2010/12/support-for-gwt-dev-mode-in-ie-9.html

You can follow the status of known IE9 issues here:

Last Call for Google I/O

2011-03-14T08:45:00.000-07:00

For those of you who were quick to register, we thank you for continuing to support our developer initiatives -- this year's I/O is slated to be one of our best yet. For the rest of our developers, we weren’t kidding when we told you we <3 our developers.

Starting Wednesday, March 16, we will be launching Last Call for Google I/O: A contest that spans 10 days, 10 developer challenges and 100 chances to win tickets to attend the now-sold-out Google I/O 2011.

To participate, see the official Last Call for Google I/O blog post.

The GWT / Developer Tools contest opens Wed Mar 25 at 9am PST.

Styling and skinning your apps with TravelTripper

2011-03-08T13:07:00.000-08:00

There's more than one way to skin a GWT app. In this guest blog post, Erik Uzureau, User Experience Engineer at TravelTripper, shares their approach.

Styling/Skinning RezTrip

At TravelTripper, we make hotel reservation software. Our main product is a "booking engine" called RezTrip, a web based application that allows visitors of a hotel’s website to directly book a stay with that hotel.

As GWT applications go, we think RezTrip, when it comes to the question of styling, presents an interesting departure from traditional development. As a "white label" application, we needed to create our app in such a way that allows our hotel clients the ability to customize not only the "frame" around the application, but also the internal style of the application itself, such as fonts, colors, etc.

In other words, each hotel needs the ability to create their own custom header, footer, or sidebar and have it wrap the booking "application" portion of the page. Furthermore, each hotel needs to be able to change all the colors, fonts, and even some icons within the application.

The desired end result is a single booking engine application, running on multiple web sites, but always mimicking the look and feel of each individual hotel site.

We have two additional constraints:

Cost - While our first priority is building a system with ultimate flexibility, the time spent to create each customization represents a direct bite into our profit margins. The business guys were explicit about keeping these costs to a minimum.
Dynamic Changes - Clients are naturally picky about the appearance of their website, and their tailored booking engine is no exception. Experience told us that we would be fielding constant requests to tweak different aspects of the customized properties. This has to be easy to do and have minimal impact on the overall site performance.

Satisfying our Constraints

Keeping Costs Low

Our in-house GWT team is top-notch, but expensive. The previous version of our application was built on basic JSP/HTML/CSS technology, and the customization work had been done by a more affordable entry-level web designer. Similarly, for this version of the application, we wanted to limit the involvement of our GWT developers as much as possible, where possibly leaving stylistic tweaks to our web designer.

We want the customizer to be able to do *all* the work, without requiring any Java or GWT knowledge.

Making Changes Easy and Harmless

We realized that GWT's application compilation philosophy changed a lot of our longstanding web development assumptions. We didn't want to create custom UiBinder files for each hotel's frame, or have to make spot changes to CSS that would require a full recompile and redeployment of the application.

We want to be able to make CSS changes without recompiling or redeploying the app.

Our Solution

The only way to satisfy the above two constraints is to have all the customization work happen in simple HTML/CSS files that live outside the GWT project and WAR directory. This allows the customizer to work in pure HTML/CSS, directly with the files on the server, without ever having to modify the internals of the GWT application. Changes can take effect immediately, without a need to redeploy the app.

The Application Frame

We decided to have a separate index.html file for each property's customization. This allows custom header/footer/sidebar HTML, CSS and JavaScript to be included in the hotel's main page.

Another challenge for us was the need for the application portion of the booking engine to be able to be dynamically resized relative to the user's browser. To accomplish this, we decided to use a DockLayoutPanel, which handles the separation between the main application and the custom frame. We load an empty SimplePanel into each of the North, South, West, East sections of the DockLayoutPanel, and our application in the Center.

Next, we add special code that runs directly from onModuleLoad() that scours the host HTML document for four DIVs with 4 unique ids: tt-Header, tt-Footer, tt-EastSidebar, and tt-WestSidebar. If the app finds a DIV with those ids, it loads it into the corresponding SimplePanel and auto-sizes to the contents. If no corresponding DIV is found, the app hides the SimplePanel entirely and sets the width or height to 0.

What this means is, that the customizer doesn't get to lay out the HTML page exactly like it will be displayed when live. Instead s/he must smash the relevant content into the four qualified DIVs. This is a minor annoyance, but at the end of the day, the code itself is still the same basic HTML/CSS/JavaScript, and so it is perfectly manageable by the web designer. The GWT application is already compiled to super-fast JavaScript, so there's no need for the customizer to know any GWT. Instead, the customizer can just edit the contents in the HTML file and hit refresh to see the changes.

The CSS

Here again, we had to come up with a custom solution. To avoid the recompile/redeploy issue and also to keep it simple for the customizer, we had to handle the CSS for customizing the application without having to modify any code inside the GWT project.

What we ended up doing was creating three levels of CSS:

UiBinder - Any time we needed to use a CSS style to adjust the size or layout of a widget or panel, we kept that CSS code in UiBinder XML. We only want the actual GWT developers to change the layout/size of the UI elements, so they needed to be in a sense “hidden” from the customizer. We loved how the default UiBinder behaviour is to generate md5 class names, allowing us to create lots of custom CSS rules, without worrying about namespace overlap and also ensure that the customizer would know not to override them.
master.css - Next, we created a "master" CSS file where we put all the other CSS styles, which we thought were fair game, to be overridden by the customizer. This is a huge CSS file, but when minimized (yuicompressor) and gzipped, the end result was still better than the latency hit we had when originally we tried to spread these across multiple files (for organizational purposes). Note that the master.css file is loaded directly from the main HTML file.
designer.css - The final layer is the "designer" CSS, which is where we have the customizer put all the CSS rules which override the defaults. The class names in this file all match the class names in the master CSS, but since we load the designer CSS in the page *after* we load the master CSS, the former will always override the latter.

Summary

Despite our constraints, we were able to configure our GWT application to perform exactly as we desired. Our application is fully customizable, both in terms of the surrounding frame layout and also the internal application's colors and fonts, all without the customizer having to know any Java or GWT. By carefully separating the different layers of the app, we were able to make it easily and efficiently customizable on the fly, without ever having to redeploy the application.

Sample index.html File

<!DOCTYPE html>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">

  <title>Paradise Hotel Reservation System</title>

  <!-- Master CSS File -->
  <!-- All styles in here can be overridden in designer.CSS (below) -->
  <link rel="stylesheet" href="../reztrip/CSS/master.CSS" type="text/CSS"/>

  <!-- Designer CSS File -->
  <!-- Single css file to be created and modified by the customizer. -->
  <!-- New styles for the frame and overridden style from master.CSS go here -->
  <link rel="stylesheet" href="style/designer.CSS" type="text/CSS"/>

  <script type="text/javascript" language="javascript"
          src="../reztrip/reztrip.nocache.js"></script>
  </head>

  <body>

  <div id="tt-Header" class="tt-Frame-Header">
    <!-- because tt-Header has content, we will load it and auto-size -->
    <!-- it in the header area of the application frame -->

    <table class="tt-Frame-HeaderTable">
      <tr>
        <td>
          <img src="img/paradise_logo.png"></img>
        </td>
        <td>
          <img src="img/paradise_menu.png"></img>
        </td>
      </tr>
    </table>

  </div>

  <div id="tt-Footer" class="tt-Frame-Footer">
    <!-- empty, so no footer will load -->
  </div>

  <div id="tt-EastSidebar" class="tt-Frame-EastSidebar">
    <!-- empty, so no east sidebar will load -->
  </div>

  <div id="tt-WestSidebar" class="tt-Frame-WestSidebar">
    <!-- empty, so no west sidebar will load -->
  </div>
 
  <!-- OPTIONAL: include this if you want history support -->
  <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex="-1"
          style="position:absolute;width:0;height:0;border:0"></iframe>

  </body>
</html>

Google Plugin for Eclipse and GWT 2.2 now available

2011-02-14T10:55:00.000-08:00

Google Plugin for Eclipse and GWT 2.2 are now available with several new features that we’re excited to share with you. First, Google Plugin for Eclipse 2.2 directly integrates GWT Designer, a powerful WYSIWYG Ajax user interface (UI) designer that makes it much easier to quickly build UIs. Second, developers can take advantage of the modern web with the first round of HTML5 support within the GWT SDK. Additionally, GWT’s CellTable widget now offers new functionality, such as default column sorting and the ability to set column widths. These new features make it even easier to build best in breed web apps using Java-based tools and Eclipse. And while these apps can be run on any platform, Google Plugin for Eclipse makes it very easy to deploy, and run, on Google App Engine.

Instructions for installing this new release of the Google Plugin for Eclipse and GWT SDK can be found here: Getting Started with Google Plugin for Eclipse.

If you’re simply looking for the GWT 2.2 SDK, you can find it here: GWT SDK Download.

GWT Designer
Directly integrating GWT Designer into the Google Plugin for Eclipse has been a top priority for us over the past few months. We’ve had some very positive feedback from the community early on, and for this release we not only wanted to provide the best developer experience when using GWT Designer, we also wanted a seamless experience across GWT Designer and GPE.

HTML5 features
GWT 2.2 includes support for HTML5-specific features, such as the Canvas element, which allows for dynamic, scriptable rendering of 2D shapes and bitmap images, and the embedding of Audio/Video tags. These APIs are still experimental and may change a bit over the next couple releases, but we feel that they're stable enough to deserve some real mileage (by you). One of the GWT team members, Philip Rogers, put together this demo to showcase the new Canvas support in the GWT SDK. You can find the code for this demo here: http://code.google.com/p/gwtcanvasdemo/.

New CellTable APIs
With GWT 2.1, we found that developers were often times incorporating a CellTable widget into their project, and immediately adding the boilerplate code to add sorting, and then having to jump through hoops to set column widths. With the GWT SDK 2.2 release, this functionality is now part of the CellTable widget itself. Where we can, we want to improve the native GWT widgets, adding features and functionality that minimize the custom code that developers have to write.

If you would like to see these updates in action, checkout out the CellTable example with the GWT Showcase app.

A note about Java 1.5
GWT version 2.2 will only have deprecated support for Java 1.5, resulting in warnings when building applications. While Java 1.5 will still work for this release of GWT, developers should upgrade their version of Java to correct these warnings and ensure compatibility with future versions of GWT.

If you have questions or want to provide feedback, we’d love to hear it, and the best place to do so is in the Google Web Toolkit Group.

Chris Ramsdale, on behalf of the Google Developer Tools Team
cramsdale@google.com

Dev Plugin support for Firefox 4

2011-01-26T12:30:00.001-08:00

We are pleased to announce that the GWT Developer Plugin now officially supports Firefox 4 on all platforms that Firefox ships on: Win x86, Linux x86/x86_64, Mac x86/x86_64. Please be sure that you are using Firefox 4 beta 9 or newer.

If you already have the plugin installed, you can use the normal add-on update process. If you are a Firefox 3.x user who has been waiting to try Firefox 4, the add-on will automatically update when you launch Firefox 4 with your current profile.

As always, you can always download the latest GWT Developer plugin for your browser from http://gwt.google.com/missing-plugin

GWT Goes Bidirectional!

2011-01-10T08:56:00.000-08:00

Over 100 million web users speak languages that are written right-to-left, such as Arabic, Hebrew and Persian.

Right-to-left language support is not new to GWT. GWT makes it easy to build applications localized to both right-to-left (RTL) and left-to-right (LTR) locales, mirroring the layout of the page and its widgets so that an RTL-language page flows right-to-left. GWT even makes it easy to mirror those "handed" images that need to point in a direction that makes sense within the page. So, what's the problem?

The Challenge of Bidi Text

An application localized to an RTL language is often used to access both RTL and LTR data, simply because data in some left-to-right languages like English is so widespread. For example, an Arabic movie review application may need to display Latin-script movie titles. Conversely, native RTL-language speakers often choose to use an English version of an application, but still use it to access and enter RTL data too. The point is that the data should be displayed in its own direction, regardless of the context’s direction. As a result, the text of the page as a whole goes in both directions; the page’s text is bidirectional, or “bidi”.

Unfortunately, inserting an opposite-direction phrase into your page without explicitly indicating where it begins and ends, often garbles it and/or the text surrounding it, putting the words and punctuation in the wrong order. For example, in an RTL context, “10 Main St.” is displayed incorrectly as “.Main St 10”. For short, we call the capability to display opposite-direction text correctly “bidi text support”.

The good news is that GWT has recently been enhanced with some powerful features for supporting bidi text. They allow your application to correctly display and enter opposite-direction text with very little extra effort.

Built-in Bidi Text Support in TextBox and TextArea

Since GWT 2.1 release, the TextBox and TextArea widgets are capable of automatically adjusting their direction as text is being entered (GWT Showcase example). This feature is enabled by default when at least one of the application's locales is RTL, and otherwise can be enabled manually.

Built-in Bidi Text Support in Other Widgets

As of GWT 2.2 (to be released soon), several widely used widgets such as Label, HTML, Anchor, Hyperlink and ListBox gain built-in bidi text support by exposing two new interfaces:

The HasDirectionalText interface allows declaring the direction of text whose direction is known in advance. For example, a Label holding a phone number is always LTR, even in RTL locales, and must be declared as such to prevent garbling. You can do this by passing an extra parameter to either the constructor: Label label = new Label(phone, Direction.LTR); or to setText(): label.setText(phone, Direction.LTR);
The HasDirectionEstimator interface allows widgets to cope with text whose direction is unknown (for example text previously entered by users). When direction estimation is enabled, the widget estimates the direction of the text content at runtime, and sets its display direction accordingly. Note that usually there’s no need to use this feature for boilerplate text (i.e. messages), since such text usually matches the overall page direction.

In the following example, an imaginary application collects reviews of books from the users. A user can add to the repository a new book with its name and review. To view the review of a specific book, one can select its name from a ListBox holding the books’ names. Note that books’ names may be of both directions, especially in RTL locales.

public class BookReviewApp() {
  private ListBox bookNamesListBox;
  …
  public BookReviewApp() {
    // Enable bidi support.
    bookNamesListBox.setDirectionEstimator(true);
    …
  }
  public addBook(String bookName, String review) {
    // ListBox item’s direction will be set automatically.
    bookNamesListBox.add(bookName);
    …
  }
  …
}

Bidi and Messages

BidiFormatter is a new class providing bidi text support primitives like estimating a string’s direction and wrapping it in HTML for correct display in a potentially opposite-direction context. The new built-in bidi text support features in the widgets mentioned above use BidiFormatter to do their stuff. Sometimes, however, you may need to use BidiFormatter directly. It is particularly useful with message placeholder values. While the message as a whole is usually localized to the user interface language, placeholder values may be in an arbitrary language and thus may have the opposite direction. Use BidiFormatter’s methods to wrap such values before inserting them into the message. A comprehensive example of using BidiFormatter with messages is available in the GWT Showcase.

Dev mode plugin now available for 64-bit IE

2011-01-04T10:20:00.001-08:00

The GWT development mode plugin is now available for the 64-bit version of Internet Explorer. You can download it as usual when prompted to do so by the "missing plugin" page. Note that this is unrelated to the IE9 issue previously discussed on this blog. The GWT team is still working with Microsoft on a fix.

GWT 2.1.1 is now available

2010-12-17T11:26:00.000-08:00

Back in October of this year we released GWT 2.1, with a framework and set of tools that made it easy to build business web apps. Since then we've had some great feedback from the GWT community, and today we're happy to announce that we've incorporated that feedback into our latest release, GWT 2.1.1. The specifics of this release are detailed below, but if you're interested in getting started you can do so here.

For Eclipse users, simply click on the “Google updates available” icon in the lower left hand corner of your screen, or select the “Help->Check for Updates” menu item.

Alongside this release, we’ve also updated the Google Plugin for Eclipse and GWT Designer. Both can be installed via the links below.

Google Plugin for Eclipse: http://code.google.com/eclipse/docs/download.html
GWT Designer: http://code.google.com/webtoolkit/tools/download-gwtdesigner.html

The main release updates for each product include:

GWT SDK

GWT’s RequestFactory component, introduced in GWT 2.1, received a lot of attention, both from the GWT team at Google and from the GWT open source community at large. Based on this feedback, we’ve added the following:

A service layer, which includes support for non-static service objects
Value object support
Multiple methods calls on a single request

Google Plugin for Eclipse

Improved UiBinder error reporting within SpringSource Tool Suite (STS)
Optimized the IDE experience by removing unused Java builders and leveraging the AspectJ fixes in the latest STS release
Updated Speed Tracer to perform a full J2EE publish before launching

GWT Designer

Added support for: CellList, CellTable, CellTree, CellBrowser & SimplePager
Improved support for GWT UiBinder, including the following annotations:
WebKit rendering for 32-bit Windows (used to use IE)

If you have questions or want to provide some feedback, we’d love to hear it, and the best place to do so is in the Google Web Toolkit Group.

Support for GWT Dev Mode in IE 9

2010-12-13T13:09:00.000-08:00

For those of you that are diligently testing the bounds of the web, you may have noticed some issues when debugging GWT apps within Internet Explorer 9. Even though IE 9 is still in a pre-release phase, we did want to provide some context around the root of the problem, and offer up a workaround to get you working in Development Mode again.

Note that this is only an issue when running your GWT app in Development Mode under IE 9. Production Mode is unaffected.

For some background, there appears to have been a change in behavior in IE 9 related to the way Javascript names are resolved from the perspective of native plugins. When executing in document mode 9, the IE tab that hosts the dev mode plugin crashes.

We are working with Microsoft to understand the issue and come up with a definitive solution. Again, note that this issue affects only GWT Development Mode.

Workaround

The current workaround is to avoid document mode 9. See the link below for more information.

To force an earlier document mode, add a meta tag to your html files indicating a different document mode. For instance, in the case of the sample GWT app html page, add <meta http-equiv="X-UA-Compatible" content="IE=8" /> to the <head> section as shown below:

<!doctype html>





<html>
<head>
   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=8" />

Until this issue is resolved, you will need to do this for each HTML host page in order to use GWT dev mode with IE9.

References

MSDN - Defining Document Compatibility