Page reload throws (TypeError) : $wnd.$ is not a function

[mitrakov]

I have a standard GWT MaterialDesign project with a MaterialDataTable When I try to reload page with a single simple MaterialDataTable in superdev mode it throws:

Error: com.google.web.bindery.event.shared.UmbrellaException: Exception caught: (TypeError) : $wnd.$ is not a function

But when I navigate to it, it works normally!

Looks like jQuery module is too late to load to get MaterialDataTable started.

The exception is caught in Eventbus:

_.doFire_0_g$ = function tMb_g$(event_0_g$, source_0_g$){
  ...
  if (EWb_g$(causes_0_g$)) {
    throw mXb_g$(new hNb_g$(causes_0_g$));
  }

I have all the required dependencies installed:

<inherits name="gwt.material.design.GwtMaterialBasicWithJQuery"/>
<inherits name="gwt.material.design.addins.GwtMaterialAddins"/>
<inherits name="gwt.material.design.GwtMaterialTable"/>

How to reproduce: 1) install basic app:

mvn archetype:generate -DarchetypeGroupId=com.github.gwtmaterialdesign -DarchetypeArtifactId=gwt-material-archetype -DarchetypeVersion=2.1.1

2) Add nested slot to ApplicationPresenter (SLOT_MAIN) 3) Add a standard presenter module that uses Place "table":

@Inject
TablePresenter(EventBus eventBus, MyView view, MyProxy proxy) {
    super(eventBus, view, proxy, ApplicationPresenter.SLOT_MAIN);
}

4) Add MaterialDataTable to a view:

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
             xmlns:m="urn:import:gwt.material.design.client.ui"
             xmlns:m.table="urn:import:gwt.material.design.client.ui.table"
             xmlns:g="urn:import:com.google.gwt.user.client.ui">
    <m:table.MaterialDataTable />
</ui:UiBinder>

That's it. Run superdev mode.

• Try to reload main page and after that navigate to http://127.0.0.1:8888/#table - it works
• Try to reload http://127.0.0.1:8888/#table itself - it throws an exception

P.S. also reproducible on 2.2

[BenDol]

Are you using a MVP framework like GWTP? There seems to be an unresolved issue where the entrypoint is loading before GMD is able to load the javascript library. You can confirm this by manually loading JQuery in the index.html and using <inherits name="gwt.material.design.GwtMaterialDesignBasic"/>

[mitrakov]

Yep, you're absolutely right. I use out-of-the-box GWTP with MvpWithEntryPoint. Your workaround works. With jQuery 2.2.4. Thanks!

Is this idiomatic solution? What do you think should I open an issue for GWTP guys?

[kevzlou7979]

Ok figure it out whats causing it, it seems that on constructors when adding it on GWTP UiBinder it seems that jquery is not loaded. So we need to check on MaterialWidget constructor if Jquery is loaded if not then we need to inject it. Fixed via https://github.com/GwtMaterialDesign/gwt-material/commit/28d1300a08fb03ebb60df76bdef277995ded505b

[kevzlou7979]

We are reworking also the GMD Table demo for the latest Updates and documentation.

[kevzlou7979]

Also Dark Mode will be implemented to GMD DataTable too. Currently the Core supports Dark Mode https://gwtmaterialdesign.github.io/gmd-core-demo/

[BenDol]

@mitrakov I would say its subjective to your implementation, personally I would prefer loading JQuery myself, but also our JQuery jsinterop only supports v~2. Will try to figure out a solution to this issue when I have time.

Edit: no real need to open a GWTP issue just yet, I'll need to figure out why its happening first I think.

[mitrakov]

Yes, I noticed that jQuery 2.2.4 is the last version that works properly 🙂 Anyway, thank you guys, @BenDol , @kevzlou7979, I hope your patch with .checkJQuery(false) will really help!

As for now manual loading jQuery in html does the trick