luciano/reitit
1
0
Fork 0
mirror of https://github.com/metosin/reitit.git synced 2025-12-17 16:31:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #258 from fraxu/shadow-dom-fix

Browse source 
Support html5 links inside Shadow DOM
This commit is contained in:
Juho Teperi 2019-04-15 11:13:15 +03:00 committed by GitHub
commit 9241de9a43
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
modules/reitit-frontend/src/reitit/frontend/history.cljs
View file

@ -59,6 +59,14 @@
el
(recur (.-parentNode el)))))))
(defn- event-target [event]
"Read event's target from composed path to get shadow dom working,
fallback to target property if not available"
(let [original-event (.getBrowserEvent event)]
(if (exists? (.-composedPath original-event))
(first (.composedPath original-event))
(.-target event))))
(defrecord Html5History [on-navigate router listen-key click-listen-key]
History
(-init [this]
@ -76,7 +84,7 @@
(fn ignore-anchor-click
[e]
;; Returns the next matching anchestor of event target
(when-let [el (closest-by-tag (.-target e) "a")]
(when-let [el (closest-by-tag (event-target e) "a")]
(let [uri (.parse Uri (.-href el))]
(when (and (or (and (not (.hasScheme uri)) (not (.hasDomain uri)))
(= current-domain (.getDomain uri)))

38
test/cljs/reitit/frontend/history_test.cljs
View file

@ -127,3 +127,41 @@
(done))
(do (is false "extra event")))))
{:use-fragment false})]))))
(deftest html5-history-link-click-test
(when browser
(gevents/removeAll js/window goog.events.EventType.POPSTATE)
(gevents/removeAll js/window goog.events.EventType.HASHCHANGE)
(gevents/removeAll js/document goog.events.EventType.CLICK)
;; Will fail with "Some of your tests did a full page reload!"
;; if link events are not handled
(async done
(let [clicks (atom nil)
click-next (fn []
(let [target (first @clicks)]
(swap! clicks rest)
(.click target)))
shadow-element (js/document.createElement "DIV")
shadow-root (.attachShadow shadow-element #js {:mode "open"})
history (rfh/start! router (fn [_ history]
(when @clicks
(if (seq @clicks)
(click-next)
(do
(rfh/stop! history)
(done)))))
{:use-fragment false})
create-link #(doto
(js/document.createElement "A")
(.setAttribute "href" (rfh/href history ::foo)))
document-link (create-link)
shadow-link (create-link)]
(.appendChild js/document.body document-link)
(.appendChild js/document.body shadow-element)
(.appendChild shadow-root shadow-link)
(reset! clicks [document-link shadow-link])
(click-next)))))