[SalesForce] Can a lightning web component know the difference between console and standard view

I created a LWC which displays a link to an object… and I want that link to "open in a new window" (target "_blank") if the user is viewing it via standard navigation view (non-console). And, if the user is viewing the LWC within Service Console, then it should utilize standard open (NavigationMixin.Navigate) to open in the current window (which will default to opening a new tab within Console).

I can't seem to find a way for the LWC to be aware of it's context – whether or not it is being displayed in Console. Is this possible?

(I can provide the LWC; however, I don't think the details of it are relevant to the question, but if it helps someone answer the question I can.)

Best Answer

At the current time, LWC are not supported in the Console. You'd need to put a LWC inside an Aura Component Wrapper in order to use one within the Console. See the LWC Developer Documentation for more on this.

Lightning Web Components doesn’t currently support these Salesforce experiences and tools. To use a Lightning web component with these experiences and tools, wrap the component in an Aura component.

Lightning Out

Lightning Components for Visualforce

Standalone Apps

Salesforce Console (Navigation Item API, Workspace API, UtilityBar API)

Utility Bars

URL Addressable Tabs

Flows

Snap-ins Chat

Lightning for Gmail, Outlook Integration

EMP API, Conversation Toolkit API, Omni Toolkit API, Quick Action API

Standard Action Overrides, Custom Actions, Global Actions, List View Actions, Related List View Actions

Chatter Extensions

To do what you're asking, you'd also need to implement the Lightning Console JavaScript API in your component. If you've not migrated to the Lightning Console, I wouldn't expect the toolkit for the classic console to work with LWC's.

Related Solutions

[SalesForce] How to know/find the Id or name of an already open primary tab in the console

You need the getFocusedPrimaryTabId, or possibly getPrimaryTabIds:

(function (c) {
    "use strict";
    var focusedPrimaryTabId, allPrimaryTabIds;
    c.getFocusedPriaryTabId(function (result) {
        focusedPrimaryTabId = result.id;
    });
    c.getPrimaryTabIds(function (result) {
        allPrimaryTabIds = result.ids;
    });
})(sforce.console);

Couple fun gotchas:

These methods do not return anything. You can only access their value from a callback.
Unlike Apex, Javascript properties are case sensitive, so result.Id won't work.

[SalesForce] Lightning Web Components and CSS Frameworks

Salesforce Strongly advises against using Bootstrap (both, css and js files):

LockerService and Lightning Container Component: Securely Using Third-Party Libraries in Lightning Components

You may also want to reconsider the use of UI libraries like Bootstrap and jQuery UI. Although these libraries provide useful components, they have their own UI identity that can clash with the Lightning Experience identity. The Base Lightning Components and the Lightning Design System offer similar capabilities while providing a consistent user experience.

Also, note that not all 3rd party libraries (actually, most) are not supported.

you can refer to this post:

Which external Javascript libraries work with Lightning Locker Service?

Best Answer

Related Solutions

[SalesForce] How to know/find the Id or name of an already open primary tab in the console

[SalesForce] Lightning Web Components and CSS Frameworks

Related Topic