Gantt Doesnt work inside "iframe"

#1

Demo for the issue with simple code

https://nsdevaraj.github.io/dhtmlx/ - DHTMLX doesnt work

https://nsdevaraj.github.io/dhtmlx/hindex.html - HighCharts works fine on same code

#2

I can confirm this problem.
For me, this event attaching part is where it dies:

image
image.png1227x386 17.1 KB

#3

Where the variable “e” is the newly created iframe, but for some reason it’s blocked:

image
image.png953x335 18.2 KB

#4

Any estimated timeline for fix ?!

#5

Hello Devaraj,
Looks like the issue occurs because of the sandbox option:

<iframe src="test.html" sandbox="allow-scripts" frameborder="0" style="overflow:hidden;height:100%;width:100%" height="100%" width="100%"></iframe>

With that option, you only allow loading scripts:
https://www.w3schools.com/tags/att_iframe_sandbox.asp
Gantt. however, creates an iframe to detect that its container’s sizes are changed. With these settings, there is no way to make the Gantt’s iframe work.

You need to remove the sandbox option or add the allow-same-origin value there:

<iframe src="test.html" sandbox="allow-scripts allow-same-origin" frameborder="0" style="overflow:hidden;height:100%;width:100%" height="100%" width="100%"></iframe>

https://files.dhtmlx.com/30d/f18a0b8b5b9e54bca1bfc2ecba81d76d/vokoscreen-2020-08-14_14-49-50.mkv

#6

I’m writing a component that’s embedded by a platform/website inside an iframe not written by me. So it’s not possible to modify the iframe. In this case, there’s nothing I could do to use Gantt in my component?

EDIT: My company is evaluating if we should buy the Gantt chart, however this limitation is unfortunately a blocker for us.

EDIT2 as I can’t write a 3rd comment:
We are also interested in this solution, as we would like to create a proof of concept project using this Gantt chart. How can we get this temporary build? (We would need an npm package.) If you could contact me in a private message, I can give you my corporate email. Thanks in advance!

#7

allow-same-origin can’t be added as it results in violation and its a huge ‘blocker’ for us to buy your product

#8

Hello,
Thank you for the clarification. If there is no way to add that property to the iframe, that makes Gantt unusable in the iframe environment. I will add it as a bug in our internal tracker. The dev team will fix it in the future, but I cannot give you any ETA.
You can contact the support team according to the instructions in the email with the license and mention this topic. I will send you a temporary build where Gantt tries to attach an event in a way that won’t crash Gantt.

#9

Hello,
The dev team fixed the bug. The fix is included in the 7.0.9 version:
https://docs.dhtmlx.com/gantt/whatsnew.html#709