Saturday, August 23, 2014

The style name 'z-index' should be in camelCase format

Here is one more exception we usually face while coding in GWT. When we try to give a style property to the element in the below way as we just give a property in CSS


getElement().getStyle().setProperty("z-index", "0");  

Immediately we run into the below exception,


19:13:16.700 [ERROR] [g4admin] Uncaught exception escaped  
 com.google.gwt.event.shared.UmbrellaException: Exception caught: The style name 'z-index' should be in camelCase format  
   at com.google.gwt.event.shared.HandlerManager.fireEvent(HandlerManager.java:129)  
   at com.google.gwt.user.client.ui.Widget.fireEvent(Widget.java:129)  
   at com.google.gwt.event.dom.client.DomEvent.fireNativeEvent(DomEvent.java:116)  
   at com.google.gwt.user.client.ui.Widget.onBrowserEvent(Widget.java:177)  
   at com.google.gwt.user.client.DOM.dispatchEventImpl(DOM.java:1351)  
   at com.google.gwt.user.client.DOM.dispatchEvent(DOM.java:1307)  
   at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)  
   at sun.reflect.NativeMethodAccessorImpl.invoke(Unknown Source)  
   at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)  
   at java.lang.reflect.Method.invoke(Unknown Source)  
   at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103)  
   at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71)  
   at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172)  
   at com.google.gwt.dev.shell.BrowserChannelServer.reactToMessagesWhileWaitingForReturn(BrowserChannelServer.java:338)  
   at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:219)  
   at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:136)  
   at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:571)  
   at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:279)  
   at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91)  
   at com.google.gwt.core.client.impl.Impl.apply(Impl.java)  
   at com.google.gwt.core.client.impl.Impl.entry0(Impl.java:242)  
   at sun.reflect.GeneratedMethodAccessor37.invoke(Unknown Source)  
   at sun.reflect.DelegatingMethodAccessorImpl.invoke(Unknown Source)  
   at java.lang.reflect.Method.invoke(Unknown Source)  
   at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:103)  
   at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71)  
   at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:172)  
   at com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:293)  
   at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:547)  
   at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:364)  
   at java.lang.Thread.run(Unknown Source)  
 Caused by: java.lang.AssertionError: The style name 'z-index' should be in camelCase format  
   at com.google.gwt.dom.client.Style$.assertCamelCase$(Style.java:2154)  
   at com.google.gwt.dom.client.Style$.setProperty$(Style.java:2021)  
   at com.g4.sportech.admin.client.Global.customelements.G4AdminDialogBox.<init>(G4AdminDialogBox.java:35) 
The cause is that the setPropety() won't allow us to give the direct style properties instead it allows only camel case letters. So the  above line turns in to good when you write 

getElement().getStyle().setProperty("zIndex", "0");  

That resolves the exception and below I mentioned few examples with CSS properties to get rid of the exception.

border-width - borderWidth
Post a Comment