Embed Size (px)
Citation preview
DEBUGGING LIGHTNING COMPONENTSMohith ShrivastavaSalesforce Engineer @ CodeScienceSalesforce MVP @Salesforce
THANK YOU TO OUR PLATINUM SPONSORS!
SIX STAGES OF DEBUGGING1.That can’t Happen2.That does not happen on my Instance or Developer org3.That shouldn’t happen4.Why does that happen ?5.Oh I see6.How did that ever work ??
INTRODUCTION TO LIGHTNING COMPONENTS
INTRODUCTION TO LIGHTNING COMPONENTS1. JavaScript Framework that lets you build Single page Applications
2. On Backend uses salesforce apex (Object Oriented Language like Java )
3. On Frontend uses ES5 JavaScript (Functional Programming ) for DOM manipulation and client side business logic and uses two way data binding via attributes
4. Components use Event Driven pattern (pub-sub) model to communicate with each other
ENABLING LOGS
1. Enabling Salesforce Debug Logs For Apex Logging
2. Enabling Debug Mode For Lightning Component Debugging for un minifying JavaScript
LIGHTNING CHROME INSPECTOR USEFUL COMMANDS
Installation Link
$auraTemp+""Returns the component descriptor.
$auraTemp.get("v.attributeName")Returns the value for the attributeName attribute.
$auraTemp.getElement()Returns the corresponding DOM element.
inspect($auraTemp.getElement())Opens the Elements tab and inspects the DOM element for the component.
PERFORMANCE PROFILING
EVENTS LOGGING1. This tab shows all the events fired. The event graph helps you to understand
the sequence of events and handlers for one or more actions.
2. You can inspect standard and custom application events , component events
3. Use this to inspect the Tree and debug event variables
The graph is color coded.
Black—The current eventMaroon—A controller actionBlue—Another event fired before or after the current event
ACTIONS LOGGING
1. Actions are various types like storable, cached,Success,Error,Aborted
2. Actions logging help to see the action responses and override the behaviour to build more robust error handling
3. You can override the server actions
1. Using console.log to inspect objects2. Setting Breakpoints3. Using debugger keyword (debugger)
JAVASCRIPT DEBUGS
➢ Prevents Components from causing XSS and similar security issues
➢ Prevents Components from reading other component’s rendered data without any restrictions
➢ Prevents Components from calling undocumented/private APIs
➢ Managed Package Apps going through the security review process has to adhere to security best practices .
➢ Use lightning CLI to discover potential issues .
➢ Read this blogpost for more info
LOCKER SERVICE
Thank you!
