Ability to use 'at' on snippets

[tonsky]

(defsnippet sn "..." [])

(let [node (sn)]
  (em/at node (em/set-attr :id "123")) // fails
  (em/at node [".class"] (em/set-attr :id "123"))) // fails too

I don't know if it's intentional or could be fixed maybe?

The problem is — I want to use compiled snippets, but I cannot put much logic inside defsnippet (let definitions etc). So I'm trying to modify snippet after I materialized it, using regular at form inside a fun.

Looks like it's because it tries to call root.getElementsByTagName(query.getTag()) at DocumentFragment.

Maybe there's another way to do this, a workaround?

[enfocus "1.0.0-beta2"]
[org.clojure/google-closure-library "0.0-2029"]
[org.clojure/google-closure-library-third-party "0.0-2029"]
[domina "1.0.1" :exclusions [org.clojure/clojurescript]]
[lein-cljsbuild "0.2.7"]

Thanks.

[ckirkendall]

Not sure I can fix this. Defsnippet and Deftemplate return DocumentFragments(DF) objects. you can perform some actions on but not all. The DF object has to be added to the live dom to do all actions on it. I do this during creation of the fragment in the defsnippet but I have to detach it when I return it to you.

What type of logic are you having trouble integrating into a defsnippet. Can you give me more examples this logic. Below is an example of bundling the logic you show in your code example.

(em/deftemplate sn "..." [id]
    ["_TMP_ID"] (em/set-attr :id id))

or

(em/deftemplate sn "..." [id class]
    [class] (em/set-attr :id id))

[tonsky]

I'm trying to use some rich control structures, like this (pseudocode):

(em/deftemplate sn "..." [id]
  (let [style (f ...)
        smth (g ...)]
    (if (and x y)
      (transform ["_TMP_ID"] (em/set-attr :id id))
      identity)))

[ckirkendall]

@tonsky,
Transformations like this are best encapsulated in a custom transform. This allows you to have much more freedom in how you structure things and also allows you to use "at" inside a template. Below is some sample code.

(defn my-cust-trans [id]
   (em/trans [node] 
      (let [style (f ...)
            smth (g ...)]
          (if (and x y)
             (at node (em/set-attr :id id))
             (at node
                 [".class"] (em/...)
                 ["#id"] (em/....))
             node))))

(em/deftemplate sn "..." [id]
  ["#TOP_LEVEL_ID"]  (my-cust-trans id))

[tonsky]

@ckirkendall Thanks for advise, this will work great!

BTW, may be this may help: if you wrap documentFragment in div, it support most of usual document functions. Google Closure is doing something like this: http://closure-library.googlecode.com/svn/docs/closure_goog_dom_dom.js.source.html#line797

I've run quick test in webkit and it seems working for me:

var fragment = document.createDocumentFragment();
var div = document.createElement('div');
div.innerHTML = "abc <em>xyz</em> zer";
fragment.appendChild(div);
// fragment.getElementsByTagName('em'); // fails
fragment.childNodes[0].getElementsByTagName('em');

Maybe this is the way to go?

[ckirkendall]

@tonsky This is the method I use to allow you to manipulate the snippet during creation. I have to detach it to make sure what I hand back is the snippet and only the snippet. Another step you have to do to get all the methods is to attach it to the live dom. I do this also during creation.