Custom Permission Check in LWC always returning undefined

Question

I am trying to disable a button on an LWC based on a custom permission, but I cannot seem to make it work. Here is the code involved:

js controller (let's call it actions):

import hasResetSecQuestionsPermission from '@salesforce/userPermission/Reset_Security_Questions';

export default class actions extends LightningElement { 
  get disableResetSecQuestionsButton() {
    return !hasResetSecQuestionsPermission;
  }
}

Html lightning button:

<lightning-button
  variant="neutral"
  name="resetSecurityQuestionsButton"
  data-id="ResetSecurityQuestions"
  label="Reset Security Questions"
  title="Reset Security Questions"
  onclick={handleClick}
  disabled={disableResetSecQuestionsButton}
  class="slds-align_absolute-center"
></lightning-button>

I am aware that in this case hasResetSecQuestionsPermission should return undefined if the running user has not been assigned the permission, and true if they have. But it seems to return undefined for me even if I have the permission. I have checked I have it for sure by running

System.debug(FeatureManagement.checkPermission('Reset_Security_Questions'));

anonymously and it returns true.

Any ideas what could be wrong?

Answer 1

Seems like error in the import statement, it should be @salesforce/customPermission

Answer 2

For anybody who faced the same issue but is actually using the correct import statement:

• try to open the same component in incognito browser mode
• or enable Debug Mode for your user

In my case, that was a Salesforce caching issue.