0

I'm facing a peculiar issue. I have a single page app based on SpringBoot, JoinFaces and PrimeFaces 6.2. The page primarily has an Accordion with two tabs.

Tab 1 - has a <p:fileUpload> //user uploads XML files using it
Tab 2 - has a <p:layout> //the selected XML file's content is displayed here, segregated into two <p:layoutunit>

After the Accordion I have a toolbar with a submit button by which I send the selected XML to a back end service that converts the XML data into a PDF. I then display the PDF using PrimeFaces-Extension's <pe:documentViewer> inside a <p:dialog>

The issue: The flow works fine till I click on refresh on the browser. If I refresh the page, I notice the CSS for the <p:fileUpload> and <p:layout> goes wrong. (Also, the <p:fileUpload> stops working as well).

enter image description here enter image description here

Observation 1: When I compare the HTML source, before and after the refresh I see that after refresh, the page doesn't have these includes under <head>:

<link type="text/css" rel="stylesheet" href="/javax.faces.resource/fileupload/fileupload.css.xhtml?ln=primefaces&amp;v=6.2" />
<script type="text/javascript" src="/javax.faces.resource/fileupload/fileupload.js.xhtml?ln=primefaces&amp;v=6.2"></script>
<link type="text/css" rel="stylesheet" href="/javax.faces.resource/layout/layout.css.xhtml?ln=primefaces&amp;v=6.2" />
<script type="text/javascript" src="/javax.faces.resource/layout/layout.js.xhtml?ln=primefaces&amp;v=6.2"></script>

Any idea what may be causing this and how to correct it?

Observation 2: The bean KWOMTesterController is currently marked with @Named. If I annotate it with javax.faces.view.ViewScoped as well, then the UI issue is resolved, but the <pe:documentViewer> complains of missing PDF (the bean has a DefaultStreamedContent field, where I store the PDF data).

Code snippet: Here is my XHTML snippet:

<p:accordionPanel id="mainpanel"  activeIndex="0" binding="#{kwomTesterController.accordian}" cache="false">
    <p:tab title="Select target environment and KWOM XML">
        <p:panel>
            <p:fileUpload update=":mainform" label="Select KWOM XML"
                value="#{kwomTesterController.selectedFileName}" multiple="false" skinSimple="false" auto="true"
                fileUploadListener="#{kwomTesterController.handleUpload}" style="margin-top:20px" mode="advanced"/>
        </p:panel>
    </p:tab>

    <p:tab title="View/Edit selected KWOM XML " >
        <p:layout style="width:100%;height:360px;">
            <p:layoutUnit position="west" resizable="false" size="400" header="Configuration section">
               ...
               ...
               ...
            </p:layoutUnit>


            <p:layoutUnit position="center" header="Data section" style="overflow:hidden !important">
               <p:inputTextarea  rows="20" cols="138" autoResize="false" style="resize: none;" id="contentarea" 
                    value="#{kwomTesterController.data}" />
            </p:layoutUnit>

        </p:layout> 
    </p:tab>
</p:accordionPanel>
Tatha
  • 131
  • 1
  • 13
  • How do you refresh the page? And what is your version info of JSF and springboot? And did you inspect the network traffic? Errors? – Kukeltje Sep 27 '19 at 11:38
  • @Kukeltje I'm just either hitting F5 or the reload icon on Chrome. Same issue on IE and FF as well. Springboot - 2.1.0 (via Springboot-starter-parent 2.1.0) and I see javax.faces-2.3.7.jar getting bundled inside the FAT jar that maven is building. Network traffic shows no errors at all. – Tatha Sep 27 '19 at 11:55
  • In fact, I see in the Network...that there is request going out for the layout.css.xhtml and fileupload.css.xhtml only when I access the page for the first time. When I hit F5, there is no request going out under Network, for those two particular resources. – Tatha Sep 27 '19 at 12:03
  • Changing the bean to javax.faces.view.ViewScoped, shows those two resources requests correctly under Network, each time I hit F5 (I guess, that's how it should be). However, making the bean ViewScoped, breaks off DocumentViewer's behavior. – Tatha Sep 27 '19 at 12:05
  • Normally I'd just say, please create a [mcve] with also reading https://www.stackoverflow.com/tags/jsf/info. But I'm in a good mood so I'll ask other things as well... Are you using a template? If so can you add a dummy (hidden) fileUpload and layout in there? – Kukeltje Sep 27 '19 at 12:46
  • And do you have errors on the browser console? https://github.com/primefaces/primefaces/issues/3457 – Kukeltje Sep 27 '19 at 13:06
  • Not using templates..no errors in browser console either. I would surely try creating a minimal reproducible example (that's the reasonable thing to do). For the moment, I took out the JS and CSS for `fileupload` and `layout` from PF6.2 jar and dumped it into my code-base and referred them from the XHTML. (very bad solution though, from future perspective, but solves the purpose right now). – Tatha Sep 29 '19 at 12:59
  • Do you use an `update="@all"`? – Kukeltje Sep 29 '19 at 13:27
  • Nope. Using specific updates only for interested components, throughout the XHTML. – Tatha Sep 30 '19 at 18:16
  • Then there is only one thing remaining (and already mentioned): [mcve] – Kukeltje Sep 30 '19 at 18:22

0 Answers0