2

I am attempting to load a third-party Javascript library into a Lightning Component. The third-party assures me that the code is valid under "Strict Mode" and I have no reason to doubt them as this is a widely-used library.

HOWEVER, when I attempt to load the library I get the following error from the console in Chrome:

WARNING: Failed to load script at /resource/1587586407000/PCMilerJavascript: Delete of an unqualified identifier in strict mode. [Delete of an unqualified identifier in strict mode.]

Here is the the offending part of my js file:

import { LightningElement, api, wire } from 'lwc';
import { loadStyle, loadScript } from 'lightning/platformResourceLoader';
// apex methods
import getCredentials from '@salesforce/apex/ALKMapController2.getCredentials';
// static resources
import PCMilerCSS from '@salesforce/resourceUrl/PCMilerCSS';
import PCMilerJavascript from '@salesforce/resourceUrl/PCMilerJavascript';

export default class AlkMap extends LightningElement {

    connectedCallback() {
        debugger;
        Promise.all([loadStyle(this, PCMilerCSS), loadScript(this, PCMilerJavascript)])
            .then(() => {
                debugger;
                this.initializeMap();
            })
            .catch(error => {
                debugger;
                LightningUtil.logError(this, error);
            });
    }

The load of the Javascript is attempted in connectedCallback and fails as noted above.

Again the third-party assures me that their file passes strict mode.

Thanks in advance for your help!

0

I won't claim to be an expert on strict mode, but it appears that they are either unaware of all the rules of strict mode, or are just making an assertion without actually verifying that they are, in fact, strict mode compliant. It is unlikely that they are compliant, and the browser has it wrong. It is, however, also possible that their source code is strict compliant, but the minification process resulted in code that is not strict compliant (they may need to look at their minification tool's settings).

Looking at the code, I found a couple of possible culprits:

var a = this.createRequestForm();
this.imgDiv.appendChild(a);
a.submit();
this.imgDiv.removeChild(a);
delete a;

var a = this.imgDiv.firstChild;
ALKMaps.Event.stopObservingElement(a);
this.imgDiv.removeChild(a);
delete a;

To test this logic, I made a simple check:

function x() { 
  "use strict"; 
  var a = {x:5}; 
  delete a; 
}

This code fails to compile with the same error in strict mode (tested in Google Chrome's Developer Console), so this is most likely the problem. You may want to report a bug to them.

In strict mode, compilation fails when the code is compiled, before it has a chance to execute at all. In this case, trying to delete a local variable declared with var is an error, and will prevent compilation.

3
  • Thank you sir. You are absolutely correct! The third-party finally came clean and indicated that their library will NOT run in strict mode. They hopefully will give me a new version that will work. Thanks again!
    – Dave C
    Apr 23 '20 at 17:40
  • @DaveC I didn't read through all their code, but you could try deleting the two lines of code and see if that fixes it (do a search for delete a;, and delete both instances). I can assure that those lines of code would have no effect even in non-strict JS.
    – sfdcfox
    Apr 23 '20 at 18:53
  • Thanks for the follow up. They are actually building a new version for me that passes strict mode validation so I don' have to monkey with it.
    – Dave C
    Apr 27 '20 at 13:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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