The Salesforce Summer ’17 release has rolled into Developer orgs, Production orgs, and Sandboxes along with new release notes that cover all the enhancements and additions across the various product offerings of Salesforce. You can read the entire release notes here. What got my attention was all of the Lightning Component Framework Enhancements.
In this post we will cover some of the newly added capabilities to the Lightning Component Framework with examples and use cases.
Generally Available Features
Override Standard Actions With Lightning Components
If you have been using Salesforce Classic, one of the features that makes the Salesforce user interface flexible to change is the ability to override the standard New, View, and Edit buttons for objects with Visualforce. This was missing in Lightning until now. With the current release, the component framework provides an interface named “lightning:actionOverride” to override these with a Lightning component.
Sample Lightning code to override the Account ‘New’ button is below. Notice the “lightning:actionOverride” interface.
The screenshot shows the Account ‘View’ button overridden.
Clearly, this new interface can be used to create an intermediary page to perform additional logic before navigating to view the page.
aura:valueRender Event
Previously when the component rendered or rerendered one had to write a custom renderer as documented here to modify the DOM or to react to render or rerender.
With Summer’ 17, you can directly use an event handler as shown below:
instanceof operator in JavaScript code is allowed under Locker Service
LockerService previously did not allow us to use the instanceof operator in Javascript. instanceof checks the current object and returns true if the object is of the specified object type.
Many third party libraries under locker did not previously work because they extensively used the instanceof operator. Except for when checking the array object type, we can now use the instanceof keyword.
Toaster allows links and message templates
The toaster event now supports messageTemplate and messageTemplateData to allow links and value substitution.
Here is a simple example code snippet:
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
mode: 'sticky',
message: 'Event Created',
messageTemplate: 'Event at {0} Organised. To learn about event visit us at {1}!',
messageTemplateData: ['CodeScience', {
url: 'https://www.codescience.com.com/',
label: '@codescience',
}
]
});
toastEvent.fire();
The toaster shown below consists of a substituted value and link.
Integrate Wave Analytics Dashboards With Lightning Components Using Newly Added Wave Lightning Events
Summer ’17 added two new Wave events to ease the integration between the Wave dashboard in Lightning Experience and custom lightning components. This will need an additional Wave platform license.
The two newly added events are:
- wave:update – This allows us to change filters of the Wave dashboard from the Lightning component.
- wave:selectionChanged – This event can’t be handled by the lLghtning component when Wave dashboard selections are changed.
Below is the code snippet to fire a Wave update event. Notice that dashboardId and the filter objects are the event parameters. DashboardId can be configured by the admin within the component.
var filter = '{"Opp_Amount_by_Owner__1": {"Stage": ["01 - Prospecting"]}}';
var dashboardId = component.get('v.dashboardId');
var evt = $A.get('e.wave:update');
evt.setParams({
id: '0FK6A000000L61ZWAS',
value: filter,
Type: "dashboard"
});
evt.fire();
The below shows pictorially how this works.
The Lightning component will fire an event as shown below
BETA Features
Lightning Data Service
Lightning Data Service simplifies Lightning component builds by providing declarative syntax for CRUD operations from the Lightning component. The key features of the data service are as described below:
- No Apex controller is required and declarative syntax exists for CRUD operations using the force:recordData tag.
- Automatic enforcement of FLS and sharing rules.
- Improvement performance since, under the hood, components implement caching and use local storage.
- Data service automatically notifies other components when data is changed for a component.
To learn syntax and how to use, you can refer to the Lightning Developer Guide located here.
Limitations – Note that Lightning Data Service works with a limited number of objects and there are a lot of objects that are not supported. Also note that the data service is not supported in Lightning Out, template-based Lightning Communities, or Visualforce.
Pilot Features
Integrate Custom Apps Into Chatter Publisher
This opens lots of possibilities for ISV vendors to provide Lightning components that can embed and work inside Salesforce Chatter Publisher. This is a pilot program and hence you will need to work with Salesforce to get early access to it.
There are couple of new interfaces added to help build Chatter Publisher extensions.
1. lightning:availableForChatterExtensionComposer – This allows you to plug a menu icon in the composer and open a modal. It’s very useful in allowing integrations with third party applications. The below screenshot gives an idea of where these extensions appear in Chatter Publisher.
2. lightning:availableForChatterExtensionRenderer – This allows you to deliver a custom payload from the Chatter extension apps. Shown below is the custom message format.
To read more about implementation details. follow the developer guide document here.
Final Thoughts
These are some of the exciting additions to the Lightning Component Framework. In this release, we can clearly see some performance improvements in the entire Lightning Experience and also better error messages to assist developers.
Accelerate your Lightning initiative
We’re here to help you succeed. At CodeScience we have deep expertise in building managed package solutions and Lightning components. We can get you there in warp speed. Let’s talk!
