Print this page

Users using DOJO script referenced in VF page fails to load reports referenced through analytics:reportChart tag

Knowledge Article Number 000212856
Description Using analytics:reportChart tag in visualforce page and referring dojo toolkit with version (>1.6)  fails to load reports.

EX:
<apex:page >
  <script src="https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dojo/dojo.js"></script>
  <analytics:reportChart reportId="00OK0000000dZ0b" size="small"/>
</apex:page>


Checking browser console following errors would be seen:

Uncaught ReferenceError: ES6Promise is not defined aura_prod.js:38
Uncaught TypeError: Cannot read property 'initDefs' of undefined app.js:1
Uncaught TypeError: undefined is not a function testReport:33
Uncaught TypeError: undefined is not a function testReport:4661

                   

 
Resolution (1) This problem is caused by a conflict with Dojo 1.7+ and an aura component that's included on the Visualforce page (reportChart). After Dojo 1.7, the authors included an AMD loader in the library, which implements global 'define' and 'require' functions. Its these methods that cause our aura components to break.

(2) Although we do encourage the inclusion of external javascript libraries on Visualforce pages, there isn't any way we can guarantee all versions of these frameworks won't interfere with our standard functionality, as we've no control over any changes the authors may implement. Generally, if the framework implements something that breaks our functionality, we'd suggest they either exclude the framework, or alternatively customize the framework to avoid whatever conflict it causes.

(3) Dojo 1.7+ seem to be one of only a few mainstream frameworks that implement these methods -- the latest versions of jquery or ExtJS don't.

As a workaround, either use an older version of Dojo (<1.7), or could create a custom version of Dojo to exclude the global 'define' and 'require' methods (that are part of the AMD loader).

 




promote demote