Introduction

You are requested to log actions from the users are using a concrete LWC, this is called “Observability”. Unfortunately, using console.log will only be useful when you run in your browser, and you will truly be limited.

The Lightning Logger Service, introduced in the first quarter of 2024, allows adding observability to custom LWCs. Unlike the traditional console.log method, which primarily serves developers during the debugging process, the Lightning Logger Service is designed for tracking user activities. This service is particularly useful for event monitoring, enabling administrators to gather insights into user interactions and system behaviors, and it is very interesting for developers as they only use LWC without server-side code, which simplifies the solution.

Considerations

To use the Logger Service, a mechanism to retrieve and store these messages is required, and Salesforce chose Event Log Monitoring for it. So, to use this service, you need Event Monitoring.

Unfortunately, Event Monitoring is an additional-paid service, that is free available for free in Developer Edition orgs, but all other editions require you to purchase a license.

<aside> 💡 If you don’t know what Event Monitoring is, check this trailhead module in detail: https://trailhead.salesforce.com/content/learn/modules/event_monitoring/event_monitoring_intro.

</aside>

If you have access to an Org with Event Monitoring, then you need to set up the following options:

<aside> 📂 This LWC is not available in the LWC Recipes Github repository, but in this repository instead: https://github.com/egraells/lwc-recipes-ege/tree/main/force-app/main/default/lwc/egelwclogger

</aside>

Meta configuration file

<?xml version="1.0" encoding="UTF-8" ?>
<LightningComponentBundle xmlns="<http://soap.sforce.com/2006/04/metadata>">
	<apiVersion>59.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>
	<description>Demoing Logging Observability from LWC</description>
</LightningComponentBundle>

• The Salesforce API version that is used.
• This file indicates that this LWC can be included (exposed=true) in 3 types of pages:
  • App Page <target>lightning__AppPage</target>
  • Record Page <target>lightning__RecordPage</target> (as it is in the account record page where I placed this component).
  • Home page <target>lightning__HomePage</target>

Template file

The template shows 2 buttons are supplied to log to the console, and when clicking those buttons, there are 2 functions that execute the code:

<template>
    <lightning-card title="ApexImperativeMethod" icon-name="custom:custom63">
        <div class="slds-var-m-around_medium">
            <p class="slds-var-m-bottom_small">
                <lightning-button
                label="Log a message in the console"
                onclick={logMessageConsole}
                ></lightning-button>
            </p>
        </div>
        <div class="slds-var-m-around_medium">
            <p class="slds-var-m-bottom_small">
                <lightning-button
                label="Log a message in the console and in Event Monitoring"
                onclick={logMessageEventMonitoring}
                ></lightning-button>
            </p>
        </div>
        
        <c-view-source source="lwc/apexImperativeMethod" slot="footer">
            This recipe is not included in the current LWC Recipes, but it is offered to understand the logger mechanism.
        </c-view-source>
    </lightning-card>
</template>

Javascript file

The Javascript file requires the import the log function from lightning\\logger to be used.