-
Type:
Bug
-
Status: Closed
-
Resolution: Fixed
-
Affects Version/s: 6.2.X EE, 7.0.X, Master
-
Fix Version/s: 7.0.0 DXP FP35, 7.0.0 DXP SP7, 7.0.5 CE GA6, 7.0.X, 7.1.0 M1, 7.1.X, Master
-
Component/s: JS APIs and Utilities
-
Branch Version/s:7.0.x
-
Backported to Branch:Committed
-
Fix Priority:4
-
Sprint:S01E03-"One-Eyed"Willy's hoard
-
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):
Hi FEI Product Team.
a customer reported an issue that is hard for us to diagnose due to the lack of knowledge about the specific interactions taking place between the javascript libraries and PJAX content loading logic. That's the reason why we need to escalate the final diagnose (and probably fix) of this bug.
Description
Any portlet provides a sharing functionality available in the Portlet Configuration popup. This functionality allows to render the portlet programatically via javascript and the use of the Liferay.Widget component. Here is an example for master:
<script src="https://liferay-master.wedeploy.io/o/frontend-js-web/liferay/widget.js" type="text/javascript"></script> <script type="text/javascript"> Liferay.Widget({url: 'https://liferay-master.wedeploy.io/widget/web/guest/home/-/com_liferay_hello_world_web_portlet_HelloWorldPortlet'}); </script>
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
Reproduced in:
- DE-32
- 70x GIT ID: 328b10712a359b794c3a8d19f105bec2fe52e6d0
- master GIT ID: 9af9d3b0f7b4948bae0fa9e9e23a3e7084747937
Expectation
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.
Additional tests:
- 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