Polyfill SVGElement.contains()

Fixes #274

References:
- https://bugs.jquery.com/ticket/10832
- react-bootstrap/dom-helpers#12

packages/@stimulus/core/src/tests/cases/action_tests.ts

@@ -11,6 +11,9 @@ export default class ActionTests extends LogControllerTestCase {
       <div id="multiple" data-action="click->c#log click->c#log2 mousedown->c#log"></div>
     </div>
     <div id="outside"></div>
+    <svg id="svgRoot" data-controller="c" data-action="click->c#log">
+      <circle id="svgChild" data-action="mousedown->c#log" cx="5" cy="5" r="5">
+    </svg>
   `
 
   async "test default event"() {
@@ -51,4 +54,13 @@ export default class ActionTests extends LogControllerTestCase {
       { name: "log2", eventType: "click" }
     )
   }
+
+  async "test actions on svg elements"() {
+    await this.triggerEvent("#svgRoot", "click")
+    await this.triggerEvent("#svgChild", "mousedown")
+    this.assertActions(
+      { name: "log", eventType: "click" },
+      { name: "log", eventType: "mousedown" }
+    )
+  }
 }

packages/@stimulus/polyfills/index.js

@@ -8,3 +8,9 @@ import "core-js/fn/set"
 import "element-closest"
 import "mutation-observer-inner-html-shim"
 import "eventlistener-polyfill"
+
+if (typeof SVGElement.prototype.contains != "function") {
+  SVGElement.prototype.contains = function(node) {
+    return this === node || this.compareDocumentPosition(node) & Node.DOCUMENT_POSITION_CONTAINED_BY
+  }
+}