Salesforce lightning Interview Questions and Answers
1. What is Salesforce Lightning?
Salesforce Lightning is a component-based framework developed by Salesforce for creating modern, dynamic web applications for mobile and desktop devices. It includes a set of tools and technologies like Lightning Components, the Lightning App Builder, and the Lightning Design System (SLDS), which are specifically designed to improve the development and user experience.
2. What are Lightning Components?
Lightning Components are reusable building blocks for creating applications in Salesforce. Based on the Aura framework, Lightning Components allow developers to build apps with greater flexibility, maintainability, and performance by breaking down features into modular components that can be reused and customized.
3. What is the difference between Aura Components and Lightning Web Components (LWC)?
Aura Components are part of the older Salesforce Lightning component framework, whereas Lightning Web Components (LWC) are newer and based on modern web standards like JavaScript and Web Components. LWC offers better performance and a simpler development model by using native browser features, which reduces the dependency on the Salesforce framework.
4. Can you explain the use of Lightning Data Service (LDS)?
Lightning Data Service (LDS) is used in Lightning Components to handle CRUD operations without the need for Apex code. LDS interacts with Salesforce data directly, improves performance by caching, and ensures consistency across components by sharing record data across components without requiring additional SOQL queries.
5. How does two-way data binding work in Aura Components?
In Aura Components, two-way data binding is achieved by using attributes with value providers like v for component attributes and c for controller actions. When an attribute’s value is changed in the component, it automatically updates the associated element and vice versa, maintaining consistency between the UI and the data model.
6. What are the lifecycle hooks available in Lightning Web Components?
The lifecycle hooks in LWC include:
constructor() – Called when the component is instantiated.
connectedCallback() – Invoked when the component is inserted into the DOM.
renderedCallback() – Runs every time the component is rendered.
disconnectedCallback() – Called when the component is removed from the DOM.
errorCallback(error, stack) – Handles errors in a component’s child.
7. How can you pass data between components in Lightning?
Data can be passed between components in Lightning using attributes and events. In LWC, properties marked as @api can be used to pass data from a parent to a child. Custom events are used to communicate from child to parent. In Aura Components, we use aura:attribute and aura:method to pass data between parent and child, and aura:event to pass data upwards.
8. What is SLDS, and how is it used in Lightning Components?
SLDS stands for Salesforce Lightning Design System. It provides a consistent look and feel for Lightning applications by offering styles, icons, and reusable components. Developers can include SLDS classes in their component’s HTML to style components according to Salesforce’s design standards.
9. Explain the @track decorator in LWC.
The @track decorator was previously used to make properties reactive in LWC. As of recent updates, properties in JavaScript objects are reactive by default. Now, we use @track only for private properties that are arrays or objects to ensure the reactivity of nested values.
10. What are Custom Events in LWC, and how are they used?
Custom Events in LWC are used for communication between components, particularly for sending data from a child component to a parent component. We create a custom event using the new CustomEvent() constructor, specifying the event name and any detail data. The parent component can listen for this event and handle it accordingly.
11. What is the importance of Lightning App Builder in Salesforce?
The Lightning App Builder allows developers and admins to create custom, responsive pages for Salesforce apps without code. It provides a drag-and-drop interface for building single-page applications with standard, custom, and third-party Lightning Components, making it easier to create dynamic, customized pages.
12. How do you optimize the performance of Lightning Components?
Performance optimization in Lightning Components can be achieved by:
Minimizing the use of SOQL queries and using LDS.
Reducing the number of server calls by caching data.
Using custom events efficiently to avoid unnecessary re-renders.
Reducing DOM manipulation and leveraging aura:if and lightning:layout to optimize component rendering.
13. What is the role of the lightning:isUrlAddressable interface?
lightning:isUrlAddressable interface is implemented in Aura Components to allow navigation to the component via a URL. This makes the component addressable and enables deep linking, which is useful for navigating users directly to specific records, pages, or states within the application.
14. Explain the @wire decorator in LWC.
The @wire decorator is used to call Apex methods and get data from the server asynchronously in LWC. It allows easy integration with Salesforce data without explicit handling of promises or lifecycle management. The decorator is reactive, so it re-fetches data whenever parameters change.
15. What is force:recordData in Aura Components?
force:recordData is an Aura component used for handling record data within Lightning Components. It provides functionalities like loading, creating, and updating records and is built on Lightning Data Service (LDS) to simplify data operations without Apex code.
16. What is a Lightning Locker Service? Why is it important?
Lightning Locker Service is a security architecture in Salesforce Lightning that isolates components to prevent unauthorized access to DOM elements or JavaScript APIs from other components. It enforces security standards, data integrity, and prevents cross-component data leaks, which is crucial for multi-tenant environments.
17. What is @api in LWC, and how is it used?
@api is a decorator in LWC used to expose properties or methods to other components. By marking properties or methods with @api, they become publicly accessible, allowing parent components to interact with them. This is essential for enabling inter-component communication.
18. Can you explain how aura:if is different from aura:renderIf?
aura:if conditionally renders DOM elements and removes them when they are no longer needed, which can improve performance. In contrast, aura:renderIf controls whether an element is displayed or hidden but keeps it in the DOM even when it is hidden, which uses more memory.
19. How do you handle error handling in Lightning Web Components?
In LWC, error handling is typically managed using the try...catch block within JavaScript. If the error originates from a child component, it can be handled in the parent component using the errorCallback(error, stack) lifecycle hook. Additionally, handling errors from Apex calls involves using .catch() with Promises.
20. What are custom labels in Salesforce Lightning, and how are they used?
Custom labels in Salesforce Lightning are used to store text values, which can be displayed in multiple languages. They’re helpful for localizing content within Lightning components. To use them, import the label using the @salesforce/label module in LWC or the $Label global variable in Aura Components.
21. Explain lightning-record-edit-form. How is it different from lightning:recordForm?
lightning-record-edit-form in LWC allows for creating custom forms with individual field elements, giving more control over layout and validation. lightning:recordForm in Aura is a simpler option, automatically generating a complete form with specified fields but offering less customization.
22. What is a Lightning Message Service (LMS)?
Lightning Message Service (LMS) facilitates communication between Lightning Web Components, Aura Components, and Visualforce pages without needing parent-child relationships. LMS uses MessageChannel for subscribing and publishing messages, enabling efficient cross-component communication within the same page.
23. How do you integrate external JavaScript libraries in Lightning Web Components?
To use external JavaScript libraries in LWC, first upload the library to Salesforce as a static resource. Then, use the loadScript() and loadStyle() methods from lightning/platformResourceLoader to import the library into the component, ensuring it loads asynchronously.
24. What is the purpose of lightning-input-field in LWC?
lightning-input-field is a standard Lightning Web Component that handles individual fields within forms. It simplifies binding with Salesforce data, handles standard field validation automatically, and is used within lightning-record-edit-form to facilitate creating or editing records.
25. Describe the disconnectedCallback() lifecycle hook in LWC.
The disconnectedCallback() lifecycle hook in LWC is called when the component is removed from the DOM. It’s useful for cleanup operations, such as clearing timers or removing event listeners, to free up memory and prevent potential memory leaks.
26. What are lightning:outputField and lightning:inputField used for in Lightning?
lightning:outputField displays read-only fields in forms, while lightning:inputField allows for editable fields. These components are commonly used within lightning-record-view-form and lightning-record-edit-form components to handle Salesforce record data and ensure consistent data formatting and validation.
27. What is the Lightning Component Library?
The Lightning Component Library is Salesforce’s official documentation and reference for Lightning components. It provides developers with examples, API documentation, and best practices for Aura Components, Lightning Web Components, and various utility classes within Salesforce.
28. How do you debug a Lightning Web Component?
To debug an LWC, use browser developer tools to inspect the DOM and monitor console logs. Salesforce also provides console.log() for logging, and Chrome DevTools allow for in-depth debugging by setting breakpoints and analyzing network requests. For complex issues, Salesforce’s Lightning Testing Service (LTS) can also be used.
29. How does Lightning Data Service (LDS) handle caching?
LDS caches record data locally on the client side to improve performance. When a record is updated, LDS automatically syncs the changes across all components using that data, minimizing SOQL calls and maintaining consistency across components within the page.
30. Can you use aura:method in Lightning Web Components?
aura:method is specific to Aura Components, allowing methods to be defined within the component and called by other components. In LWC, a similar function can be achieved using @api decorator methods, enabling methods to be exposed to parent components.
31. What are NavigationMixin and its uses in LWC?
NavigationMixin is an LWC module that enables navigation between different pages, records, and external URLs in Salesforce. It simplifies URL construction and navigation within the Salesforce app, ensuring compatibility with Salesforce’s internal navigation structure.
32. How does the Lightning Experience differ from Classic Experience?
Lightning Experience provides a modern UI, optimized for user experience and productivity. It includes Lightning Components, App Builder, improved workflows, and a responsive design. Classic Experience is older, lacks these modern components, and doesn’t support the latest Salesforce features like Lightning Web Components.
33. What is the role of lightning:overlayLibrary?
lightning:overlayLibrary is an Aura library component that allows for displaying modal or overlay dialogs in a Lightning component. It provides methods for launching pop-ups, confirming actions, and ensuring user engagement, commonly used for displaying alerts or warnings.
34. Explain the getRecordNotifyChange() function in LDS.
getRecordNotifyChange() is used in Lightning Data Service to force-refresh a record’s cache when it has been updated outside of LDS, such as in Apex. This ensures that all components accessing the record reflect the latest data.
35. What are Lightning Tokens?
Lightning Tokens are reusable, customizable style variables used in SLDS to standardize styling across components. They allow developers to define themes, colors, spacing, and fonts consistently, and update them across components by changing a single token value.
36. What is setParams() in Aura components?
setParams() is a function in Aura components that allows passing parameters to a server-side Apex action. This method is used to send data from the client to the server and trigger specific logic in Apex, facilitating dynamic behavior based on component input.
37. How do you deploy Lightning Web Components?
To deploy LWCs, developers typically use Salesforce CLI and Visual Studio Code, connected to a Salesforce org. The CLI allows you to authorize an org and use commands like sfdx force:source:deploy to push the components from a local environment to Salesforce.
38. What is @wire vs @api in LWC?
@wire is used to fetch data or invoke Apex methods reactively based on parameters, making it a declarative way to retrieve data. @api, however, exposes properties and methods to other components. While @wire focuses on data fetching, @api focuses on inter-component communication.
39. How do you test Lightning Components?
Testing Lightning Components can be done with Lightning Testing Service (LTS) or Jest for LWC. LTS is suitable for Aura Components and is based on Jasmine and Mocha. Jest is commonly used for LWC as it offers mock testing, component rendering, and DOM validation in JavaScript.
40. What is aura:handler in Aura Components?
aura:handler is used to handle events in Aura Components. It listens for specific events and executes actions in response, either from a component or from a parent or sibling component, allowing developers to define custom event listeners.
41. What are Lightning Web Security and its benefits?
Lightning Web Security (LWS) is a security model for Lightning Web Components that enhances data privacy by isolating components and restricting access to DOM elements across namespaces. It protects against data leaks, ensures secure communication, and improves performance.
42. Explain the use of the @track decorator in LWC.
In earlier versions of LWC, @track was used to make JavaScript object properties reactive. Now, properties in objects are reactive by default, but @track can still be used for specific fields that need deep reactivity within nested objects.
43. How do you set up a custom navigation link in Salesforce Lightning?
Use the NavigationMixin in LWC to create custom navigation links. The mixin allows you to navigate to records, lists, web pages, and more by specifying page references with parameters.
44. What are Lightning Event Types?
Lightning supports three types of events:
Application Events: Broadcasted across the app, used for communication between components in different parts of the app.
Component Events: Scoped to components within a hierarchy.
System Events: Salesforce standard events like force:refreshView.
45. How do you render content conditionally in LWC?
Use JavaScript conditional logic to control rendering by toggling component properties. Then use <template if:true={property}> or <template if:false={property}> in the HTML to show or hide content based on the condition.
46. What is the difference between Aura and LWC component bundles?
Aura component bundles contain multiple files such as controller, helper, CSS, and renderer, each responsible for different aspects of functionality. LWC bundles are simpler, comprising just HTML, JavaScript, and CSS files, leveraging modern web standards.
47. Explain force:refreshView event in Aura.
force:refreshView is a standard event in Aura that refreshes the view to reload record data. It’s often used after record updates to ensure the component displays the most recent data.
48. How do you pass parameters to an Apex controller in Aura?
In Aura, pass parameters to Apex controllers by using action.setParams({ parameter: value }) before invoking the action. This enables dynamic data handling in the Apex logic.
49. What are Lightning Experience Home Page Components?
Lightning Experience Home Page Components include predefined and customizable components like Assistant, News, Key Deals, and customizable report components. These enhance user engagement and productivity on the home page.
50. How can you import third-party CSS frameworks in LWC?
Import third-party CSS frameworks by uploading them as static resources and then loading them with loadStyle() from lightning/platformResourceLoader. This method integrates external styles into the component.
51. What is Lightning Out, and when is it used?
Lightning Out enables embedding Lightning Components in external web pages outside Salesforce. It’s used when you need Salesforce functionality in an external site while maintaining Salesforce security and functionality.
52. What are limitations of Lightning Web Components?
LWC has limitations, such as:
Cannot directly access global window or document objects.
Limited use of certain JavaScript libraries without modification.
Only accessible within Salesforce domains due to strict security.
53. Explain the purpose of Lightning App Builder.
Lightning App Builder is a drag-and-drop tool that allows admins and developers to design custom Lightning pages without code. It supports app, record, and home page customization by combining standard and custom Lightning Components.
54. How can you test Apex methods used in Lightning Components?
Test Apex methods by creating test classes that simulate the data and scenarios the component would encounter. These tests should cover all possible paths and handle governor limits.
55. What is $A.enqueueAction() in Aura?
$A.enqueueAction() is an Aura method that queues client-side controller actions for execution. It allows multiple server-side requests to be processed asynchronously to improve app performance.
56. How do you handle Lightning Data Service errors?
Use the onerror event handler in lightning:recordForm, lightning:recordEditForm, and lightning:recordViewForm to capture and manage errors. This lets you display custom error messages for better user feedback.
57. What is the lightning:layout component?
lightning:layout in Aura and LWC provides a flexible grid system for creating responsive designs. It allows arranging components within a layout that adjusts based on screen size, similar to CSS flexbox.
58. Explain the lightning:input component.
lightning:input is a versatile component that handles different input types, including text, date, email, and number. It provides built-in validation and handles common user input use cases in forms.
59. What is AuraEnabled in Apex?
@AuraEnabled is an annotation in Apex that makes methods accessible to Aura and Lightning Web Components. Methods must be annotated with @AuraEnabled to be called from the client-side JavaScript.
60. What are getter and setter methods in LWC?
Getter methods return computed properties based on the component’s state, while Setter methods are used to validate or modify the incoming data. They are useful for encapsulating component logic.
61. What is the purpose of lightning-record-view-form?
lightning-record-view-form displays Salesforce record data in a read-only format, making it suitable for creating custom view layouts with individual field components like lightning:outputField.
62. Explain the use of @wire with parameters in LWC.
In LWC, @wire can accept parameters to fetch data dynamically. This is achieved by passing an object with reactive properties to the wired method, enabling data to reload automatically when parameters change.
63. What is the difference between handleSave() and handleSubmit() in forms?
handleSubmit() is used in lightning-record-edit-form to trigger form validation and handle custom data processing before saving. handleSave() finalizes the save operation, submitting data to Salesforce.
64. How do you control access to Lightning Components?
Use visibility rules, custom permissions, and profiles to restrict or grant access. In LWC, isAccessible() checks if fields or objects are accessible.
65. What is force:showToast?
force:showToast is a standard Aura event that displays toast messages to notify users of the success or failure of actions. It’s used to improve user interaction feedback.
66. Explain @wire vs Imperative Apex Calls in LWC.
@wire is declarative, reactive, and automatically calls the server whenever reactive parameters change, making it suitable for fetching data. Imperative Apex calls are explicit, only executing when invoked by a function (e.g., button click), allowing for more control over when the data is retrieved.
67. What is lightning-datatable?
lightning-datatable is an LWC component that displays data in a tabular format. It supports sorting, inline editing, pagination, and custom column formats, making it ideal for managing data-intensive interfaces.
68. What is @salesforce/schema used for?
@salesforce/schema is used to import field and object metadata in LWC without needing Apex. This enables direct reference to fields and objects, reducing the dependency on custom code for standard data handling.
69. How do you share data between LWC components?
Data sharing in LWC can be achieved through:
Parent-to-child: Passing data via @api properties.
Child-to-parent: Using custom events.
Sibling communication: Using Lightning Message Service (LMS) or a shared parent component.
70. What is the purpose of @wire(CurrentPageReference)?
@wire(CurrentPageReference) provides the current page state, enabling components to retrieve URL parameters and react to changes in the page’s context, useful in applications where components depend on the URL.
71. What are composite APIs in Salesforce Lightning?
Composite APIs allow developers to make multiple API calls in a single request, reducing the need for multiple server round-trips. It’s efficient for creating and updating multiple records or performing batch operations in a single transaction.
72. Explain the lightning:button component in LWC.
lightning:button is a versatile button component in LWC that supports different styles and variants (brand, neutral, destructive, etc.), along with built-in handling for click events, making it easy to implement standard button actions.
73. How do you implement custom validation in Lightning Components?
Custom validation can be implemented using JavaScript logic in the component controller to check inputs before submission. For more complex cases, Apex can be called to perform server-side validation.
74. What are the benefits of Lightning Data Service (LDS)?
LDS provides a standardized way to manage Salesforce records without writing Apex. It includes caching, reduces the number of SOQL queries, and automatically updates records across components, increasing efficiency and reducing code complexity.
75. Explain how to use lightning-record-form.
lightning-record-form is an all-in-one form component in LWC that allows creating, viewing, and editing records. It simplifies form creation by generating fields based on the layout, handling CRUD operations with minimal code.
76. What is a Service Component in LWC?
A service component in LWC is a component that doesn’t render UI but provides reusable logic or methods, often imported into other components. It’s used for centralizing common utility functions like data transformations or API calls.
77. How do you use @track in complex objects?
Although reactivity in objects is now automatic, when deep reactivity is required (e.g., nested properties), modifying and assigning the entire object can ensure changes are detected. For more complex data, a reactive proxy pattern may be used.
78. What are CSS Modules in LWC?
CSS Modules in LWC allow each component to have isolated, scoped styles, ensuring that CSS rules don’t leak out to other components. This encapsulation maintains consistent styling within the component.
79. How do you debug Lightning Component Events?
Use console.log() in JavaScript handlers, inspect the developer tools, and check for the flow of events in the console. Debugging tools like Chrome DevTools can track event propagation and help with breakpoint debugging.
80. What is lightning-input and its use cases?
lightning-input in LWC provides a variety of input types like text, email, and date, with built-in validation and error handling. It’s commonly used in forms and customizable to meet a wide range of input needs.
81. Explain the event.stopPropagation() method.
event.stopPropagation() prevents further propagation of an event in the capturing and bubbling phases. It is used to control event behavior in nested components to avoid triggering unintended handlers.
82. How do you navigate to a list view in LWC?
Use the NavigationMixin with objectPageReference to navigate to a list view, specifying the object API name and the list view name or ID.
83. What is the purpose of a Lightning Modal Dialog?
Modal dialogs are used for displaying content that requires user action before proceeding. In LWC, they are typically implemented using custom components and CSS or with SLDS modal classes for consistency.
84. How do you handle large datasets in lightning-datatable?
Handle large datasets by implementing lazy loading or pagination, which loads data in chunks. This approach minimizes memory usage and improves component responsiveness.
85. What is Apex Continuation?
Apex Continuation is used to make asynchronous calls to external web services, allowing Salesforce to handle long-running processes by returning control to the user interface without waiting for the response.
86. How does Lightning Web Security impact third-party libraries?
LWS restricts certain global variables and prevents DOM manipulation outside the component scope. Third-party libraries may need to be modified or sandboxed to work within these security constraints.
87. What is force:recordData used for in Aura?
force:recordData is an Aura component that retrieves, creates, updates, or deletes records using LDS. It handles data synchronization with minimal Apex code, making record management easier.
88. How do you set up dynamic CSS classes in LWC?
Dynamic CSS classes are set by binding the class attribute to a JavaScript property in the component’s controller, using conditional logic to apply styles based on state or data.
89. What is renderCallback() in LWC?
renderCallback() is a lifecycle hook that runs after every render, useful for making post-render modifications or triggering additional actions, especially when working with complex DOM interactions.
90. What is a promise chain and when to use it in LWC?
- Answer: A promise chain in JavaScript enables sequential handling of asynchronous calls, making it easy to handle multiple dependent operations. In LWC, it’s used for chaining server calls or handling complex async operations.
91. What is the difference between lightning:recordViewForm and lightning:recordEditForm?
lightning:recordViewForm displays records in a read-only format, while lightning:recordEditForm provides a form for editing record data. Both leverage LDS but have different intended use cases.
92. How do you dynamically import JavaScript files in LWC?
Use the import() function to dynamically load JavaScript files in LWC. This function enables lazy loading, reducing initial load time and improving component performance.
93. What are the differences between SLDS and custom CSS?
SLDS (Salesforce Lightning Design System) is a standardized styling framework for Salesforce components. Custom CSS allows unique designs but requires careful management to ensure it doesn’t conflict with SLDS styles.
94. What is the purpose of lightning-navigation?
lightning-navigation enables standard navigation in LWC, allowing you to navigate to different Salesforce pages, records, or lists without hardcoding URLs, which ensures compatibility with Salesforce navigation.
95. How do you define a custom event in LWC?
Custom events are defined using CustomEvent, where you specify an event name and payload. Use dispatchEvent() to trigger the event, which can then be handled by parent components.
96. Explain lightning-toast in Aura.
lightning-toast is a component that displays toast notifications for feedback messages (success, error, warning, or info). It’s commonly used to provide user feedback in response to actions.
97. What are the benefits of using @salesforce/label in LWC?
@salesforce/label imports custom labels, providing consistent, translatable text. It ensures content is accessible across languages and easily updated without code changes.
98. How does LWC handle reactivity in arrays and objects?
LWC automatically tracks changes to arrays and objects, but for deep updates (like nested properties), you may need to reassign the array/object reference to trigger reactivity.
99. What are Event Listeners in LWC?
Event listeners handle user actions like clicks and input. In LWC, listeners are added directly in HTML with event handlers like onclick or onchange or dynamically in JavaScript for more control.
100. Explain the difference between event.preventDefault() and event.stopPropagation().
event.preventDefault() prevents the default behavior (e.g., form submission). event.stopPropagation() stops the event from bubbling up the DOM, preventing parent elements from receiving the event.