How do I eliminate or work around a 500 error preventing me from using Lightning components on a VisualForce page in a sandbox? Identical code works in a dev org but fails in a sandbox.
Note: In the sandbox I used, the "My Domain" feature is in a "Ready for Testing but Hidden from Users" state, whereas in the dev org I used, the "My Domain" feature is in a fully deployed state.
Only mentioning My Domain for good measure, since this document says:
Finally, you don’t need to enable My Domain to use Lightning components in the following contexts.
- Lightning components with Communities in Community Builder
- Lightning Components for Visualforce
Copious details below.
Inputs
Sample code taken verbatim from Lightning Components Developer Guide.
lcvfTest.app
<aura:application access="GLOBAL" extends="ltng:outApp">
<aura:dependency resource="ui:button"/>
</aura:application>
lcvfTest.vfp
<apex:page >
<apex:includeLightning />
<div id="lightning" />
<script>
$Lightning.use("c:lcvfTest", function() {
$Lightning.createComponent("ui:button",
{ label : "Press Me!" },
"lightning",
function(cmp) {
// do some stuff
});
});
</script>
</apex:page>
Results
Dev org succeeded but Sandbox failed.
Dev Org
Renders a button, just as described in the documentation.
Sandbox Org
No Button is rendered. The browser's debug console reveals a request which fails with a 500 error.
(Note: In the following output, hash-like values in the "loaded" object were replaced with fictitious ones, since I do not know whether the hashes contain private information. Custom domain values are also fictitious. The "fwid" values are not fictitious.)
The URL of the request which triggered a 500 error was:
https://my-custom-domain--my-sandbox-name.cs2.my.salesforce.com/l/%7B%22mode%22%3A%22PROD%22%2C%22app%22%3A%22c%3AlcvfTest%22%2C%22fwuid%22%3A%22HARM87fxppWmsEY_Ve9awQ%22%2C%22loaded%22%3A%7B%22APPLICATION%40markup%3A%2F%2Fc%3AlcvfTest%22%3A%22N7gJLRFbk4dlneywPZJt2f%22%7D%2C%22requestedLocales%22%3A%5B%22en_US%22%2C%22en%22%5D%2C%22ls%22%3A%22YN%22%7D/inline.js
Opening this URL in its own browser tab yields the following content (indentation added by me):
aura.error(
{
"exceptionEvent":true,
"event": {
"descriptor":"markup://aura:clientOutOfSync",
"eventDef": {
"s":1,
"v": {
"descriptor":"markup://aura:clientOutOfSync",
"type":"APPLICATION",
"superDef": {
"s":2,
"v": {
"descriptor":"markup://aura:applicationEvent",
"type":"APPLICATION",
"xs":"G",
"attributes":{}
}
},
"attributes":{}
}
}
},
"defaultHandler":"function() {$A.clientService.setOutdated()}"
});
The large URL-encoded portion of the URL above decodes to this (indentation added by me):
{
"mode":"PROD",
"app":"c:lcvfTest",
"fwuid":"HARM87fxppWmsEY_Ve9awQ",
"loaded":
{
"APPLICATION@markup://c:lcvfTest":"N7gJLRFbk4dlneywPZJt2f"
},
"requestedLocales":["en_US","en"],
"ls":"YN"
}
Environments Tested
Attempted some additional setups other than those above. Here is a full list of environments tested (including the above), with results:
- Failed: A Sandbox (on cs2) for a Summer 2016 Enterprise org, created before June 11. My Domain in a Testing phase of deployment.
- Failed: Another Sandbox (on cs44) for org #1, created on July 19. My Domain in a testing phase of deployment.
- Succeeded: A Developer Edition org. My Domain fully deployed.
- Succeeded: Another Developer Edition org. My Domain fully deployed.
- Succeeded: A sandbox for an Unlimited Edition org, unrelated to org #1 and created before June 11. My Domain fully deployed.
Possible Stack Trace
While I do not know how to access a server-side exception log for the Aura framework, I have attempted to piece together a stack trace by manually inspecting the Aura source code from github. The result of my attempt is as follows: