0

Currently, I am using below tag to detect whether VF Page is embedded in lightning or Classic or Mobile devices. Below the line of code return values as Theme3, Theme4t, Theme4u etc. These values can be changed by salesforce at any time.

var currentUserContext = "{!$User.UIThemeDisplayed}";

Instead of below lines, is there any other way we can check whether VF page is loaded in Lightning or classic or S1 mobile app.

0

1 Answer 1

1

As of now, I can see UI Theme Detection can be done in one of two ways:

Accessing global variables:

  • $User.UITheme – Returns the theme that is supposed to be used.
  • $User.UIThemeDisplayed – Returns the theme that is actually being used.

Calling Apex utility methods:

  • UserInfo.UITheme() – Returns the theme that is supposed to be used

  • UserInfo.UIThemeDisplayed() – Returns the theme that is actually being used

If users with Lightning Experience permissions are using an unsupported browser, they may experience Salesforce rendered in Salesforce Classic. If this happens, UITheme and UIThemeDisplayed return different values.

Note: Detecting the UI context via a server call is expensive, and should therefore be cached or carefully isolated into init or startup methods(see Apex utility sample below). This will prevent utility being called every time the component is rendered.

If you only need to distinguish between Lightning Experience and Salesforce1, check out $Browser.

{!$Browser.isTablet}
{!$Browser.isPhone}
{!$Browser.isAndroid}
{!$Browser.formFactor}

The $Browser global value provider returns information about the hardware and operating system of the browser accessing the application.

We can also use javascript to find the current user context. Here is the snippet of code that helps you finding the user Experience context

<script>
var j$ = $.noConflict();
j$( document ).ready(function() {
console.log( “ready!11” );
var parentPageUrl      = document.referrer;
//alert(parentPageUrl);
if(parentPageUrl.indexOf(“.lightning.force.com”) > 0){
j$(“body”).addClass(‘main-sec-lightning’);
}
else{
j$(“body”).addClass(‘main-sec-classic’);
}
})
</script>

Reference:- How to Share Salesforce Visualforce Pages Between Classic and Lightning Experience?

Introducing UI Theme Detection for Lightning Experience

Not the answer you're looking for? Browse other questions tagged .