Add support for CSSStyleSheet instance in DomRenderer for CSP enabled applications without relying on nonce#1666
Open
rohitkr wants to merge 2 commits intocssinjs:masterfrom
Open
Conversation
… solely on nonce This commit adds support for using a `CSSStyleSheet` instance provided by the user in the `DomRenderer` class. This enhancement allows JSS to inject styles directly into a `CSSStyleSheet` instance, which is particularly useful in CSP enabled applications where inline styles are restricted and the nonce value is not exposed. - Updated the constructor of `DomRenderer` to accept a `CSSStyleSheet` instance as the `insertionPoint`. - Modified the `insertStyle` method to handle `CSSStyleSheet` instances. - Maintained support for nonce while providing an alternative for environments where the nonce value is not exposed. This change improves the flexibility and security of style injection in JSS.
…support This commit updates the documentation to include instructions for using a `CSSStyleSheet` instance with JSS in Content Security Policy (CSP) enabled applications. This addition complements the improvement introduced in this pull request by providing detailed guidance for secure style injection without relying solely on nonce attributes. - Added a new section, **Using a `CSSStyleSheet` instance for secure style injection**, under **Configuring Content Security Policy**. - Included an example demonstrating how to create and use a `CSSStyleSheet` instance with JSS. - Documented the benefits and notes of using a `CSSStyleSheet` instance as an alternative to nonce-based CSP compliance. To enhance user understanding and provide clear instructions on leveraging the newly introduced feature for improved flexibility and security in CSP-enabled environments.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This pull request introduces support for using a
CSSStyleSheetinstance provided by the user in theDomRendererclass. This enhancement is aimed at improving the flexibility and security of style injection in Content Security Policy (CSP) enabled applications. While maintaining support for nonce, it also provides an alternative for environments where the nonce value is not exposed.Problem
In CSP enabled applications, inline styles are often restricted, making it challenging to manage stylesheets securely. The current implementation of JSS supports nonce for CSP, but it does not support the direct use of a
CSSStyleSheetinstance created and managed outside of JSS. This limitation hinders the ability to inject styles into a secureCSSStyleSheet, especially in environments where the nonce value is not exposed.Solution
The proposed solution allows users to provide a
CSSStyleSheetinstance as theinsertionPointin theDomRendererclass. The changes include:DomRendererto accept aCSSStyleSheetinstance.insertStylemethod to handleCSSStyleSheetinstances.Changes
DomRendererconstructor to check ifinsertionPointis an instance ofCSSStyleSheetand use it directly if true.insertStylemethod to insert rules into the providedCSSStyleSheetinstance.Impact
This change enhances the security and flexibility of JSS by allowing styles to be injected into a
CSSStyleSheetinstance, which is particularly useful in CSP enabled environments. It ensures that JSS can be used in a wider range of applications with strict security policies, even when the nonce value is not exposed.Testing
The changes have been tested in a CSP enabled environment to ensure that styles are correctly injected into the provided
CSSStyleSheetinstance without violating CSP rules.Corresponding Issue(s):
What Would You Like to Add/Fix?
Todo
Expectations on Changes
Changelog