Lightning and JavaScript Buttons

Lightning - a collection of technologies for the Salesforce platform, consisting of Lightning experience (new UI for Salesforce), Lightning Design System (CSS Framework that facilitates users to easily style the apps) and Lightning Framework (A Javascript framework that enables users to create single page applications and Lightning Components), has been in vogue for quite some time now. With an improved UI, drag and drop capabilities and reusable Lightning Component, Lightning makes the process of app building a little easier for the developers.

But as the saying goes, every coin comes with two faces, and so does Lightning.

We all know how much we love custom JavaScript buttons and have been using them for years in Salesforce Classic to fulfil several business requirements such as:

  1. pre-populating information in new records
  2. validating fields before saving a record
  3. executing apex classes
  4. conditionally redirecting users to different pages

The list of cons continues to grow, primarily because of the ease with which these buttons can be created and the flexibility that they provide in accomplishing our requirements. But, here comes the bad news, these alluring JavaScript buttons can no longer be used with the new Lightning UI. The security risks involved with the OnClick JavaScript is cited as the main reason by Salesforce behind the decision of discontinuing with JavaScript buttons in the new improved UI. Let us take a closer look at this.

Security Risk with JavaScript Buttons

JavaScript is a very flexible language and has the ability to access DOM, i.e., the Document Object Model (in layman terms, Salesforce database) and BOM, the Browser Object Model (browser features). This makes it easier for the developers to add client-side functionality thus making it a powerful development tool. This holds true only for authorised agents, however, anything left un-advocated in wrong hands can wreak havoc, and so is the case with JavaScript. Accessibility to DOM and BOM leads to an ease for the unauthorized sources to gain access to confidential information. Since JavaScript allows dynamic content, it becomes fairly easy for hackers to make use of Cross Site Scripting (XSS) to inject malicious client-side code into web pages to get access to information crucial to the users, such as, their session and cookies. This information can be misused to extract confidential data and even manipulate form entries.

Lightning is based on the LockerService Framework and aims at providing the most robust security model possible. Thus, as a result OnClick JavaScript buttons are not supported.

Lightning Alternatives to JavaScript Buttons

Now that we’re all familiar with the security risks posed by JavaScript buttons, let us delve into the alternative solutions provided in Lightning to make the shift from JavaScript buttons. These can be broadly categorised into two categories:

  1. Declarative Solutions
  2. Programmatic Solutions
Let us describe them in a little detail one by one.

Declarative Solutions

Declarative solutions are the ones that do not involve direct coding and can be achieved with point and click methodology. These are:

Custom URL Buttons: Custom URL buttons are the ones that takes the user to some specified URL (a page in the org itself or to some other external website). Several functions, such as URLFOR and $Action, are available that can be used for internal links. Also, Relative Salesforce URLs (/{!Account.ID}) can be used instead of hard-coded URLs.
JavaScript buttons can be converted to Custom URL buttons by updating the content source of the button from OnClick JavaScript to URL.

content source visualforce page

Quick Actions: Quick actions can be used to replace buttons that populate a new record with values based on the values in the record where a user clicks the button. Quick Actions can be created by navigating to the Buttons, Links and Actions section of the object.

new action button

Custom Visualforce Buttons: These can be used to replace JavaScript buttons that direct to some visualforce page. If the VisualForce page that needs to be opened uses the Standard Controller for the object where the button resides, the existing button can be updated to use the Visualforce Page as the Content Source. If not, the VisualForce page can be made available as a tab.

content source url

Programmatic Solutions

As the name suggests, these are the ones that involve writing of code in some way or the other, which means, programmatic knowledge is a must to implement these.

1. Triggers: We can write simple triggers as an alternative to creating JavaScript buttons. Several complex functionalities can be easily achieved with the help of triggers.

2. Lightning Actions: Lightning Actions can simply be described as Quick Actions that call Lightning Components, which means we can develop Lightning Components to replace the JavaScript Buttons and can then call them using Lightning Actions. One of the advantages of using Lightning Actions over other solutions is that the Lightning Components can be reused in other Lightning Pages and Components.

3. Visualforce Pages: Lightning Actions are recommended to replace JavaScript buttons, wherever possible, however in certain scenarios they cannot be used. One such scenario is of a JavaScript button that performs a mass action on records from a List View. In this case, VisualForce Pages can be used to replace the button.

Although there is no end to exploring and trying new things, these are some of the options that we have been frequently using to replace our beloved JavaScript Buttons in Lightning. Happy parting!

For any query on Lightning And JavaScript Buttons, contact support@astreait.com