3

EDIT Nov 2020: I am no longer seeing an error in debug mode, just the warning message about the invalid icon name.


I believe I've found a minor bug / issue but would like to confirm. If there's a better place for me to put this bug report, please advise.

I've tested this in both my own application as well as the recipes application.

STEPS TO REPEAT:

  1. Open recipes application to 'Misc' tab
  2. Open Chrome dev tools console
  3. Fire a ShowToast event with any variant
  4. Wait for the Toast to disappear
  5. Look at messages in Chrome dev tools console

If my Salesforce user debug mode is not enabled, I simply get a warning:

Invalid icon name utility:

If my Salesforce user debug mode is enabled, it becomes an error

Error: [LWC error]: Invalid url value "". Expected a non-empty string. <lightning-primitive-icon> <lightning-icon>

Here's an image in case it helps

recipes application after call to toast with debug mode enabled

1

I found the same thing. I have a quick action calling an aura wrapper using QuickActionWithoutHeader. It encloses a lightning web component. I fire a toast from the LWC when a button is clicked in the LWC.

When the toast closes (timed out or close box on toast banner clicked manually) the following error appears in the javascript console: icon.js:110 Invalid icon name utility

I am using in my LWC javascript controller the standard toast library: import { ShowToastEvent } from 'lightning/platformShowToastEvent';

I'm not sure, but it looks like this toast library is actually the one used by Aura and it is saying the icon is called "utility:" when it should be "utility:close" if you are using SLDS.

The full expansion of the error is:

icon.js:110 <lightning-icon> Invalid icon name utility:
set iconName    @   icon.js:110
set @   aura_proddebug.js:7985
setHook @   aura_proddebug.js:10095
cachedSetterByKey.<computed>    @   aura_proddebug.js:8324
InteropComponent.$attributeChange$  @   aura_proddebug.js:35501
changeHandlerFCV    @   aura_proddebug.js:35402
Aura.$Event$.$Event$.$executeHandlerIterator$   @   aura_proddebug.js:37499
Aura.$Event$.$Event$.$executeHandlers$  @   aura_proddebug.js:37473
(anonymous) @   aura_proddebug.js:37532
AuraInstance.$run$  @   aura_proddebug.js:49291
Aura.$Event$.$Event$.$fire$ @   aura_proddebug.js:37530
Component.$fireChangeEvent$ @   aura_proddebug.js:33115
PropertyReferenceValue$changeHandler    @   aura_proddebug.js:30890
Aura.$Event$.$Event$.$executeHandlerIterator$   @   aura_proddebug.js:37499
Aura.$Event$.$Event$.$executeHandlers$  @   aura_proddebug.js:37473
(anonymous) @   aura_proddebug.js:37532
AuraInstance.$run$  @   aura_proddebug.js:49291
Aura.$Event$.$Event$.$fire$ @   aura_proddebug.js:37530
Component.$fireChangeEvent$ @   aura_proddebug.js:33115
Component.set   @   aura_proddebug.js:33070
setVisibleList  @   visualMessageQueue.js:44
onVisualListChange  @   visualMessageQueue.js:60
onVisualListChange  @   visualMessageQueue.js:16
Action.$runDeprecated$  @   aura_proddebug.js:38034
Component$getActionCaller   @   aura_proddebug.js:33815
Aura.$Event$.$Event$.$executeHandlerIterator$   @   aura_proddebug.js:37499
Aura.$Event$.$Event$.$executeHandlers$  @   aura_proddebug.js:37473
(anonymous) @   aura_proddebug.js:37532
AuraInstance.$run$  @   aura_proddebug.js:49291
Aura.$Event$.$Event$.$fire$ @   aura_proddebug.js:37530
Component.$fireChangeEvent$ @   aura_proddebug.js:33115
PropertyReferenceValue$changeHandler    @   aura_proddebug.js:30890
Aura.$Event$.$Event$.$executeHandlerIterator$   @   aura_proddebug.js:37499
Aura.$Event$.$Event$.$executeHandlers$  @   aura_proddebug.js:37473
(anonymous) @   aura_proddebug.js:37532
AuraInstance.$run$  @   aura_proddebug.js:49291
Aura.$Event$.$Event$.$fire$ @   aura_proddebug.js:37530
Component.$fireChangeEvent$ @   aura_proddebug.js:33115
Component.set   @   aura_proddebug.js:33070
eval    @   toastManager.js:230
callbackWrapper @   aura_proddebug.js:49141
requestAnimationFrame (async)       
setToastList    @   toastManager.js:229
removeToast @   toastManager.js:210
onCloseToast    @   toastManager.js:44
onCloseToast    @   toastManager.js:9
Action.$runDeprecated$  @   aura_proddebug.js:38034
Component$getActionCaller   @   aura_proddebug.js:33815
Aura.$Event$.$Event$.$executeHandlerIterator$   @   aura_proddebug.js:37499
Aura.$Event$.$Event$.$executeHandlers$  @   aura_proddebug.js:37473
(anonymous) @   aura_proddebug.js:37532
AuraInstance.$run$  @   aura_proddebug.js:49291
Aura.$Event$.$Event$.$fire$ @   aura_proddebug.js:37530
fireCloseToast  @   toastMessage.js:64
eval    @   toastMessage.js:32
callbackWrapper @   aura_proddebug.js:49141
listener.$$lwcEventWrapper$$    @   aura_proddebug.js:2598
0

I have the same error while not using the toaster but on a conditional template. I have a button that pulls some data and shows a datatable. If the table is empty I give an error with an icon. enter image description here

When I load data a second time and the table is not empty, the error template will be removed from the DOM and I get the icon error:

enter image description here

It looks like the conditional loading of templates and toasters removes a part of the icon-name when removed from the DOM and hence creates the error message.

0

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.