Secure Coding Guide

Secure Coding Guidelines
Security Considerations for Flow Design
Security Considerations for Session IDs
Secure Coding Cross Site Scripting
Secure Coding SQL Injection
Secure Coding Cross Site Request Forgery
Secure Coding Secure Communications
Storing Sensitive Data
Open Redirect Vulnerabilities
Undersand Clickjacking
Authorization and Access Control
Lightning Security
Marketing Cloud Engagement API Integration Security
Secure Coding PostMessage
Secure Coding WebSockets
Platform Security FAQs
PDF

Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Undersand Clickjacking

Clickjacking is a security vulnerability where an invisible iframe or layer overlays visible secure content. This vulnerability misguides users into clicking hidden elements that can potentially hijack their sessions and run unauthorized actions. Clickjacking can lead to data intrusion, unauthorized emails, changed credentials, or other malicious site-specific results. With clickjack protection, however, you can secure your site by controlling whether browsers allow frames pointing to your pages.

Clickjacking Risks from CSS Positioning

In Lightning Web Components (LWC) and Aura components, improper use of CSS positioning introduces clickjacking risks. Because these components are reusable, they can appear on any page. A component that works on one page can obfuscate buttons, links, or forms on another page, leading to a security breach.

This vulnerability is often called Lightning: CSS Outside of Component and it arises because CSS defines the layout and stacking order across namespaces. To secure your components and prevent layout conflicts, don't use position: absolute or position: fixed within the CSS of externally exposed or shared components. Use absolute or fixed positioning only if:

  • The component isn’t exposed outside of the namespace.
  • The component's visibility is strictly limited to pages owned by the namespace.

Manage Component CSS Scoping and Positioning

To avoid unintended interactions with other components, wrap component-specific CSS within the component's styling scope, and manage any positioning, stacking (z-index), or overlaying behavior through app-level layout controls. 

1/* VULNERABLE: CSS in a globally exposed/shared LWC or Aura component */
2.floating-action-menu {
3    position: absolute; /* NOT ALLOWED on shared pages */
4    top: 50px;
5    left: 50px;
6    z-index: 9999;
7}
8
9.sticky-banner {
10    position: fixed; /* NOT ALLOWED on shared pages */
11    bottom: 0;
12    width: 100%;
13}

Identify Vulnerabilities

Review CSS for properties that could allow a component to overlay or intercept clicks intended for other components or page elements. Inspect component files for these specific layout indicators:

  • position: fixed
  • position: absolute
  • High z-index values that override the standard stacking context
  • Extensive negative margins or large padding offsets

For more guidance, see Salesforce Help: Configure Clickjack Protection