Publish Events: Passing events from a Skuid Page to a contained Lightning Out Component?

I’m trying to raise an event from a Skuid page hosted in Visual Force to a Lightning Component that’s hosted in the Skuid page in a iFrame, like so:

!( CareOnlineAccountQBOTab SeanClone_inline.jpg “Image:”)

But no matter what I seem to try the LC doesn’t seem to be hearing the event. I tried a point & click publish with scope set to include LC’s on the Tab’s Actions but no dice. I also tried using a snippet but same results.

I know there are several configurations where this will work such as Skuid pages hosted in LC’s, but what about the other way around?


So, the Lightning Component is embedded in a Visualforce Page that is being loaded into Skuid via an iframe? That is not supported out of the box, although it is possible. Is there a reason you’re loading the Lightning Component in a Visualforce Page in an iframe, vs just loading Lightning Out directly in the Skuid Page? This can be done via JavaScript, and I think that if you do this, the Lightning Component will hear the event.

Basically you just need to do the following (assuming that you already have a Lightning Application and Lightning Component properly configured for Lightning Out (

  1. Add a JavaScript Resource with Resource Type “External” to load the Lightning Out library, from the relative URL: ">lightning/lightning.out.js

  2. Add a JavaScript Resource with Record Type “Inline (Component)” that instantiates your desired Lightning Out Component, whose content should be something like this

    var element = arguments[0];$Lightning.use(“c:MyLightningOutApp”, // name of the Lightning app function() { $Lightning.createComponent( “c:FooBar”, // top-level Lightning component of your app { }, // attributes to set on the component when created element[0], // insert the lightning component inside the Skuid custom component’s DOM element function(cmp) { // callback when component is created and active on the page } ); }, “”, // Your Lightning domain skuid.utils.userInfo.sessionId // Access Token);

Thanks the detailed response, but I’m getting what looks like a cross site script error when I try this:

Failed to load No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://zzz–’ is therefore not allowed access.

Any idea? Also, I haven’t run across this technique in the documentation. Is it in there anywhere?