got5 / tapestry5-jquery

Tapestry5-jquery module is focusing on overriding some core component like Datefield & providing a collections of jQuery components
Other
112 stars 69 forks source link

Dialog demo throws exception #340

Closed luberti closed 9 years ago

luberti commented 9 years ago

Hi, I'd like to add tapestry5-jquery to the tutorial project but I get an exception. I'm not sure if it is a tapestry issue or a tapestry5-jquery one . I have already posted on the google group but got no answer, so I try here. I'm using tapesrty 5.3.7 and tapestry5-jquery 3.3.8

Here is the exeption that doesn't seem to report any tapestry5jquery path but is throhwn when rendering a page with the following template

<html t:type="layout" title="About tutorial1" xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd" xmlns:p="tapestry:parameter">

<t:jquery.dialog t:clientId="myDialog">
    Dialog test!
    <t:zone t:id="myZone" id="myZone">${count}

        <t:form>
            Try "abcd" :<input t:type="TextField" type="text"

t:id="goalName" t:value="goalName" /> /t:form /t:zone

</t:jquery.dialog>

<h3>Dialog Link</h3>
<t:jquery.dialoglink t:id="link1"

t:dialog="myDialog">Open/t:jquery.dialoglink

<h3>Dialog Ajax Link</h3>
<t:jquery.dialogajaxlink t:id="link2" t:dialog="myDialog"

t:zone="myZone"> Open /t:jquery.dialogajaxlink

and the following java class

package it.archicoop.met.obliterazione.pages;

import java.util.ArrayList; import java.util.List;

import it.archicoop.met.obliterazione.annotations.PublicPage; import it.archicoop.met.obliterazione.services.CountryNames;

import org.apache.tapestry5.EventConstants; import org.apache.tapestry5.annotations.Component; import org.apache.tapestry5.annotations.OnEvent; import org.apache.tapestry5.annotations.Persist; import org.apache.tapestry5.annotations.Property; import org.apache.tapestry5.corelib.components.Zone; import org.apache.tapestry5.ioc.annotations.Inject; import org.apache.tapestry5.services.Request; import org.got5.tapestry5.jquery.mixins.Autocomplete;

@PublicPage public class DocsJQueryDialog extends Autocomplete {

@Inject
private CountryNames countryNames;

@Component
private Zone myZone;

@Persist
private Integer count;

@Inject
private Request request;

@Property
private String goalName;

@OnEvent(EventConstants.ACTIVATE )
void init(){

    if (count == null)
        count = 0;
}

public Integer getCount(){
    return count++;
}

@OnEvent(EventConstants.ACTION)
Object updateCount(){

    if (!request.isXHR()) { return this; }
        return myZone;
}

List<String> onProvideCompletionsFromGoalName(String partial) {
    List<String> matches = new ArrayList<String>();
    partial = partial.toUpperCase();

    for (String countryName : countryNames.getSet()) {
        if (countryName.contains(partial)) {
            matches.add(countryName);
        }
    }

    return matches;
}

}

Please note that removing references to

import org.got5.tapestry5.jquery.mixins.Autocomplete;

the component is showed but the ajax link, while indeed called (I can debug the listener) doesn't open the dialog.

The non ajax link works

I have double checked classpath because I had first tried to use tapestry5jquery 3.3.4, following advice by Geoff on 3.3.5 and 3.3.6 giving problems in production mode.

Then upgraded to 3.3.7 in order to get rid of this exception but with no avail

[ERROR] pages.DocsJQueryDialog Render queue error in AfterRender[DocsJQueryDialog]: org.apache.tapestry5.ioc.internal.util.TapestryException org.apache.tapestry5.ioc.internal.util.TapestryException at org.apache.tapestry5.internal.structure.ComponentPageElementImpl$AbstractPhase.invoke(ComponentPageElementImpl.java:158) at org.apache.tapestry5.internal.structure.ComponentPageElementImpl$AfterRenderPhase.render(ComponentPageElementImpl.java:390) at org.apache.tapestry5.internal.services.RenderQueueImpl.run(RenderQueueImpl.java:72) at org.apache.tapestry5.internal.services.PageRenderQueueImpl.render(PageRenderQueueImpl.java:124) at $PageRenderQueue_97272f8a6116.render(Unknown Source) at $PageRenderQueue_97272f8a610f.render(Unknown Source) at org.apache.tapestry5.internal.services.MarkupRendererTerminator.renderMarkup(MarkupRendererTerminator.java:37) at org.got5.tapestry5.jquery.services.js.JSModule$1.renderMarkup(JSModule.java:40) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$31.renderMarkup(TapestryModule.java:1994) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$30.renderMarkup(TapestryModule.java:1978) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$29.renderMarkup(TapestryModule.java:1960) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$28.renderMarkup(TapestryModule.java:1945) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$27.renderMarkup(TapestryModule.java:1931) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$26.renderMarkup(TapestryModule.java:1913) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at org.apache.tapestry5.services.TapestryModule$25.renderMarkup(TapestryModule.java:1894) at $MarkupRenderer_97272f8a611a.renderMarkup(Unknown Source) at $MarkupRenderer_97272f8a6115.renderMarkup(Unknown Source) at org.apache.tapestry5.internal.services.PageMarkupRendererImpl.renderPageMarkup(PageMarkupRendererImpl.java:47) at $PageMarkupRenderer_97272f8a6113.renderPageMarkup(Unknown Source) at org.apache.tapestry5.internal.services.PageResponseRendererImpl.renderPageResponse(PageResponseRendererImpl.java:67) at $PageResponseRenderer_97272f8a6109.renderPageResponse(Unknown Source) at org.apache.tapestry5.internal.services.PageRenderRequestHandlerImpl.handle(PageRenderRequestHandlerImpl.java:64) at org.apache.tapestry5.services.TapestryModule$38.handle(TapestryModule.java:2222) at $PageRenderRequestHandler_97272f8a610b.handle(Unknown Source) at $PageRenderRequestHandler_97272f8a6096.handle(Unknown Source) at org.apache.tapestry5.internal.services.ComponentRequestHandlerTerminator.handlePageRender(ComponentRequestHandlerTerminator.java:48) at it.archicoop.met.obliterazione.services.PageProtectionFilter.handlePageRender(PageProtectionFilter.java:64) at $ComponentRequestFilter_97272f8a6094.handlePageRender(Unknown Source) at $ComponentRequestHandler_97272f8a6097.handlePageRender(Unknown Source) at org.apache.tapestry5.services.InitializeActivePageName.handlePageRender(InitializeActivePageName.java:47) at $ComponentRequestHandler_97272f8a6097.handlePageRender(Unknown Source) at $ComponentRequestHandler_97272f8a6057.handlePageRender(Unknown Source) at org.apache.tapestry5.internal.services.PageRenderDispatcher.dispatch(PageRenderDispatcher.java:45) at $Dispatcher_97272f8a605b.dispatch(Unknown Source) at $Dispatcher_97272f8a6054.dispatch(Unknown Source) at org.apache.tapestry5.services.TapestryModule$RequestHandlerTerminator.service(TapestryModule.java:302) at it.archicoop.met.obliterazione.services.AppModule$1.service(AppModule.java:126) at $RequestFilter_97272f8a6053.service(Unknown Source) at $RequestHandler_97272f8a6055.service(Unknown Source) at org.apache.tapestry5.internal.services.RequestErrorFilter.service(RequestErrorFilter.java:26) at $RequestHandler_97272f8a6055.service(Unknown Source) at org.apache.tapestry5.services.TapestryModule$3.service(TapestryModule.java:902) at $RequestHandler_97272f8a6055.service(Unknown Source) at org.apache.tapestry5.services.TapestryModule$2.service(TapestryModule.java:892) at $RequestHandler_97272f8a6055.service(Unknown Source) at org.apache.tapestry5.internal.services.StaticFilesFilter.service(StaticFilesFilter.java:90) at $RequestHandler_97272f8a6055.service(Unknown Source) at org.apache.tapestry5.internal.services.CheckForUpdatesFilter$2.invoke(CheckForUpdatesFilter.java:105) at org.apache.tapestry5.internal.services.CheckForUpdatesFilter$2.invoke(CheckForUpdatesFilter.java:95) at org.apache.tapestry5.ioc.internal.util.ConcurrentBarrier.withRead(ConcurrentBarrier.java:85) at org.apache.tapestry5.internal.services.CheckForUpdatesFilter.service(CheckForUpdatesFilter.java:119) at $RequestHandler_97272f8a6055.service(Unknown Source) at $RequestHandler_97272f8a6048.service(Unknown Source) at org.apache.tapestry5.services.TapestryModule$HttpServletRequestHandlerTerminator.service(TapestryModule.java:253) at org.got5.tapestry5.jquery.services.AjaxUploadServletRequestFilter.service(AjaxUploadServletRequestFilter.java:27) at $HttpServletRequestHandler_97272f8a604a.service(Unknown Source) at org.apache.tapestry5.upload.internal.services.MultipartServletRequestFilter.service(MultipartServletRequestFilter.java:44) at $HttpServletRequestHandler_97272f8a604a.service(Unknown Source) at org.apache.tapestry5.internal.gzip.GZipFilter.service(GZipFilter.java:53) at $HttpServletRequestHandler_97272f8a604a.service(Unknown Source) at org.apache.tapestry5.internal.services.IgnoredPathsFilter.service(IgnoredPathsFilter.java:62) at $HttpServletRequestFilter_97272f8a6044.service(Unknown Source) at $HttpServletRequestHandler_97272f8a604a.service(Unknown Source) at org.apache.tapestry5.services.TapestryModule$1.service(TapestryModule.java:852) at $HttpServletRequestHandler_97272f8a604a.service(Unknown Source) at $HttpServletRequestHandler_97272f8a6043.service(Unknown Source) at org.apache.tapestry5.TapestryFilter.doFilter(TapestryFilter.java:171) at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:235) at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233) at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191) at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127) at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:103) at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109) at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:293) at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:861) at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:606) at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489) at java.lang.Thread.run(Thread.java:662) Caused by: java.lang.NullPointerException at org.apache.tapestry5.internal.transform.InjectContainerWorker$1$1.get(InjectContainerWorker.java:80) at org.got5.tapestry5.jquery.mixins.Autocomplete.conduit_get_field(Autocomplete.java) at org.got5.tapestry5.jquery.mixins.Autocomplete.afterRender(Autocomplete.java:134) at org.got5.tapestry5.jquery.mixins.Autocomplete.afterRender(Autocomplete.java) at org.apache.tapestry5.internal.structure.ComponentPageElementImpl$AfterRenderPhase.invokeComponent(ComponentPageElementImpl.java:380) at org.apache.tapestry5.internal.structure.ComponentPageElementImpl$AbstractPhase.invoke(ComponentPageElementImpl.java:138) ... 85 more

got5 commented 9 years ago

Hi,

I guess the problem come from your refactoring.

if you have a closer look at the original version (https://github.com/got5/tapestry5-jquery-demo/blob/master/src/main/java/org/got5/tapestry5/jquery/pages/components/DocsJQueryDialog.java)

you will see that this page extends org.got5.tapestry5.jquery.pages.core.Autocomplete.

Your copy of this page import org.got5.tapestry5.jquery.mixins.Autocomplete which is a mixin not page.

I would suggest to copy the Autocomplete page or to insert the code in you page.

luberti commented 9 years ago

Thank you for your answer: I couldn't find the link to download the demo (and still I can find it in your web site and is not listed on GOT Git home page) so I copied the code from the home page and guessed the import (they are not reported there). BTW I have not org.got5.tapestry5.jquery.pages in my classpath and I cannot find it in source code of tapestry5jquery 3.3.7 So I guess the demo is related to tapestry5jquery 4.0.0 . But I'm using Tapestry 5.3.7. Where I can find sample code for tapestry5jquery 3.3.7?

luberti commented 9 years ago

Sorry: another note if I remove references to autocomplete both in the java and tml files, the page is dipslayed, the non ajax link opens the dialog but the ajax link calls the listener in the page the counter is updated but the dialog is not showed

got5 commented 9 years ago

the tagged version 0.0.1 is using 3.3.8 of Tapestry-jquery https://github.com/got5/tapestry5-jquery-demo/blob/0.0.1/src/main/java/org/got5/tapestry5/jquery/pages/core/Autocomplete.java

the test pages for 3.3.7 could also be considered as sample see also tagged version at https://github.com/got5/tapestry5-jquery/blob/v3.3.7/src/test/java/org/got5/tapestry5/jquery/pages/JQueryDialog.java

perhaps the second page will be easier for your to understand.

luberti commented 9 years ago

The second link is where I ended up removing the autocomplete by myself.

But even not trusting myself and copying your code:

https://github.com/got5/tapestry5-jquery/blob/v3.3.7/src/test/java/org/got5/tapestry5/jquery/pages/JQueryDialog.java

and

https://github.com/got5/tapestry5-jquery/blob/v3.3.7/src/test/resources/org/got5/tapestry5/jquery/pages/JQueryDialog.tml

The ajax link doesn't open the dialog but calls the server.

If I open the dialog with the non ajax link and then I click on the AjaxLink the zone is updated (count is increased). If first I click on the Ajax link and then on the other I find that the count had been updated even if the windows had not been open.

It seems a pure javascript issue

Tried on both Chrome and Firefox

criedel commented 9 years ago

Maybe it’s a bit offtopic, but why was version 3.3.7 patched and released as 3.3.8 when there was a version 3.4.0? Have you tested your code against this version as well?

luberti commented 9 years ago

Just done it: same as 3.3.7

criedel commented 9 years ago

I just started the demo app but I can't reproduce any broken behaviour. Sure that zone gets updated every time an action event happens (clicking the ajax link is one). Not a bug, it’s a feature ;-) What are you trying to accomplish here?

luberti commented 9 years ago

Sorry I have not been clear: the point is that zone is updated as expected but the dialog is not open with the ajax link whiile is open with the ordinary link. I hope I have explained better now.

criedel commented 9 years ago

And am I correct that you copied the code? It works on my machine (and during selenium tests). Try to check out the tapestry5-jquery source code and do mvn jetty:run go to http://localhost:8080/tapestry5-jquery/jquerydialog. I bet some of your custom code broke something. If there are javascript errors zone updates are most likely not working.

luberti commented 9 years ago

Ok fine it has to work. Tomorrow I will try starting a project from scratch using tapestry tutorial and then dropping in your code. BTW i use Tomcat not Jetty and I tried firebug to see if some other javascript error was there. But nothing. thanks for now

luberti commented 9 years ago

Found the issue. In my app module I have

configuration.add(JQuerySymbolConstants.SUPPRESS_PROTOTYPE, "false"); // We don't use $j in our javascript - instead we use function scoping (see // http://api.jquery.com/jQuery.noConflict/) // but we need this next line to keep Tapestry happy (since Tapestry 5.3.4). configuration.add(JQuerySymbolConstants.JQUERY_ALIAS, "$j");

following an advice from Geoff Callender of jumpstart. When removed those lines of code and restarted the app , ajax link to open dialog started to work in my project.

Does this means that I cannot keep prototype in my project whne using tapestry5jquery? Not a big issue for me, I'm not going to use it.

criedel commented 9 years ago

Well you can keep both, it’s just that some components (such as the dialog component) was written against the slightly different tapestry-jquery.js.

                zone.tapestryZone("update", {
                    url: url,
                    callback: function() {
                        dialog.dialog('open');
                    }
                });

This code is executed onClick of the dialogAjaxLink. This code zone.tapestryZone("update" ...) calls the jquery ui component “tapestryZone”, which does not exist, since it is only created if configuration.add(JQuerySymbolConstants.SUPPRESS_PROTOTYPE, "true"); and thus tapsestry-jquery.js is injected into the page.

In my opinion the tapestry-jquery components that rely on tapestry-jquery.js to be present should be labeled accordingly (as unsupported) or get a prototype version of their xyz-component.js. Having a quick look over the source of other components’ JS files I found some more that won’t work in prototype-mode (e.g. ZoneRefresh and ZoneDroppable mixin, ImageCropper, RangeSlider, Slider).

It’s probably quite easy to come up with alternative scripts but since you don’t actually need it and nobody else complained about it I’m not going to fix it ;-)

luberti commented 9 years ago

Ok clear to me, I'm not so selfish to ask for this. But is this going to be an issue also in tapestry5Jquery 4.x , with the heavy refactored javascript support of Tapestry5.4 ?

luberti commented 9 years ago

To be precise, actually

//configuration.add(JQuerySymbolConstants.SUPPRESS_PROTOTYPE, "false"); configuration.add(JQuerySymbolConstants.JQUERY_ALIAS, "$j");

still works.

criedel commented 9 years ago

Haven’t looked into the new code yet, but it might also be broken in the newer versions. Try it out ;-)

...and changing only the jquery alias does not break anything, of course, but suppressing prototype breaks code because it actually removes code that the above mentioned components rely on.

luberti commented 9 years ago

I will try to find the time soon...

luberti commented 9 years ago

BTW you should put in evidence some way that the demo package esxists

luberti commented 9 years ago

I couldn't resist :-)

Actually the demo comes with:

configuration.add(JQuerySymbolConstants.SUPPRESS_PROTOTYPE, "true"); configuration.add(JQuerySymbolConstants.JQUERY_ALIAS, "$");

but replacing them with

configuration.add(JQuerySymbolConstants.SUPPRESS_PROTOTYPE, "false"); configuration.add(JQuerySymbolConstants.JQUERY_ALIAS, "$j");

doesn't prevent the ajax link for dialog to behave correctly

criedel commented 9 years ago

You mean the new 4.x against T5.4? That’s great!

luberti commented 9 years ago

To be precise:

<properties>
    <tapestry-release-version>5.4-beta-22</tapestry-release-version>
    <tapestry-jquery-release-version>4.0.1-SNAPSHOT</tapestry-jquery-release-version>
</properties>

BTW there are a lot of things don't work in the demo: source code is not shwed for example. Just to cool you off a little bit :-)

ffacon commented 9 years ago

In the demo project, the path related to location of the source code have to be defined otherwise the view source component won't work.

Regards François