I have inserted LWC in visualforce page using lightning out. I want to hide the LWC to some profiles. I removed the access of apex class that LWC uses for those profiles hoping the LWC will hide, but it still shows up. I was looking for a better option to hide LWC other that using custom permissions. Is there any?

Updates: I am displaying the LWC in lead record VF page using lightning out. This is the code I am currently using to check custom permission before rendering the LWC.

<apex:includeLightning />                                                         
    <apex:pageBlock rendered="{!$Permission.Potential_Duplicates_LWC}"> //check permission
    <div id="lwcDemo" />  //display LWC
  • Do you have an option to control the visibility of the VF page? wheres this VF page shown?
    – RedDevil
    Commented Nov 15, 2019 at 8:12
  • @RedDevil the VF page is displayed on lead detail page. The LWC is inserted inside the page. I have updated the question with the details. Thanks.
    – Koustubh
    Commented Nov 15, 2019 at 8:26

2 Answers 2


From the documentation of VF security :

Permission for a Visualforce page is checked at the top level only. Once users can access a page, they can execute all Apex that’s associated with the page. This includes:

  1. The controller for the page and any Apex classes called from the controller class.
  2. Any extension classes for the page and any Apex called from an extension.
  3. Any Apex classes associated with custom components within the page. Any classes associated with the page through the use of apex:include or apex:composition.

This does not specify about lightning component inside VF, but in general SF rule, if you can access VF page you can access everything inside.

A solution would be to use rendered tag and check profiles or custom permission and then only display lwc.


Have you tried hiding the component using slds-hide / slds-showwith css? You can get the profile/user ids you want from the apex controller and hide the component based on the logic you need.

    <span class={cssDisplay}>
        <div id="spinnerDiv" class="demo-only demo--inverse" style="height: 10rem">
        <div class="slds-spinner_container">
            <div role="status" class="slds-spinner slds-spinner_medium">
                <span class="slds-assistive-text">Loading</span>
                <div class="slds-spinner__dot-a"></div>
                <div class="slds-spinner__dot-b"></div>

SLDS Visibility

  • 2
    the issue with css hiding is it can be bypassed by just inspect... blocking it from server-side would be best. Commented Nov 15, 2019 at 9:00

You must log in to answer this question.

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