Gwt Material Design: MaterialSlider not working in classic dev mode

Question

Here is the exception that gets displayed on the Browser.

java.lang.reflect.InvocationTargetException 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.ModuleSpace.onLoad(ModuleSpace.java:423) at com.google.gwt.dev.shell.OophmSessionHandler.loadModule(OophmSessionHandler.java:200) at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:530) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:368) at java.lang.Thread.run(Unknown Source) Caused by: com.google.gwt.core.client.JavaScriptException: (null) @gwt.material.design.jquery.client.api.JQuery::$(Lcom/google/gwt/dom/client/Element;)([JavaScript object(8)]): null at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:252) at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:121) at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:573) at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:293) at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) at gwt.material.design.jquery.client.api.JQuery.$(JQuery.java) at gwt.material.design.jquery.client.api.JQuery.$(JQuery.java:167) at gwt.material.design.client.base.MaterialWidget.$this(MaterialWidget.java:157) at com.mdesign.vadiraj.client.MaterialDesignWithCarousel.onModuleLoad(MaterialDesignWithCarousel.java:32) ... 9 more

Here is the exception from Eclipse console.

14:34:14.799 [ERROR] [materialdesignwithcarousel] Unable to load module entry point class com.mdesign.vadiraj.client.MaterialDesignWithCarousel (see associated exception for details)

com.google.gwt.core.client.JavaScriptException: (null) @gwt.material.design.jquery.client.api.JQuery::$(Lcom/google/gwt/dom/client/Element;)([JavaScript object(8)]): null at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:252) at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:121) at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:573) at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:293) at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91) at gwt.material.design.jquery.client.api.JQuery.$(JQuery.java) at gwt.material.design.jquery.client.api.JQuery.$(JQuery.java:167) at gwt.material.design.client.base.MaterialWidget.$this(MaterialWidget.java:157) at com.mdesign.vadiraj.client.MaterialDesignWithCarousel.onModuleLoad(MaterialDesignWithCarousel.java:32) 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.ModuleSpace.onLoad(ModuleSpace.java:423) at com.google.gwt.dev.shell.OophmSessionHandler.loadModule(OophmSessionHandler.java:200) at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:530) at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:368) at java.lang.Thread.run(Unknown Source)

This is my project setup - Java 1.8 | GWT 2.8.1 | Classic dev-mode

inherits name="gwt.material.design.jquery.JQuery"

inherits name='gwt.material.design.GwtMaterialWithJQuery'

inherits name="gwt.material.design.GwtMaterialDesignBasic"

Attaching the code snippet from the Entrypoint class

public void onModuleLoad() {

    MaterialSlider slider = new MaterialSlider();
    RootPanel.get().add(slider);

    slider.add(new Label("safrfsdhhdf"));
    slider.add(new Button("I am a button"));
    slider.add(new TextArea());
    slider.add(new MaterialSwitch(true));
}

Answer 1

GWT Material Design uses JsInterop which doesn't work in legacy dev mode (nobody should continue to use legacy dev mode these days anyway, it's been deprecated for years)