2

I'm trying to use D3 Graph library in Lightning Component with LockerService activated.

The component works fine, but randomly it fails to load with error messages like:

Error Message in Chrome:

undefined:1 Uncaught (in promise)

Vo: undefined
action: null
data: null
handled: false
id: "5f378976-726c-448d-b674-a16d44338332"
lineNumber: undefined
message: "Action failed: ltng$require$controller$init [TypeError: d.get is not a function]"
name: "TypeError"
p: "ltng$require$controller$init"
pg: "    at $.z.get (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:517:118)↵    at eval (eval at Qx (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:102:341), <anonymous>:1:46)↵    at Ey.evaluate (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:165:75)↵    at sz.z.get (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:290:442)↵    at b.K.get (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:213:421)↵    at init (eval at Qx (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:102:341), <anonymous>:1:247)↵    at G.oc (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:275:169)↵    at Array.c (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:228:191)↵    at https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:265:359↵    at $.z.Za (https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:519:141)"

In Firefox:

Action failed: ltng$require$controller$init [TypeError: d.get is not a function]
z.get@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:517:116
.context.componentDefs<.v.facets<.value<.attributes.values.scripts.value.code@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js line 102 > eval:2:6134
Ey.prototype.evaluate@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:165:65
z.get@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:290:440
K.prototype.get@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:213:419
.controller.init@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js line 102 > eval:1:245
G.prototype.oc@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:275:161
c@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:228:189
O.prototype.M/<@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:265:355
z.Za@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:519:141
O.prototype.M@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:264:78
K.prototype.M@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:220:133
K@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:200:154
b@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:182:29
V.prototype.Sa@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:385:100
K@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:194:507
b@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:182:29
V.prototype.Sa@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:385:100
K@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:199:44
b@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:182:29
V.prototype.Sa@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:385:100
iB/<@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:376:7
z.Uc/<@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:516:138
G.prototype.kb@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:279:328
z.mj@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:567:290
Ny.prototype.mh@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:152:250
Oy/b<@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:151:125
CA@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:321:77
z.fg@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:351:149
ZC.prototype.Tk@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:564:383
Ny.prototype.mh@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:152:250
Ny.prototype.start@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:151:305
z.gg@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:348:83
.helper.onXHRReceived@https://pk1-dev-ed.lightning.force.com/l/%7B%22mode%22%3A%22PROD%22%2C%22app%22%3A%22one%3Aone%22%2C%22fwuid%22%3A%22g_fD27ilRP19XS8vPQMspA%22%2C%22loaded%22%3A%7B%22APPLICATION%40markup%3A%2F%2Fone%3Aone%22%3A%22Xv50AE01lSqOtUTeFMEgmw%22%7D%2C%22requestedLocales%22%3A%5B%22en_US%22%2C%22en%22%5D%2C%22ls%22%3A%22NY%22%7D/app.js:3480:298
z.Uc/<@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:516:138
Ny.prototype.mh@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:152:250
XC.prototype.Vk@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:561:465
Ny.prototype.mh@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:152:250
Ny.prototype.start@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:151:305
e@https://pk1-dev-ed.lightning.force.com/auraFW/javascript/g_fD27ilRP19XS8vPQMspA/aura_prod.js:344:101

Weirdest thing is, this error is completely random. It occurs on page load, and sometimes the d3 library is loaded and my chart is generated and most of the sometimes it throw these errors.

Try loading component first time. It works fine. Now press F5 to refresh browser. The error comes in. Keep pressing F5 to refresh browser multiple times, and in between in any attempt, the chart is again loaded fine and no errors, and again press F5 and error comes up again.

The errors usually occur silently in browser console, but sometimes they are thrown back to on screen with "Sorry to Interrupt" modal dialog.

Also, the errors are occurring when I load Lightning Component in Lightning Experience environment, but not when I load the Lightning Component by Previewing from Developer Console, from the preview dialog, it works fine everytime.

Also, when I enable Debug Mode for Lightning Components the same component shows following error messages in console:

WARNING: Access Check Failed! AuraComponentService.createComponentFromConfig(): 'markup://ltng:require' is not visible to 'markup://pk1:MyTestForceGraph {8:1;0}'. aura_proddebug.js:16468:7

WARNING: Access Check Failed! ComponentService.getDef():'markup://ltng:require' is not visible to 'markup://pk1:MyTestForceGraph {8:1;0}'. aura_proddebug.js:16468:7

TypeError: Action failed: ltng$require$controller$init [TypeError: valueProvider.get is not a function]

I'm building very simplest of the component, and error occurs even without calling any D3 functions, just loading it in ltng:require component.

Component Code:

<aura:component controller="MyTestForceGraphController" implements="force:appHostable,flexipage:availableForRecordHome,force:hasRecordId" access="global" >

    <aura:attribute name="recordId" type="Id" access="global" />

    <ltng:require scripts="{!$Resource.pk1__d3 + '/d3.v4.min.js'}"
                  afterScriptsLoaded="{!c.performInit}" />

    <div class="slds">
        <div class="slds-grid slds-grid--pull-padded">
          <div class="slds-col--padded" id="mytest-force-container" style="height:400px;"></div>
        </div>
    </div>

</aura:component>

MyTestGraphController.js

({
        performInit : function(component, event, helper) {

            console.log('****** performInit called **********');
        }
})

One more thing I tested, the same component loads perfectly fine in Visualforce Page using Lightning Out and LockerService enabled.

closed as off-topic by Adrian Larson May 4 '17 at 18:25

  • This question does not appear to be about Salesforce within the scope defined in the help center.
If this question can be reworded to fit the rules in the help center, please edit the question.

  • 1
    This stacktrace is lightning js code, seems like salesforce bug. I am developing lightning too with custom ui libs and sometimes get these errors randomly. – Vladyslav K Jul 5 '16 at 8:28
  • So what solution can we implement here? I don't have partner premier support, so I cannot raise the case with SFDC support, they close the dev related cases like these automatically :( – VarunC Jul 5 '16 at 8:30
  • Ever get around this? I'm getting random failures with d3 as well. One minute it was fine, next it's the condescending "Sorry to Interrupt" message. – Matt Lacey Jan 24 '17 at 4:13
  • I'm voting to close this question as off-topic because OP is no longer using the library the question is centered around. – Adrian Larson May 4 '17 at 18:25
2

There have been several fixes to released since this question was originally posted. I just tried running a simple app using D3 version 4.3.0 and everything loads/runs fine with LockerService enabled.

Just wanted to confirm all your issues are resolved.

  • Actually I didn't proceed with D3 V4 library and Lightning Component so never knew if it is fixed or not. I had to devise the solution using Visualforce Page instead. – VarunC Jan 25 '17 at 13:20
0

I had similar issues when developing lightning with custom libs. One of solutions for me was making js libraries loaded in explicit order.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/js_libs_platform.htm

scripts="{!join(',', 
    $Resource.jsLibraries + '/jsLibOne.js', 
    $Resource.jsLibraries + '/jsLibTwo.js')}"

When you include scripts this way, they are loaded in order, otherwise they are loaded randomly. For me it worked because I needed jQuery to be loaded before highcharts.

And one important thing is that jQuery has to be minimun v2.2.4 (this is required by lightning)

Also there may be troubles in your init functions.

  • My component has only 1 external library requirement and I'm using the same process to include it in my code. <ltng:require scripts="{!$Resource.pk1__d3 + '/d3.v4.min.js'}" /> and I'm not using jQuery, my component relies on D3 Chart Library. – VarunC Jul 5 '16 at 8:45

Not the answer you're looking for? Browse other questions tagged or ask your own question.