Google Web Toolkit (GWT) Technical Interview Questions Answers


What is Google Web Toolkit (GWT)?

Google Web Toolkit (GWT) is a development toolkit for building and optimizing complex browser-based applications. GWT is used by many products at Google, including Google AdWords and Orkut.


What are the features of GWT?

Following are the features of GWT − Google Web Toolkit (GWT) is a development toolkit to create RICH Internet Application(RIA). GWT provides developers option to write client side application in JAVA. GWT compiles the code written in JAVA to JavaScript code. Application written in GWT is cross-browser compliant. GWT automatically generates javascript code suitable for each browser. GWT is open source, completely free, and used by thousands of developers around the world. It is licensed under the Apache License version 2.0.


Why we should use GWT?

Following are the reasons to prefer GWT for development projects − Being Java based, you can use JAVA IDEs like Eclipse to develop GWT applcation. Developers can use code auto-complete/refactoring/navigation/project management and all features of IDEs. GWT provides full debugging capability. Developers can debug the client side application just as an Java Application. GWT provides easy integration with Junit and Maven. Again being Java based, GWT has a low learning curve for Java Developers. GWT generates optimized javascript code, produces browser's specific javascript code by self. GWT provides Widgets library provides most of tasks required in an application. GWT is extensible and custom widget can be created to cater to application needs. On top of everything, GWT applications can run on all major browsers and smart phones including Android and iOS based phones/tablets.


What are the disadvantages of GWT?

Following are the disadvantages of GWT − 

Not indexable − Web pages generated by GWT would not be indexed by search engines because these applications are generated dynamically. 

Not degradable − If your application user disables Javascript then user will just see the basic page and nothing more. 

Not designer's friendly − GWT is not suitable for web designers who prefer using plain HTML with placeholders for inserting dynamic content at later point in time.


What are the core components of GWT?

Following are the core components of GWT −

GWT Java to JavaScript compiler − This is the most important part of GWT which makes it a powerful tool for building RIAs. The GWT compiler is used to translate all the application code written in Java into JavaScript.

JRE Emulation library − Google Web Toolkit includes a library that emulates a subset of the Java runtime library. The list includes java.lang, java.lang.annotation, java.math, java.io, java.sql, java.util and java.util.logging.

GWT UI building library − This part of GWT consists of many subparts which includes the actual UI components, RPC support, History management, and much more.

GWT Hosted Web Browser − GWT Hosted Web Browser lets you run and execute your GWT applications in hosted mode, where your code runs as Java in the Java Virtual Machine without compiling to JavaScript.


What are the components of a GWT application?

A GWT application consists of following four important parts out of which last part is optional but first three parts are mandatory − Module descriptors Public resources Client-side code Server-side code


What is Module descriptor in GWT?

A module descriptor is the configuration file in the form of XML which is used to configure a GWT application. A module descriptor file extension is *.gwt.xml, where * is the name of the application and this file should reside in the project's root.


What is the purpose of 'module' tag in *.gwt.xml file in GWT?

This provides name of the application.

What is the purpose of 'inherits' tag in *.gwt.xml file in GWT?

This adds other gwt module in application just like import does in java applications. Any number of modules can be inherited in this manner.

What is the purpose of 'entry-point' tag in *.gwt.xml file in GWT?

This specifies the name of class which will start loading the GWT Application.

Can you have multiple entry-point classes in a *.gwt.xml file?

Yes! Any number of entry-point classes can be added.

Which method of a entry-point class is called when GWT application starts?

onModuleLoad() function gets called and acts similar to main method of a java application.


How onModuleLoad() functions get called if multiple entry-point classes are specified in *.gwt.xml?

They are called sequentially in the order in which entry-point classes appear in the module file. So when the onModuleLoad() of your first entry point finishes, the next entry point is called immediately.


What is the purpose of 'source' tag in *.gwt.xml file in GWT?

This specifies the names of source folders which GWT compiler will search for source compilation.


What is the purpose of 'public' tag in *.gwt.xml file in GWT?

The public path is the place in your project where static resources referenced by your GWT module, such as CSS or images, are stored.


What is default public path for static resources in GWT application?

The default public path is the public subdirectory underneath where the Module XML File is stored.


What is the purpose of 'script' tag in *.gwt.xml file in GWT?

Automatically injects the external JavaScript file located at the location specified by src.


What is the purpose of 'stylesheet' tag in *.gwt.xml file in GWT?

Automatically injects the external CSS file located at the location specified by src.


What is an entry-point class?

A module entry-point is any class that is assignable to EntryPoint and that can be constructed without parameters. When a module is loaded, every entry point class is instantiated and its EntryPoint.onModuleLoad() method gets called.


What is *.nocache.js file in GWT?

It contains the javascript code required to resolve deferred binding configuarations (for example, browser detection) and to use lookup table generated by GWT compiler to locate one of the .cache.html.


What is .cache.html file in GWT?

It contains the actual program of a GWT application.


Explain bootstrap procedure for GWT application.

Following are the steps of bootstrap proceure for GWT application when a browser loads the GWT application − Browser loads the host html page and .nocache.js file. Browser executes the .nocache.js file's javascript code. .nocache.js code resolves deferred binding configuarations (for example, browser detection) and use lookup table generated by GWT compiler to locate one of the .cache.html. .nocache.js code then creates a html hidden iframe, inserts that iframe into the host page's DOM, and loads the .cache.html file into the same iframe. .cache.html contains the actual program of a GWT application and once loaded in iframe shows the GWT application in the browser.


Why should a .nocache.js file never be cached?

GWT compiler generates .nocache.js file every time with the same name whenever a GWT application is compiled. So browser should always download the .nocache.js file to get the latest gwt application. gwt.js code actually appends a unique timestamp at the end of the file name so that browser always treat it a new file and should never cache it.


What is the purpose of Host Page?

The most important public resource is host page which is used to invoke actual GWT application. A typical HTML host page for an application might not include any visible HTML body content at all but it is always expected to include GWT application via a <script.../> tag.


What is the default style name of any GWT widget?

By default, the class name for each component is gwt-<classname>. For example, the Button widget has a default style of gwt-Button and similar way TextBox widgest has a default style of gwt-TextBox.


Do GWT compiler creates default Id attribute for its Widget by default?

No! By default, neither the browser nor GWT creates default id attributes for widgets.

What is the purpose of setStyleName() function of a GWT widget?

This method will clear any existing styles and set the widget style to the new CSS class provided using style.

What is the purpose of addStyleName() function of a GWT widget?

This method will add a secondary or dependent style name to the widget. A secondary style name is an additional style name that is,so if there were any previous style names applied they are kept.

What is the purpose of removeStyleName() function of a GWT widget?

This method will remove given style from the widget and leaves any others associated with the widget.

What is the purpose of getStyleName() function of a GWT widget?

This method gets all of the object's style names, as a space-separated list.


What is the purpose of setStylePrimaryName() function of a GWT widget?

This method sets the object's primary style name and updates all dependent style names.


What is the difference between primary style and secondary styles of a GWT Widget?

By default, the primary style name of a widget will be the default style name for its widget class. For example, gwt-Button for Button widgets. When we add and remove style names using AddStyleName() method, those styles are called secondary styles. The final appearance of a widget is determined by the sum of all the secondary styles added to it, plus its primary style. You set the primary style of a widget with the setStylePrimaryName(String) method.


How you can attach a CSS file with your GWT module?

There are multiple approaches for associating CSS files with your module. Modern GWT applications typically use a combination of CssResource and UiBinder. Using a <link> tag in the host HTML page. Using the <stylesheet> element in the module XML file. Using a CssResource contained within a ClientBundle. Using an inline <ui:style> element in a UiBinder template.


Which class is the superclass of all user-interface classes?

The class UIObject is the superclass for all user-interface objects.

Explain UIObject class.

The class UIObject is the superclass for all user-interface objects. It simply wraps a DOM element, and cannot receive events. It provides direct child classes like Widget, MenuItem, MenuItemSeparator, TreeItem. All UIObject objects can be styled using CSS. Every UIObject has a primary style name that identifies the key CSS style rule that should always be applied to it. More complex styling behavior can be achieved by manipulating an object's secondary style names.

Explain Widget class.

The class Widget is the base class for the majority of user-interface objects. Widget adds support for receiving events from the browser and being added directly to panels.

What is the purpose of Label widget of a GWT?

This widget contains text, not interpreted as HTML using a <div>element, causing it to be displayed with block layout.

What is the purpose of HTML widget of a GWT?

This widget can contain HTML text and displays the html content using a <div> element, causing it to be displayed with block layout.

What is the purpose of Image widget of a GWT?

This widget displays an image at a given URL.

What is the purpose of Anchor widget of GWT?

This widget represents a simple <a> element.

Which widget represents a standard push button in GWT?

Button widget represents a standard push button.

Which widget represents a normal push button with custom styling in GWT?

PushButton represents a normal push button with custom styling.


Which widget represents a stylish stateful button which allows the user to toggle between up and down states in GWT?

ToggleButton widget represents a stylish stateful button which allows the user to toggle between up and down states.


Which widget represents a standard check box widget. This class also serves as a base class for RadioButton in GWT?

CheckBox widget represents a standard check box widget. This class also serves as a base class for RadioButton.


Which widget represents a mutually-exclusive selection radio button widget in GWT?

RadioButton widget represents a mutually-exclusive selection radio button widget.


Which widget represents a list of choices to the user, either as a list box or as a drop-down list in GWT?

ListBox widget represents a list of choices to the user, either as a list box or as a drop-down list.


Which widget acts as a suggestion box in GWT?

SuggestBox widget represents a text box or text area which displays a pre-configured set of selections that match the user's input. Each SuggestBox is associated with a single SuggestOracle. The SuggestOracle is used to provide a set of selections given a specific query string.


Which widget represents a single line text box in GWT?

TextBox widget represents a single line text box.


Which widget represents a password text box in GWT?

PasswordTextBox widget represents a text box that visually masks its input to prevent eavesdropping.


Which widget represents a multiline text box in GWT?

TextArea widget represents a text box that allows multiple lines of text to be entered.


Which widget represents a rich text editor in GWT?

RichTextArea widget represents a rich text editor that allows complex styling and formatting.


Which widget represents a file upload in GWT?

FileUpload widget wraps the HTML <input type='file'> element.


Which widget represents a hidden field in GWT?

Hidden widget represets a hidden field in an HTML form.


Which GWT widget represents a standard hierarchical tree?

Tree widget represents a standard hierarchical tree widget. The tree contains a hierarchy of TreeItems that the user can open, close, and select.


Which GWT widget represents a standard menu bar?

MenuBar widget represents a standard menu bar widget. A menu bar can contain any number of menu items, each of which can either fire a Command or open a cascaded menu bar.


Which GWT widget represents a standard GWT date picker?

DatePicker widget represents a standard GWT date picker.


Which GWT widget represents a view of a tree?

CellTree widget represents a view of a tree. This widget will only work in standards mode, which requires that the HTML page in which it is run have an explicit <!DOCTYPE> declaration.


Which GWT widget represents a single column list of cells?

CellList widget represents a single column list of cells.


Which GWT widget represents a tabular view that supports paging and columns?

CellTable widget represents a tabular view that supports paging and columns.


Which GWT widget represents a browsable view of a tree in which only a single node per level may be open at one time?

CellBrowser widget represents a browsable view of a tree in which only a single node per level may be open at one time. This widget will only work in standards mode, which requires that the HTML page in which it is run have an explicit <!DOCTYPE> declaration.


What are layout panels in GWT?

Layout Panels can contain other widgets. These panels controls the way widgets to be shown on User Interface. Every Panel widget inherits properties from Panel class which in turn inherits properties from Widget class and which in turn inherits properties from UIObject class.


Which class is the base class of all layout panel classes?

Panel is the abstract base class for all panels, which are widgets that can contain other widgets.


Which GWT widget represents a panel that formats its child widgets using the default HTML layout behavior?

FlowPanel widget represents a panel that formats its child widgets using the default HTML layout behavior.


Which GWT widget represents a panel that lays all of its widgets out in a single horizontal column?

HorizontalPanel widget represents a panel that lays all of its widgets out in a single horizontal column.


Which GWT widget represents a panel that lays all of its widgets out in a single vertical column?

VerticalPanel widget represents a panel that lays all of its widgets out in a single vertical column.


What is HorizontalSplitPanel in GWT?

HorizontalSplitPanel widget represents a panel that arranges two widgets in a single horizontal row and allows the user to interactively change the proportion of the width dedicated to each of the two widgets. Widgets contained within a HorizontalSplitPanel will be automatically decorated with scrollbars when necessary.


What is VerticalSplitPanel in GWT?

VerticalSplitPanel widget represents a A panel that arranges two widgets in a single vertical column and allows the user to interactively change the proportion of the height dedicated to each of the two widgets. Widgets contained within a VertialSplitPanel will be automatically decorated with scrollbars when necessary.


What is FlexTable in GWT?

FlexTable widget represents a flexible table that creates cells on demand. It can be jagged (that is, each row can contain a different number of cells) and individual cells can be set to span multiple rows or columns.


What is Grid in GWT?

Grid widget represents a rectangular grid that can contain text, html, or a child Widget within its cells. It must be resized explicitly to the desired number of rows and columns.


What is DeckPanel in GWT?

DeckPanel is a panel that displays all of its child widgets in a 'deck', where only one can be visible at a time. It is used by TabPanel.


What is DockPanel in GWT?

This widget represents a panel that lays its child widgets out "docked" at its outer edges, and allows its last widget to take up the remaining space in its center.


What is HTMLPanel in GWT?

This widget represents a panel that contains HTML, and which can attach child widgets to identified elements within that HTML.


What is TabPanel in GWT?

This widget represents a panel that represents a tabbed set of pages, each of which contains another widget. Its child widgets are shown as the user selects the various tabs associated with them. The tabs can contain arbitrary HTML.


What is Composite in GWT?

This widget represents a type of widget that can wrap another widget, hiding the wrapped widget's methods. When added to a panel, a composite behaves exactly as if the widget it wraps had been added.


Which GWT widget is the base class for panels that contain only one widget?

SimplePanel is the base class for panels that contain only one widget.


Which GWT widget represents a simple panel that wraps its contents in a scrollable area?

ScrollPanel widget represents a simple panel that wraps its contents in a scrollable area.


Which GWT widget represents a simple panel that makes its contents focusable?

FocusPanel widget represents a simple panel that makes its contents focusable, and adds the ability to catch mouse and keyboard events.


What is FormPanel in GWT?

This widget represents a panel that wraps its contents in an HTML <FORM> element.


What is PopupPanel in GWT?

This widget represents a panel that can pop up over other widgets. It overlays the browser's client area (and any previously-created popups).


What is DialogBox in GWT?

This widget represents a form of popup that has a caption area at the top and can be dragged by the user. Unlike a PopupPanel, calls to PopupPanel.setWidth(String) and PopupPanel.setHeight(String) will set the width and height of the dialog box itself, even if a widget has not been added as yet.


Explain Event handling in GWT.

GWT provides a event handler model similar to Java AWT or SWING User Interface frameworks. A listener interface defines one or more methods that the widget calls to announce an event. GWT provides a list of interfaces corresponding to various possible events. A class wishing to receive events of a particular type implements the associated handler interface and then passes a reference to itself to the widget to subscribe to a set of events. For example, the Button class publishes click events so you will have to write a class to implement ClickHandler to handle click event. All GWT event handlers have been extended from EventHandler interface and each handler has only a single method with a single argument. This argument is always an object of associated event type. Each event object have a number of methods to manipulate the passed event object.

How can you create a custom GWT Widget?

GWT provides three ways to create custom user interface elements. There are three general strategies to follow −
Create a widget by extending Composite Class − This is the most common and easiest way to create custom widgets. Here you can use existing widgets to create composite view with custom properties.
Create a widget using GWT DOM API in JAVA − GWT basic widgets are created in this way. Still its a very complicated way to create custom widget and should be used cautiously.
Use JavaScript and wrap it in a widget using JSNI − This should generally only be done as a last resort. Considering the cross-browser implications of the native methods, it becomes very complicated and also becomes more difficult to debug.


What is GWT UiBinder?

The UiBinder is a framework designed to separate Functionality and View of User Interface. The UiBinder framework allows developers to build gwt applications as HTML pages with GWT widgets configured throughout them. The UiBinder framework makes easier collaboration with UI designers who are more comfortable with XML, HTML and CSS than Java source code. The UIBinder provides a declarative way of defining User Interface. The UIBinder seperates the programmic logic from UI. The UIBinder is similar to what JSP is to Servlets.


What is GWT RPC?

RPC, Remote Procedure Call is the mechanism used by GWT in which client code can directly executes the server side methods. GWT RPC is servlet based. GWT RPC is asynchronous and client is never blocked during communication. Using GWT RPC Java objects can be sent directly between the client and the server (which are automatically serialized by the GWT framework). Server-side servlet is termed as service. Remote procedure call that is calling methods of server side servlets from client side code is referred to as invoking a service.


What are the core components of GWT RPC?

Following are the three components used in GWT RPC communication mechanism: A remote service (server-side servlet) that runs on the server. Client code to invoke that service. Java data objects which will be passed between client and server. GWT client and server both serialize and deserialize data automatically so developers are not required to serialize/deserialize objects and data objects can travel over HTTP.


Which interface a java data object should implement so that it can be transferred over the wire in GWT RPC?

A java data object should implement isSerializable interface so that it can be transferred over the wire in GWT RPC.


What is internationalization?

Internationalization is a way to show locale specific information on a website. For example, display content of a website in English language in United States and in Danish in France.


What are the ways using which you can internationalize a GWT application?

GWT provides three ways to internationalize a GWT application − Static String Internationalization. Dynamic String Internationalization. Localizable Interface.


What is Static String Internationalization technique in GWT?

This technique is most prevalent and requires very little overhead at runtime; is a very efficient technique for translating both constant and parameterize strings;simplest to implement. Static string internationalization uses standard Java properties files to store translated strings and parameterized messages, and strongly-typed Java interfaces are created to retrieve their values.


What is Dynamic String Internationalization technique in GWT?

This technique is very flexible but slower than static string internationalization. Host page contains the localized strings therefore, applications are not required to be recompiled when we add a new locale. If GWT application is to be integrated with an existing server-side localization system, then this technique is to be used.


What is Localizable Interface internationalization technique in GWT?

This technique is the most powerful among the three techniques. Implementing Localizable allows us to create localized versions of custom types. It's an advanced internationalization technique.


Which tag of *.gwt.xml is used to support internationalization in GWT application?

extend-property tag with attribute name set as locale and values as language specific locale, say de for german locale.


How to enable history support in GWT application?

In order to use GWT History support, we must first embed following iframe into our host HTML page. <iframe src="javascript:''" id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>


What is GWT logging framework?

The logging framework emulates java.util.logging, so it uses the same syntax and has the same behavior as server side logging code. GWT logging is configured using .gwt.xml files. We can configure logging to be enabled/disabled; we can enable/disable particular handlers, and change the default logging level.

What is SystemLogHandler in GWT?

SystemLogHandler logs to stdout and these messages can only be seen in Development Mode in the DevMode window.

What is DevelopmentModeLogHandler in GWT?

DevelopmentModeLogHandler logs by calling method GWT.log. These messages can only be seen in Development Mode in the DevMode window.

What is ConsoleLogHandler in GWT?

ConsoleLogHandler logs to the javascript console, which is used by Firebug Lite (for IE), Safari and Chrome.

What is FirebugLogHandler in GWT?

FirebugLogHandler logs to Firebug console.

What is PopupLogHandler in GWT?

PopupLogHandler logs to the popup which resides in the upper left hand corner of application when this handler is enabled.


What is SimpleRemoteLogHandler in GWT?

This handler sends log messages to the server, where they will be logged using the server side logging mechanism.
Previous Post Next Post