Javascript button should work in Lightning

Question

I want to convert below code to Lightning Experience. Can anyone help me how to do that?

{!REQUIRESCRIPT("/support/console/28.0/integration.js")}

try
{
// if in the console
if (sforce.console.isInConsole())
{
// get enclosing primary tab id
sforce.console.getEnclosingPrimaryTabId(getEnclosingPrimaryTabIdCallback);
}
else
{
// not in console so just open up a new browser window/tab
alert('Not available outside of console!');
}
}
catch (e)
{
// alert exceptions
alert('Exception caught: ' + e);
}

// function for handling getEnclosingPrimaryTabId function callback
function getEnclosingPrimaryTabIdCallback(result)
{

// retrieve primary tab id and open sub tab for managing case products
var primaryTabId = result.id;
sforce.console.openSubtab(primaryTabId , '/apex/ManageCaseProducts', false, 'Manage Products', null, openSubtabCallback, 'ManageProducts');
}

// function for handling openSubtab function callback
function openSubtabCallback(result)
{
sforce.console.focusSubtabById(result.id, null);
};

Should I write the Lightning Component or VF page is fine for this.

Please let me know how this will work in Lightning experience.

Answer 1

As JavaScript buttons are not supported in Lightning Experience, A Lightning Component would be ideal for this. Also, not a Visualforce Page because, it is rendered in an Iframe in LEX and you would not be able to interact with the console APIs.

Basically you can create:

1. Lightning Component and use the workspace API(to interact with tabs and console)
   • onInit - check for your logic
2. A Quick Action to launch the Lightning Component and add it to your record page

Workspace API: https://developer.salesforce.com/docs/component-library/bundle/lightning:workspaceAPI/specification

Lightning Alternatives to JavaScript Buttons: https://trailhead.salesforce.com/en/content/learn/modules/lex_javascript_button_migration