Switch from decorating templates with HTML comments

[brentd]

I've noticed the HTML comments that Xray injects cause a couple issues.

• 22 - though I can't seem to reproduce it, I've heard from a couple folks that they mess with jQuery when in an XHR response body.

• When handing Bootstrap's modal JS a template with Xray's HTML comments, it causes weird bugs like multiple backdrops.

The Bootstrap issue doesn't really have anything to do with the HTML comments per se; more that the JS doesn't expect to be given a jQuery object with anything other than a single root node. However I'm feeling that injecting extra DOM nodes in general could be prone to problems like this.

One idea would be to add data-xray attributes to DOM nodes instead. For example:

In a partial with one root node:

<div class="my-modal" data-xray="/path/to/file">
   ...
</div>

In a partial with multiple root nodes:

<div class="my-modal" data-xray="/path/to/file" data-xray-id="12">
   ...
</div>
<span>Cool span bro!</span>
<div class="other-div" data-xray-id="12">
   ...
</div>

In this example, data-xray-id is used to link the two outer sibling roots of the template together.

The main drawback of this proposal is that wrapping a template with HTML comments is simple; manipulating HTML attributes is not (imagine if the template starts with a weird node like a comment, or a doctype, or a script tag, etc). Really don't want to drag an XML parser into xray's dependencies.

[brentd]

Add causing issues with Angular templates which expect exactly one root node to the list of reasons to do this.

[yoelblum]

@brentd Hi I'd like to try adding Angular templates support . In what way did you picture it being implemented for this project? Just to be sure - why don't Angular templates work , are they not being processed in the middleware or is it a problem in the client side?