Affects Version/s: 6.2.X EE, 7.0.X, Master
Component/s: JS APIs and Utilities
Backported to Branch:Committed
Git Pull Request:
What problem did the customer find?:Embedding a portlet in a web content using Liferay.widget code, and rendering that web content in a page results in that portlet being displayed in fullscreen when accessing the page
What do you think is the root cause? (if known):X-PJAX header is sent to the server when you click page link from the navigation portlet. This does not happen when writing the URL in the browser or when reloading page.
We checked that the presence of that header is the key factor for the behavior to happen
Hi FEI Product Team.
If we use the above code as part of a regular portal page, there is a weird behavior: page does not load completely, and only the portlet rendered via Liferay.widget loads in full screen. You can reproduce this as follows.
Steps to reproduce
- Go to "Configuration" of the "Hello World" portlet > Sharing > Copy the contents of the code field
- Site > Content > Web Content > add a web content > change the content field to code view > paste the copied code > Publish
- Create a new page and add a "Web Content Display" portlet to the page
- "Configuration" of the "Web Content Display" portlet > select the web content you just created > save
- 70x GIT ID: 328b10712a359b794c3a8d19f105bec2fe52e6d0
- master GIT ID: 9af9d3b0f7b4948bae0fa9e9e23a3e7084747937
I'd expect page lo load normally when we use the Liferay.Widget function in all cases, regardless we activate pjax or not in the http request.
What I did so far
I tried to identify the conditions under this get reproduced, and discovered that:
- Issue reproduces every time you click on the link to the page having the web content. I mean, the link available in the navigation portlet
- Issue never reproduces when you write the URL in the browser manually
- Issue never reproduces when, once it's reproduced, you hit F5
As this was a bit puzzling to me (URL in the request is pretty much the same in the 3 cases above), I deeply analyzed the HTTP Request sent to the server and found a key difference:
- Every time issue reproduces, HTTP request contains the headers X-PJAX:true and X-Requested-With:XMLHttpRequest
- When the headers are not present, issue never reproduces
This lead me to conclude that PJAX logic is interfering somehow with the regular page loading.
- I also took some snapshots with chrome dev tools and profile info shows idle time once portlet is loaded
- A page with only the IFrame portlet loads normally so the <iframe> tag used by the Liferay.widget seems not be causing this
- Disabling SPA has no effect
What I'm requesting
As this happens with any portlet, we concluded that the right component is front-end infrastructure. We would need assistance in diagnosing the root cause of this and, if possible, any help to fix this.
Thanks so much