Skip to content

Instantly share code, notes, and snippets.

@joyheron
Last active January 22, 2020 10:02
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save joyheron/da0aea9833876d6f2bd5798950523a20 to your computer and use it in GitHub Desktop.
Save joyheron/da0aea9833876d6f2bd5798950523a20 to your computer and use it in GitHub Desktop.
Define Custom Elements in ClojureScript
;; Solution based on https://stackoverflow.com/questions/50295703/create-custom-elements-v1-in-es5-not-es6
(defn define-element! [name on-connect]
(let [my-el (fn [] (this-as this (.construct js/Reflect js/HTMLElement #js [] (.-constructor this))))
_ (set! (.. my-el -prototype) (.create js/Object (.-prototype js/HTMLElement)))
_ (set! (.. my-el -prototype -constructor) my-el)
_ (.setPrototypeOf js/Object my-el js/HTMLElement)
_ (set! (.. my-el -prototype -connectedCallback) on-connect)]
(.define js/customElements name my-el)))
(define-element! :my-element #(.log js/console "hi!"))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment