From 3932ebe8ead1a3ba57b2ca4ba9bf4dd257570576 Mon Sep 17 00:00:00 2001
From: Rafael Weinstein <rafaelw@chromium.org>
Date: Wed, 23 Oct 2013 14:11:27 -0700
Subject: [PATCH] Implement underbar bindings

BUG=

Review URL: https://codereview.appspot.com/16240043
---
 src/TemplateBinding.js |  9 +++++++++
 tests/tests.js         | 34 ++++++++++++++++++++++++++++++++++
 2 files changed, 43 insertions(+)

diff --git a/src/TemplateBinding.js b/src/TemplateBinding.js
index 5d85427..b7f2295 100644
--- a/src/TemplateBinding.js
+++ b/src/TemplateBinding.js
@@ -703,6 +703,15 @@
       var name = attr.name;
       var value = attr.value;
 
+      // Allow bindings expressed in attributes to be prefixed with underbars.
+      // We do this to allow correct semantics for browsers that don't implement
+      // <template> where certain attributes might trigger side-effects -- and
+      // for IE which sanitizes certain attributes, disallowing mustache
+      // replacements in their text.
+      while (name.length && name[0] === '_') {
+        name = name.substring(1);
+      }
+
       if (isTemplateNode) {
         if (name === IF) {
           ifFound = true;
diff --git a/tests/tests.js b/tests/tests.js
index 692dae8..744cb0e 100644
--- a/tests/tests.js
+++ b/tests/tests.js
@@ -2158,3 +2158,37 @@ suite('Binding Delegate API', function() {
     assert.equal('barValue', div.lastChild.getAttribute('bar'));
   });
 });
+
+suite('Compat', function() {
+  test('underbar bindings', function() {
+        var div = createTestHtml(
+        '<template bind>' +
+          '<div _style="color: {{ color }};"></div>' +
+          '<img _src="{{ url }}">' +
+          '<a _href="{{ url2 }}">Link</a>' +
+          '<input type="number" _value="{{ number }}">' +
+        '</template>');
+
+    var model = {
+      color: 'red',
+      url: 'pic.jpg',
+      url2: 'link.html',
+      number: 4
+    };
+
+    recursivelySetTemplateModel(div, model);
+    Platform.performMicrotaskCheckpoint();
+
+    var subDiv = div.firstChild.nextSibling;
+    assert.equal('color: red;', subDiv.getAttribute('style'));
+
+    var img = subDiv.nextSibling;
+    assert.equal('pic.jpg', img.getAttribute('src'));
+
+    var a = img.nextSibling;
+    assert.equal('link.html', a.getAttribute('href'));
+
+    var input = a.nextSibling;
+    assert.equal(4, input.value);
+  });
+});