forked from jasonmoo/t.js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy patht_test.html
130 lines (103 loc) · 3.79 KB
/
t_test.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>t.js</title>
<style>
body { background:black; color:white; padding:40px; font-family: 'PT Sans', Helvetica, Arial, sans-serif;}
a { color:#9bf; }
p > span { display:inline-block; margin:0 10px; font-weight:bold; }
</style>
</head>
<body>
<div id="qunit"></div>
</body>
<script src="http://code.jquery.com/qunit/qunit-1.9.0.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/qunit/qunit-1.9.0.css">
<script src="t.min.js"></script>
<script type="t/template" id="test">
<h1>{{=greeting}}</h1>
<h2>{{=user.display_name}}</h2>
{{user.address}}
<address>{{%user.address}}</address>
{{/user.address}}
<h4>Friends</h4>
{{@user.friends}}
<a href="{{%_val.url}}">{{=_val.name}}</a><br>
{{/@user.friends}}
{{=not_a_value}}
{{=not.a.value}}
{{!not_a_value}}
<p>Missing required information!</p>
{{/!not_a_value}}
{{user.display_name}}
<p>Bacon ipsum {{=user.display_name}}?</p>
{{:user.display_name}}
This should not be here.
{{/user.display_name}}
{{not_a_value}}
This should not be here.
{{:not_a_value}}
<p>Yes bacon ipsum {{=user.display_name}}!</p>
{{/not_a_value}}
{{@user.prefs}}
<p><span>{{=_key}}</span>{{=_val}}</p>
{{/@user.prefs}}
<h4>Test Values</h4>
{{@test_values}}
<p>{{=_key}}<span id="{{=_key}}" data-val="{{%_val}}">{{=_val}}</span></p>
{{/@test_values}}
{{#greeting|hello,world}}
</script>
<script>
console.log(document.getElementById('test').innerHTML);
test("t.js tests", function() {
var div = document.createElement('div');
var template = new t(document.getElementById('test').innerHTML);
template.register("hello",function(data){return data+" Hello";});
template.register("world",function(data){return data+" world!";});
div.innerHTML = template.render({
greeting: "Welcome!",
user: {
display_name: "Jason",
address: "111 State St, Ithaca,<script>alert(1);<\/script> NY 14853",
friends: [
{name: "Kunal", url: "http://whatspop.com"},
{name: "Francisco", url: "http://smalldemons.com"},
{name: "Nick", url: "http://milewise.com"}
],
prefs: {
Notifications: "Yes!",
"Stay logged in": "No"
}
},
test_values: {
"true": true,
"false": false,
"zero": 0,
"string_zero": "0",
"null": null
}
});
document.body.appendChild(div);
console.log(div.innerHTML);
ok(/<h1>Welcome!<\/h1>/.test(div.innerHTML), "Simple interpolation.");
ok(/<h2>Jason<\/h2>/.test(div.innerHTML), "Name-spaced interpolation.");
ok(/<address>/.test(div.innerHTML), "If block.");
ok(/<p>Missing /.test(div.innerHTML), "If-not block.");
ok(/<p>Bacon ipsum Jason\?<\/p>/.test(div.innerHTML), "If-else block (true).");
ok(/<p>Yes bacon ipsum Jason\!<\/p>/.test(div.innerHTML), "If-else block (false).");
ok(/<address>111 State St, Ithaca,<script>alert\(1\);<\/script> NY 14853<\/address>/.test(div.innerHTML), "Scrubbed interpolation.");
equal(div.innerHTML.match(/>(?:Kunal|Francisco|Nick)</g).length, 3, "Array iteration.")
equal(div.innerHTML.match(/>(?:Notifications|Yes!|Stay logged in|No)</g).length, 4, "Object key/val iteration.")
ok(/Welcome! Hello world!/.test(div.innerHTML), "Function test.");
// passing true as a value is a little not-sane but we'll print it for you
equal(document.getElementById("true").innerHTML, "true", "Prints boolean true");
equal(document.getElementById("zero").innerHTML, "0", "Prints zero");
equal(document.getElementById("string_zero").innerHTML, "0", "Prints the string 0");
equal(document.getElementById("false").innerHTML, "", "Does not print boolean false");
equal(document.getElementById("null").innerHTML, "", "Does not print null");
equal((new t("{{%quot}}")).render({quot: '"'}), """, "Escapes quotes properly")
});
</script>
</html>