Add onclick attribute to HTML nodes (#43)

Makes onclick a first class attribute on HTML body nodes.
JohnSundell · May 7, 2020 · 9e53175 · 9e53175
1 parent 841fc5c
commit 9e53175
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 1 deletion.
diff --git a/Sources/Plot/API/HTMLAttributes.swift b/Sources/Plot/API/HTMLAttributes.swift
@@ -464,6 +464,17 @@ public extension Node where Context == HTML.ScriptContext {
     }
 }
 
+// MARK: - Javascript
+
+public extension Node where Context: HTML.BodyContext {
+    /// Add a script to execute when the user clicks the current element.
+    /// - parameter script: The script to execute when the user clicks on the node.
+    ///   Usually prefixed with `javascript:`.
+    static func onclick(_ script: String) -> Node {
+        .attribute(named: "onclick", value: script)
+    }
+}
+
 // MARK: - Other, element-specific attributes
 
 public extension Node where Context == HTML.AbbreviationContext {

diff --git a/Tests/PlotTests/HTMLTests.swift b/Tests/PlotTests/HTMLTests.swift
@@ -671,6 +671,19 @@ final class HTMLTests: XCTestCase {
         </picture></body>
         """)
     }
+
+    func testOnClick() {
+        let html = HTML(
+            .body(
+                .div(
+                    .onclick("javascript:alert('Hello World')")
+                )
+            )
+        )
+        assertEqualHTMLContent(html, """
+        <body><div onclick="javascript:alert('Hello World')"></div></body>
+        """)
+    }
 }
 
 extension HTMLTests {
@@ -738,7 +751,8 @@ extension HTMLTests {
             ("testDataAttributes", testDataAttributes),
             ("testSubresourceIntegrity", testSubresourceIntegrity),
             ("testComments", testComments),
-            ("testPicture", testPicture)
+            ("testPicture", testPicture),
+            ("testOnClick", testOnClick)
         ]
     }
 }