3

In our SF Security Re-Review report a lightning component was flagged for "Lightning: CSS Outside Component".

The lines they referenced were:

...
<button style="font-size: 20px;top: 0.5rem;right: 0.5rem;color : black;"
        class="slds-button slds-modal__close slds-button_icon-inverse"
        title="Close" onclick="{!c.closeMetrixModel}">X</button>
...
...
<div class="slds-form-element " style="margin-top:20px;">
...

We passed the initial security review and I am positive that we had inline styles back then. That was a couple years ago though.

I was under the impression that the issue to avoid is to not modify styles of DOM elements that don't belong to your component and don't use non-standard positioning.

When did this change to inline styles being disallowed completely?

0
5

This is a normal part of the content security policy that Salesforce requires. Over the years this has become stricter (as online security tends to do). Mozilla's MDN web documentation on Content Security Policy also considers this a requirement. In that sense there's nothing left to do but place the inline CSS in an CSS file.

The reason for this is explained in this Google Web Fundamentals post on the Content Security Policy:

It should be clear that CSP is based on allowlist origins, as that's an unambiguous way of instructing the browser to treat specific sets of resources as acceptable and to reject the rest. Origin-based allowlists don't, however, solve the biggest threat posed by XSS attacks: inline script injection. If an attacker can inject a script tag that directly contains some malicious payload (sendMyDataToEvilDotCom();), the browser has no mechanism by which to distinguish it from a legitimate inline script tag. CSP solves this problem by banning inline script entirely: it's the only way to be sure.

1
  • Thank you for your answer. When I was reviewing the CSP for lightning components I saw that SF says "Inline JavaScript is not blocked by the CSP but is blocked in the security review ". I didn't think that was CSS but the documentation you provided makes it seem that way. Jul 28 at 1:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.