ckirkendall / enfocus

DOM manipulation and templating library for ClojureScript inspired by Enlive.
http://ckirkendall.github.com/enfocus-site/
370 stars 41 forks source link

transform object DocumentFragment to string #102

Open defclass opened 9 years ago

defclass commented 9 years ago

Hi @ckirkendall , I am sorry to ask this low level question. I googling couple of hours, get no answer .I am not sure is there a mechanism to transform object DocumentFragment (return from the function defined by defsnippet or deftemplate) to string ? function.-innerHTML just return nil. Sometimes I need the string form of object DocumentFragment, Thanks.

ckirkendall commented 9 years ago

Can you post the code that returns nill on .-innerHTML? That seems like something is wrong. That is how I do it in enfocus tests. You might need to pull the nodes out before you can call innerHTML.

defclass commented 9 years ago

Thanks for your reply. deftemplate definition is

(em/deftemplate test-template :compiled "resources/tpl/jsnippet/users.html"
  []
  )

this transforms below can get the html which return by (test-template) invoke,

dess.users> (ef/at "#wrapper" (ef/content (test-template)))

<div id="wrapper">
<div id="dropdown-list">
  <div role="group" class="btn-group">
    <button aria-expanded="false" aria-haspopup="true" data-toggle="dropdown" class="btn btn-xs btn-warning dropdown-toggle" type="button">
      handler
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
      <li><a rel="1" href="#">action1</a></li>
    </ul>
  </div>
</div>
</div>

and (test-template) can return #object[DocumentFragment [object DocumentFragment]]

howerver, (.-innerHTML (test-template) return nil.

I am not sure whether need some other info , please just comment.

ckirkendall commented 9 years ago

What browser are you using? Also try this and let me know what you get.

(apply str (for [node (test-template)] (.-innerHTML node))
defclass commented 9 years ago

I have tried for firefox (40.0.3) and opera (Opera 31.0) on linux.

for opera:

(apply str (for [node (test-template)] (.-innerHTML node)))

#object[Error Error: [object DocumentFragment] is not ISeqable]
Error: [object DocumentFragment] is not ISeqable
    at Error (native)
    at cljs.core.seq (http://wc.local/admin/js/admin-main-debug.js:5941:69)
    at cljs.core.pr_str.call.cljs.core.apply.call.iter__21561__auto__ (eval at <anonymous> (http://wc.local/admin/js/admin-main-debug.js:28426:264), <anonymous>:5:40)
    at cljs.core.LazySeq.sval (http://wc.local/admin/js/admin-main-debug.js:9071:122)
    at cljs.core.LazySeq.cljs$core$ISeqable$_seq$arity$1 (http://wc.local/admin/js/admin-main-debug.js:9106:8)
    at Object.cljs.core.seq (http://wc.local/admin/js/admin-main-debug.js:5933:14)
    at Object.cljs.core.bounded_count (http://wc.local/admin/js/admin-main-debug.js:9523:28)
    at Function.cljs.core.apply.cljs$core$IFn$_invoke$arity$2 (http://wc.local/admin/js/admin-main-debug.js:9895:23)
    at cljs.core.apply (http://wc.local/admin/js/admin-main-debug.js:9881:30)
    at eval (eval at <anonymous> (http://wc.local/admin/js/admin-main-debug.js:28426:264), <anonymous>:1:106)

for firefox:

(apply str (for [node (test-template)] (.-innerHTML node)))         
#object[Error Error: [object DocumentFragment] is not ISeqable]
No stacktrace available.

It seems give no more other info. Besides, I used :optimizations :simple for :compiler, I am not sure whether this has influence , thanks.

defclass commented 9 years ago

addition: I noticed your function that definded in enfocus.core-test

(defn by-id [id]
  (.getElementById js/document id))

(by-id "wrapper") return #object[HTMLDivElement [object HTMLDivElement]] , and call (.-innerHTML (by-id "wrapper")) will return :

"\n      <!-- Navigation -->\n      <nav class=\"navbar navbar-default navbar-static-top\" role=\"navigation\" style=\"margin-bottom: 0\">\n        <div class=\"navbar-header\">\n          <button class=\"navbar-toggle\" data-target=\".navbar-collapse\" data-toggle=\"collapse\" type=\"button\">\n            <span class=\"sr-only\">Toggle navigation</span>\n            <span class=\"icon-bar\"></span>\n            <span class=\"icon-bar\"></span>\n            <span class=\"icon-bar\"></span>\n          </button>\n 
 ....

this string is excatly i want. Maybe #object[HTMLDivElement [object HTMLDivElement]] and #object[DocumentFragment [object DocumentFragment]] is the point ?