3

I'm trying to use a static resource in a Lightning Web Component. The component is embedded in a Sites (formerly known as Communities) Page, in case that matters

The relevant code in the static resource is:

(((root, factory) => () {
    root.org = root.org || {};
    root.org.cometd = factory();
})(this, () => {
    //this part is over 3k lines and not relevant
}));

I've verified that the above code is running as intended when I import the resource via console.log statements. Moreover, I've found that the value of this, and consequently the value of root is the JavaScript global window. So I should be able to access the value in my code via window.org. I have also verified that the value of root.org is what I expect- a usable module.

Meanwhile, my component's code looks like this:

import cometdlwc from "@salesforce/resourceUrl/cometd";

export default class MyComponent extends LightningElement {
    @wire(getSessionId) //custom apex method to get session id, working just fine
    wiredSessionId({ error, data }) {
        loadScript(this, cometdlwc).then(() => {
            console.log(window.org); //incorrectly outputting undefined
        }
    }
}

On further investigation, it seems that it's because the value of window for the resource is the actual window variable, whereas my code calling window gets the Lightning Locker Secure Window.

So my question is, is there a way to access the imported values in LWC? Either by having some other variable set, giving the import access to the Secure Window, or something else? Is it just a Communities issue?

4
  • Did you make a test where the this part is over 3k lines and not relevant has been removed? Just to make sure it is coming from the way it is loaded? Commented Apr 19, 2022 at 15:47
  • @Bartheleway I have tested that, that part is a function which is passed in as the factory parameter. I've checked what factory() does, it works exactly as intended. To be clear, that code isn't what I wrote, it's from the publicly available cometd module- all information about it I got from working with the code. Commented Apr 21, 2022 at 0:42
  • What I mean is making a test where the factory function is just an empty function. Just to be sure that the issue doesn't comes from the code inside the factory function as Salesforce framework may hide it. Commented Apr 21, 2022 at 14:08
  • @Bartheleway it doesn't change much. And to be clear- when I console.log the value of factory() within the static resource, I get the expected result. I just can't access it from the lwc. Commented May 6, 2022 at 8:28

1 Answer 1

1

You are correct. this in your script is the native window, while window refers to a synthetic window object. IIFE designs typically expect window to be this, although that's not universally true. Some use window explicitly, and those would work without modification. Unfortunately, the code you're using doesn't do this. However, the fix is simple.

})(this, () => {

Can be changed to:

})(window, function() {

And everything should work as you expect.

Or, you can change root.org to window.org in the first few lines of code.

6
  • Just tried this, it's not resulting in the desired changes. Every way I've tried spinning it thus far, this and window both refer to the native window from the static resource, but window in the LWC refers to the Locker window. Commented Apr 14, 2022 at 7:50
  • To speak plainly, this solution did not work. Commented Apr 21, 2022 at 0:39
  • @SarcasticSully I saw your previous comment, but it got lost in the shuffle of life. Let me see if I can try and make it work.
    – sfdcfox
    Commented Apr 21, 2022 at 0:46
  • @SarcasticSully Actually, have you seen the demo version? Does that not work out of the box?
    – sfdcfox
    Commented Apr 21, 2022 at 0:49
  • it does not. It hits what appears to be exactly the same problem as before- that the window accessed by the static resource is not the same as the lwc's window Commented May 6, 2022 at 8:27

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .