NoErrorObjectAvailable Script error

Question

I have a LWC that is used in different orgs. In one of them, when I dispatch an event like:

this.dispatchEvent( new CustomEvent( 'press' ));

I am getting the [NoErrorObjectAvailable] Script error in that line (as per the Stack trace).

If I comment that line, then the error disappears.

This is the most similar question I have found but I am making no use of event.target so unfortunately it does not help.

What can I be doing wrong?

Answer 1

TL;DR;

As of my experience, the most common reason why [NoErrorObjectAvailable] Script error appears is when because a custom event is handled by a ghost method, meaning a method that does not exist on the JS controller.

For example, oncustomevent={ghostMethod}, where ghostMethod does not exist in the JS controller.

---

Long version

Let's say we have a child component like the following:

childComp.html

<template>
    <lightning-button label="Notify Parent Comp" onclick={notifyParent}></lightning-button>
</template>

childComp.js

import { LightningElement } from 'lwc';

export default class ChildComp extends LightningElement {
    notifyParent() {
        const event = new CustomEvent('childnotification', { bubbles: true });
        this.dispatchEvent(event);
    }
}

which sends a childnotification event to parentComp

parentComp.html

<template>
    <div onchildnotification={ghostMethod}>
        <div onchildnotification={handleChildNotification}>
            <lightning-textarea value="Parent Component"></lightning-textarea>
            <c-child-comp></c-child-comp>
        </div>
    </div>
</template>

parentComp.js

import { LightningElement } from 'lwc';

export default class ParentComp extends LightningElement {
    handleChildNotification() {
        console.log('Child Event arrived');
    }
}

---

As you can see, when the parent component receives childnotification event, apart from invoking handleChildNotification (which exists on parentComp.js ) it's invoking ghostMethod, which does not exist on parentComp.js.

• Because of this reason, you will get this annoying [NoErrorObjectAvailable] Script error failure.

Points to take into account and why I consider this a Salesforce LWC Bug

• parentComp.html can be successfully deployed even if ghostMethod does not exist on parentComp.js
• As of my experience, you only get this error if ghostMethod has never existed in the LWC. If it has existed in a previous LWC version it will not fail (even if the code is not there anymore)

---

Update

Another common reason why this error appears, is because an exception occurs on the handler method (in our case, handleChildNotification). This is easier to identify and troubleshoot with the pause on exceptions button of the browser development tools.

Answer 2

in my case, i forgot to add 'event' in the js method

example: 
handleChange(){
   // will throw [NoErrorObjectAvailable] Script error   
}

handleChange(event){
   
}

Answer 3

In our case, this error occurred when we were using "cmp or any different value" than what is being passed in the parameter which is "component".

In the second line of code, when we changed "cmp" to "component" - the error got resolved. handleSave : function(component, event, helper) {

    var action = cmp.get("c.shareActionPlanTemplates");
 
    action.setCallback(this, function(response) {
        var state = response.getState();
        if (state === "SUCCESS") {
         //   alert("From server: " + response.getReturnValue());
            console.log(response.getReturnValue());
        }
        else if (state === "INCOMPLETE") {
            // do something
        }
        else if (state === "ERROR") {
            var errors = response.getError();
            if (errors) {
                if (errors[0] && errors[0].message) {
                    console.log("Error message: " + 
                             errors[0].message);
                }
            } else {
                console.log("Unknown error");
            }
        }
    });
    $A.enqueueAction(action);  
     
 },