LWC Imperative APEX with Parameters not taking Ids

Question

I'm creating a LWC QuickAction. From a lookup field for accounts I need to fetch the external Id of the Account. I get the account ID from the lookup, but when I pass them to APEX, I get Error 500, Server Error. If I test the same function with the @api recordId it works fine. Here is what I have (in parts):

handleCustomerValueSelected(event) is the function in trouble!

import { LightningElement, api, wire, track } from 'lwc';
import { CloseActionScreenEvent } from 'lightning/actions';
import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import getAccExternalId from '@salesforce/apex/AI_LessonCreateLwcController.getAccountExternalId';
import getSubExternalId from '@salesforce/apex/AI_LessonCreateLwcController.getSubjectExternalId';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import ACCOUNT_RTID_FIELD from '@salesforce/schema/account.RecordTypeId';
import ACCOUNT_NAME_FIELD from '@salesforce/schema/account.Name';
import ACCOUNT_EXTID_FIELD from '@salesforce/schema/account.ET_UserExternalId__c';

const _FIELDS = [ACCOUNT_RTID_FIELD,ACCOUNT_NAME_FIELD, ACCOUNT_EXTID_FIELD];

export default class LessonCreate extends LightningElement {
    @api recordId;

    @track recordType;
    @api objectApiName;
    @track objectInfo;
    @track error;
    @track record;
    @track selectedCustomerRecordId;
    @track selectedTeacherRecordId;
    selectedCustomerExternalRecordId;
    selectedTeacherExternalRecordId;
    selectedSubjectRecordId;
    accountName;
    externalId;
    

    isExecuting = false;    
    @api async invoke() {
    if (this.isExecuting) {
        return;
    }  
    this.isExecuting = true;
    await this.sleep(2000);
    this.isExecuting = false;
    }  
    sleep(ms) {
        return new Promise((resolve) => setTimeout(resolve, ms));
    }

    @wire(getObjectInfo,  { objectApiName: ACCOUNT_OBJECT })
    objectInfo;

    @wire(getRecord, { recordId: '$recordId', fields: _FIELDS })
    wiredRecord({ data, error }) {
        if (data) {
            console.log('***Data:' + data);
            this.record = data;
            this.recordType = this.record.fields.RecordTypeId.value;
            this.accountName = this.record.fields.Name.value;
            this.externalId= this.record.fields.ET_UserExternalId__c.value;
            this.error = undefined;
        } 
        else if (error) {
            console.log('***Error:' + data);
            this.error = error;
            this.record = undefined;
        }
    }

    get externalAccountId() {
        return getFieldValue(this.secondAccount.data, ACCOUNT_EXTID_FIELD);
    }

    get isrecordTypeNameCustomer() {
        // Returns a map of record type Ids
        const rtis = this.objectInfo.data.recordTypeInfos;
        const rtInfo= Object.keys(rtis).find(rti => rtis[rti].name === 'Customer');
        
        if(this.recordType===rtInfo){
            this.selectedCustomerRecordId = this.recordId;
            this.selectedCustomerExternalRecordId = this.externalId;
            return true;
            
        } else{
            return false;
        }  
    }

    get isrecordTypeNameTeacher() {
        // Returns a map of record type Ids 
        const rtis = this.objectInfo.data.recordTypeInfos;
        const rtInfo= Object.keys(rtis).find(rti => rtis[rti].name === 'Teacher');
        
        if(this.recordType===rtInfo){
            this.selectedTeacherRecordId = this.recordId;
            this.selectedTeacherExternalRecordId = this.externalId;
            return true;
        } else{
            return false;
        }  
    }

    currentDt = Date.now();
        
    handleCustomerValueSelected(event) {
        this.selectedCustomerRecordId = event.detail;
        var custId = event.detail;
        console.log('***CustId: ' + this.selectedCustomerRecordId);
        getAccExternalId({ accId : this.selectedCustomerRecordId })
            .then(response => {
                this.selectedCustomerExternalRecordId = response;
                console.log('***ExId: ' + this.selectedCustomerExternalRecordId);
            })
            .catch(error => {
                this.error = error;
                console.log('***ExId Error: ' + this.error.status);
            });
        
    }

    handleTeacherValueSelected(event) {
        this.selectedTeacherRecordId = event.detail;
        getAccExternalId({accId: this.selectedTeacherRecordId})
            .then(result => {
                this.selectedTeacherExternalRecordId = result;
            })
            .catch(error => {
                this.error = error;
            });
    }
 
    handleSubjectValueSelected(event) {
        this.selectedSubjectRecordId = event.detail;
        getSubExternalId({accId: this.selectedSubjectRecordId})
            .then(result => {
                this.selectedSubjectExternalRecordId = result;
            })
            .catch(error => {
                this.error = error;
            });
    }
    
    //Radio Group
    changeType;
    get options() {
        return [
            { label: '45 min', value: '45' },
            { label: '60 min', value: '60' },
            { label: '90 min', value: '90' },
        ];
    }
    handleRadioChange(e){
        this.changeType = parseInt(e.detail.value);
        console.log('***Duration: ' + this.changeType);
    }

    newDate;
    handleDateChange(e){
        this.newDate = e.detail.value;
    }

    closeAction(){
        this.dispatchEvent(new CloseActionScreenEvent());
    }

    handleSave(e){
        const allValid = [...this.template.querySelectorAll('lightning-input')]
        .reduce((validSoFar, inputCmp) => {
                    inputCmp.reportValidity();
                    return validSoFar && inputCmp.checkValidity();
        }, true);
        const allRadioValid = [...this.template.querySelectorAll('lightning-radio-group')]
        .reduce((validSoFar, inputCmp) => {
                    inputCmp.reportValidity();
                    return validSoFar && inputCmp.checkValidity();
        }, true);
        if (allValid && allRadioValid) {
                alert('Das sieht gut aus. Funktion senden folgt.')
                this.closeAction();
        } else {
            alert('Bitte korrigieren sie die fehlerhaften oder fehlenden Einträge und speichern Sie erneut.');
        }
    }
}

And the Apex Controller:

@AuraEnabled
    public static String getAccountExternalId(String accId){
        system.debug('***Apex: ' + accId);
        Account acc = [SELECT Id, ET_UserExternalId__c FROM Account WHERE Id = : accId];
        return acc.ET_UserExternalId__c; 
    }

And this is the result from console log: ***CustId: 0011j000018avy1AAA

***ExId Error: 500 - undefined

Apex Log is basicaly doing nothing:

Answer 1

This error is most likely due to a mismatch in the type of parameter your Apex method expects, and the type of the value you are sending to it.

By looking at your code, it looks like you are directly using event.detail. Typically event.detail is an object which further holds properties like id etc, which in turn depends on the component that is firing the event. So passing an object to a String (Apex param) results in this error.

Thats why you arent getting any logs. The method itself isn't invoked due to param type mismatch.

Again, this is the most likely cause. As others have requested in the comments, if you can console.log this.error instead of this.error.status, you will get to know the actual cause, and we can help you.