Safari v14.1 CSP Violation - Usage of "element.removeAttribute("style…

…")" causes style-src CSP Violation. https://bugs.webkit.org/show_bug.cgi?id=227349 <rdar://80020346> Reviewed by Brent Fulgham. If the new style string is null, clear the inline style without checking if the element's inline type should be blocked by CSP. This behavior matches Chrome and Firefox. * Source/WebCore/dom/StyledElement.cpp: (WebCore::StyledElement::styleAttributeChanged): * LayoutTests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute-expected.txt: Added. * LayoutTests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute.html: Added. Canonical link: https://commits.webkit.org/254409@main
WebKit · Sep 12, 2022 · 572f10393126fefe8d887573d2644b27931a2516 · 572f103
1 parent 2602b20
commit 572f10393126fefe8d887573d2644b27931a2516
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 1 deletion.
diff --git a/...ests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute-expected.txt b/...ests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute-expected.txt
@@ -0,0 +1,3 @@
+CONSOLE MESSAGE: Refused to apply a stylesheet because its hash, its nonce, or 'unsafe-inline' does not appear in the style-src directive of the Content Security Policy.
+CONSOLE MESSAGE: PASS: style attribute successfully removed.
+
diff --git a/LayoutTests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute.html b/LayoutTests/http/tests/security/contentSecurityPolicy/allow-inline-remove-attribute.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta http-equiv="Content-Security-Policy" content="
+        default-src 'none';
+        connect-src 'self';
+        script-src 'self' 'sha256-kSyfQ4joIKFsQ/vuAU0PsTihY+jZ6waGXCmEWp6wMf4=';
+        style-src 'self' 'sha256-abBtF99/+bWrkA5qp1+WvGjHjqVlNpUWZD8/uEg8wKA=';
+        " />
+    <style>
+        .section {
+            height: 50vh;
+            width: 100vw;
+            background: paleturquoise;
+            display: flex;
+            flex-direction: COLUMN;
+            justify-content: center;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="container">
+        <div class="section" id="section">
+        </div>
+    </div>
+    <script>
+        if (window.testRunner) {
+            testRunner.dumpAsText();
+            testRunner.waitUntilDone();
+        }
+        let section = document.getElementById("section");
+        section.style.backgroundColor = "#2196f3";
+        section.setAttribute("style", "background-color: #2196f3");
+        section.removeAttribute("style");
+
+        if (section.style.backgroundColor == "rgb(33, 150, 243)") {
+            console.log("FAIL: style attribute was not removed.");
+        }
+        else {
+            console.log("PASS: style attribute successfully removed.");
+        }
+        testRunner.notifyDone();
+    </script>
+</body>
+
+</html>
diff --git a/Source/WebCore/dom/StyledElement.cpp b/Source/WebCore/dom/StyledElement.cpp
@@ -230,7 +230,9 @@ void StyledElement::styleAttributeChanged(const AtomString& newStyleString, Attr
     if (document().scriptableDocumentParser() && !document().isInDocumentWrite())
         startLineNumber = document().scriptableDocumentParser()->textPosition().m_line;
 
-    if (reason == ModifiedByCloning || document().contentSecurityPolicy()->allowInlineStyle(document().url().string(), startLineNumber, newStyleString.string(), CheckUnsafeHashes::Yes, *this, nonce(), isInUserAgentShadowTree()))
+    if (newStyleString.isNull())
+        ensureMutableInlineStyle().clear();
+    else if (reason == ModifiedByCloning || document().contentSecurityPolicy()->allowInlineStyle(document().url().string(), startLineNumber, newStyleString.string(), CheckUnsafeHashes::Yes, *this, nonce(), isInUserAgentShadowTree()))
         setInlineStyleFromString(newStyleString);
 
     elementData()->setStyleAttributeIsDirty(false);