API openTab is not currently supported in this application

Question

I have below aura component added on the account record page from the app builder

HTML:

<aura:component implements="flexipage:availableForAllPageTypes">
    <lightning:workspaceAPI aura:id="workspace" />
    <lightning:button label="Open Tab" onclick="{! c.openTab }" />
</aura:component>

JS:

openTab: function (component, event, helper) {
    const workspaceAPI = component.find("workspace");
    workspaceAPI.openTab({
        url: '/apex/my_vf_page',
        focus: true
    }).then(function (response) {
        workspaceAPI.getTabInfo({
            tabId: response
        }).then(function (tabInfo) {
            console.log("The recordId for this tab is: " + tabInfo.recordId);
        });
    }).catch(function (error) {
        console.log(error);
    });
}

but it logs below error on the console log

Error: API openTab is not currently supported in this application.

Could someone please help me what am I doing wrong?

Answer 1

You are probably not in a console app. Tabs only work in a console navigation app, not in the standard navigation app. You can find the setting under App Manager -> Your App, like here:

Answer 2

You must test this component in Console app, you can add this component to a Sales Console app/Service Console app for testing, there it will work fine. This is a known limitation of WorkspaceAPI, as WorkspaceAPI only works in Lightning Console application.

If you want to navigate to another component in new tab you can use lightning:Navigation https://developer.salesforce.com/docs/component-library/bundle/lightning:navigation/documentation