Post on 09-Apr-2017
transcript
Debugging Lightning ComponentsSalesforce Saturday
Mohith Shrivastava
Salesforce MVP
CodeScience INC
Blog - cloudyworlds.blogspot.com
Prerequisites 1.You have worked with lightning components and familiar with
basics
2.You have basic Understanding of Javascript
3.Visit Trailhead to explore Lightning Components Projects and modules
AGENDA1.Lightning Inspector
2.Locker Services
3.Lightning CLI
ENABLING DEBUG MODE
LIGHTNING INSPECTORInstallation Link
CONSOLE SHORTCUT COMMANDS$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 TAB
TRANSACTION TAB
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
4.The graph is color coded.
Black—The current event
Maroon—A controller action
Blue—Another event fired before or after the current event
ACTION LOGGING1.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
STORAGE TABThis tab shows the client-side storage for Lightning applications.
Actions marked as storable are stored in the actions store. Use this tab to analyze storage in Salesforce1 and Lightning Experience.
LOCKER SERVICEPrevents
Components from causing XSS and similar security issues
Components from reading other component’s rendered data without any restrictions
Components from calling undocumented/private APIs
Further Reading here
Managed Package Apps going through the security review process has to adhere to security best practices .
Read more about the security best practices for lightning components here
SALESFORCE LIGHTNING CLIInstall Heroku Toolbelt
Install Lightning CLI
Run the heroku lint command
***Heroku lightning:lint path***
REFERENCESLightning Components Developer Guide
Repo of all code used for demo
https://github.com/msrivastav13/SalesforceSaturday-22
Register for below webinar coming week for more info around winter 17 lightning features
https://developer.salesforce.com/events/webinars/BuildAppsFaster
THANK YOUOrganiser - Salesforce Bangalore User Group (Madan and Kishore)
Twitter - Mohith - @msrivastav13 Madan - @madankhichi