jaroslav@530
|
1 |
/**
|
jaroslav@530
|
2 |
* Back 2 Browser Bytecode Translator
|
jaroslav@530
|
3 |
* Copyright (C) 2012 Jaroslav Tulach <jaroslav.tulach@apidesign.org>
|
jaroslav@530
|
4 |
*
|
jaroslav@530
|
5 |
* This program is free software: you can redistribute it and/or modify
|
jaroslav@530
|
6 |
* it under the terms of the GNU General Public License as published by
|
jaroslav@530
|
7 |
* the Free Software Foundation, version 2 of the License.
|
jaroslav@530
|
8 |
*
|
jaroslav@530
|
9 |
* This program is distributed in the hope that it will be useful,
|
jaroslav@530
|
10 |
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
jaroslav@530
|
11 |
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
jaroslav@530
|
12 |
* GNU General Public License for more details.
|
jaroslav@530
|
13 |
*
|
jaroslav@530
|
14 |
* You should have received a copy of the GNU General Public License
|
jaroslav@530
|
15 |
* along with this program. Look for COPYING file in the top folder.
|
jaroslav@530
|
16 |
* If not, see http://opensource.org/licenses/GPL-2.0.
|
jaroslav@530
|
17 |
*/
|
jaroslav@530
|
18 |
package org.apidesign.bck2brwsr.htmlpage;
|
jaroslav@530
|
19 |
|
jaroslav@767
|
20 |
import java.util.List;
|
jaroslav@1011
|
21 |
import javafx.scene.web.WebEngine;
|
jaroslav@1011
|
22 |
import netscape.javascript.JSObject;
|
jaroslav@763
|
23 |
import org.apidesign.bck2brwsr.core.JavaScriptBody;
|
jaroslav@530
|
24 |
import org.apidesign.bck2brwsr.htmlpage.api.ComputedProperty;
|
jaroslav@530
|
25 |
import org.apidesign.bck2brwsr.htmlpage.api.OnEvent;
|
jaroslav@879
|
26 |
import org.apidesign.bck2brwsr.htmlpage.api.OnFunction;
|
jaroslav@530
|
27 |
import org.apidesign.bck2brwsr.htmlpage.api.Page;
|
jaroslav@530
|
28 |
import org.apidesign.bck2brwsr.htmlpage.api.Property;
|
jaroslav@530
|
29 |
import org.apidesign.bck2brwsr.vmtest.BrwsrTest;
|
jaroslav@530
|
30 |
import org.apidesign.bck2brwsr.vmtest.HtmlFragment;
|
jaroslav@530
|
31 |
import org.apidesign.bck2brwsr.vmtest.VMTest;
|
jaroslav@930
|
32 |
import static org.testng.Assert.assertEquals;
|
jaroslav@530
|
33 |
import org.testng.annotations.Factory;
|
jaroslav@930
|
34 |
import org.testng.annotations.Test;
|
jaroslav@530
|
35 |
|
jaroslav@530
|
36 |
/**
|
jaroslav@530
|
37 |
*
|
jaroslav@530
|
38 |
* @author Jaroslav Tulach <jtulach@netbeans.org>
|
jaroslav@530
|
39 |
*/
|
jaroslav@530
|
40 |
@Page(xhtml="Knockout.xhtml", className="KnockoutModel", properties={
|
jaroslav@763
|
41 |
@Property(name="name", type=String.class),
|
jaroslav@879
|
42 |
@Property(name="results", type=String.class, array = true),
|
jaroslav@906
|
43 |
@Property(name="callbackCount", type=int.class),
|
jaroslav@1011
|
44 |
@Property(name="people", type=Person.class, array = true)
|
jaroslav@530
|
45 |
})
|
jaroslav@530
|
46 |
public class KnockoutTest {
|
jaroslav@530
|
47 |
|
jaroslav@530
|
48 |
@HtmlFragment(
|
jaroslav@530
|
49 |
"<h1 data-bind=\"text: helloMessage\">Loading Bck2Brwsr's Hello World...</h1>\n" +
|
jaroslav@530
|
50 |
"Your name: <input id='input' data-bind=\"value: name\"></input>\n" +
|
jaroslav@530
|
51 |
"<button id=\"hello\">Say Hello!</button>\n"
|
jaroslav@530
|
52 |
)
|
jaroslav@530
|
53 |
@BrwsrTest public void modifyValueAssertChangeInModel() {
|
jaroslav@530
|
54 |
KnockoutModel m = new KnockoutModel();
|
jaroslav@530
|
55 |
m.setName("Kukuc");
|
jaroslav@530
|
56 |
m.applyBindings();
|
jaroslav@892
|
57 |
assert "Kukuc".equals(m.input.getValue()) : "Value is really kukuc: " + m.input.getValue();
|
jaroslav@892
|
58 |
m.input.setValue("Jardo");
|
jaroslav@892
|
59 |
m.triggerEvent(m.input, OnEvent.CHANGE);
|
jaroslav@530
|
60 |
assert "Jardo".equals(m.getName()) : "Name property updated: " + m.getName();
|
jaroslav@530
|
61 |
}
|
jaroslav@530
|
62 |
|
jaroslav@763
|
63 |
@HtmlFragment(
|
jaroslav@763
|
64 |
"<ul id='ul' data-bind='foreach: results'>\n"
|
jaroslav@879
|
65 |
+ " <li data-bind='text: $data, click: $root.call'/>\n"
|
jaroslav@763
|
66 |
+ "</ul>\n"
|
jaroslav@763
|
67 |
)
|
jaroslav@763
|
68 |
@BrwsrTest public void displayContentOfArray() {
|
jaroslav@763
|
69 |
KnockoutModel m = new KnockoutModel();
|
jaroslav@763
|
70 |
m.getResults().add("Ahoj");
|
jaroslav@763
|
71 |
m.applyBindings();
|
jaroslav@763
|
72 |
|
jaroslav@763
|
73 |
int cnt = countChildren("ul");
|
jaroslav@763
|
74 |
assert cnt == 1 : "One child, but was " + cnt;
|
jaroslav@763
|
75 |
|
jaroslav@879
|
76 |
m.getResults().add("Hi");
|
jaroslav@763
|
77 |
|
jaroslav@763
|
78 |
cnt = countChildren("ul");
|
jaroslav@763
|
79 |
assert cnt == 2 : "Two children now, but was " + cnt;
|
jaroslav@879
|
80 |
|
jaroslav@879
|
81 |
triggerChildClick("ul", 1);
|
jaroslav@879
|
82 |
|
jaroslav@879
|
83 |
assert 1 == m.getCallbackCount() : "One callback " + m.getCallbackCount();
|
jaroslav@879
|
84 |
assert "Hi".equals(m.getName()) : "We got callback from 2nd child " + m.getName();
|
jaroslav@763
|
85 |
}
|
jaroslav@763
|
86 |
|
jaroslav@767
|
87 |
@HtmlFragment(
|
jaroslav@767
|
88 |
"<ul id='ul' data-bind='foreach: cmpResults'>\n"
|
jaroslav@767
|
89 |
+ " <li><b data-bind='text: $data'></b></li>\n"
|
jaroslav@767
|
90 |
+ "</ul>\n"
|
jaroslav@767
|
91 |
)
|
jaroslav@767
|
92 |
@BrwsrTest public void displayContentOfDerivedArray() {
|
jaroslav@767
|
93 |
KnockoutModel m = new KnockoutModel();
|
jaroslav@767
|
94 |
m.getResults().add("Ahoj");
|
jaroslav@767
|
95 |
m.applyBindings();
|
jaroslav@767
|
96 |
|
jaroslav@767
|
97 |
int cnt = countChildren("ul");
|
jaroslav@767
|
98 |
assert cnt == 1 : "One child, but was " + cnt;
|
jaroslav@767
|
99 |
|
jaroslav@767
|
100 |
m.getResults().add("hello");
|
jaroslav@767
|
101 |
|
jaroslav@767
|
102 |
cnt = countChildren("ul");
|
jaroslav@767
|
103 |
assert cnt == 2 : "Two children now, but was " + cnt;
|
jaroslav@767
|
104 |
}
|
jaroslav@767
|
105 |
|
jaroslav@906
|
106 |
@HtmlFragment(
|
jaroslav@906
|
107 |
"<ul id='ul' data-bind='foreach: people'>\n"
|
jaroslav@909
|
108 |
+ " <li data-bind='text: $data.firstName, click: $root.removePerson'></li>\n"
|
jaroslav@906
|
109 |
+ "</ul>\n"
|
jaroslav@906
|
110 |
)
|
jaroslav@906
|
111 |
@BrwsrTest public void displayContentOfArrayOfPeople() {
|
jaroslav@906
|
112 |
KnockoutModel m = new KnockoutModel();
|
jaroslav@908
|
113 |
|
jaroslav@908
|
114 |
final Person first = new Person();
|
jaroslav@908
|
115 |
first.setFirstName("first");
|
jaroslav@908
|
116 |
m.getPeople().add(first);
|
jaroslav@908
|
117 |
|
jaroslav@906
|
118 |
m.applyBindings();
|
jaroslav@906
|
119 |
|
jaroslav@906
|
120 |
int cnt = countChildren("ul");
|
jaroslav@906
|
121 |
assert cnt == 1 : "One child, but was " + cnt;
|
jaroslav@906
|
122 |
|
jaroslav@908
|
123 |
final Person second = new Person();
|
jaroslav@908
|
124 |
second.setFirstName("second");
|
jaroslav@908
|
125 |
m.getPeople().add(second);
|
jaroslav@906
|
126 |
|
jaroslav@906
|
127 |
cnt = countChildren("ul");
|
jaroslav@906
|
128 |
assert cnt == 2 : "Two children now, but was " + cnt;
|
jaroslav@906
|
129 |
|
jaroslav@906
|
130 |
triggerChildClick("ul", 1);
|
jaroslav@906
|
131 |
|
jaroslav@906
|
132 |
assert 1 == m.getCallbackCount() : "One callback " + m.getCallbackCount();
|
jaroslav@906
|
133 |
|
jaroslav@906
|
134 |
cnt = countChildren("ul");
|
jaroslav@906
|
135 |
assert cnt == 1 : "Again one child, but was " + cnt;
|
jaroslav@908
|
136 |
|
jaroslav@908
|
137 |
String txt = childText("ul", 0);
|
jaroslav@908
|
138 |
assert "first".equals(txt) : "Expecting 'first': " + txt;
|
jaroslav@909
|
139 |
|
jaroslav@909
|
140 |
first.setFirstName("changed");
|
jaroslav@909
|
141 |
|
jaroslav@909
|
142 |
txt = childText("ul", 0);
|
jaroslav@909
|
143 |
assert "changed".equals(txt) : "Expecting 'changed': " + txt;
|
jaroslav@906
|
144 |
}
|
jaroslav@914
|
145 |
|
jaroslav@929
|
146 |
@ComputedProperty
|
jaroslav@929
|
147 |
static Person firstPerson(List<Person> people) {
|
jaroslav@929
|
148 |
return people.isEmpty() ? null : people.get(0);
|
jaroslav@929
|
149 |
}
|
jaroslav@929
|
150 |
|
jaroslav@929
|
151 |
@HtmlFragment(
|
jaroslav@929
|
152 |
"<p id='ul' data-bind='with: firstPerson'>\n"
|
jaroslav@929
|
153 |
+ " <span data-bind='text: firstName, click: changeSex'></span>\n"
|
jaroslav@929
|
154 |
+ "</p>\n"
|
jaroslav@929
|
155 |
)
|
jaroslav@929
|
156 |
@BrwsrTest public void accessFirstPersonWithOnFunction() {
|
jaroslav@929
|
157 |
trasfertToFemale();
|
jaroslav@929
|
158 |
}
|
jaroslav@929
|
159 |
|
jaroslav@914
|
160 |
@HtmlFragment(
|
jaroslav@914
|
161 |
"<ul id='ul' data-bind='foreach: people'>\n"
|
jaroslav@914
|
162 |
+ " <li data-bind='text: $data.firstName, click: changeSex'></li>\n"
|
jaroslav@914
|
163 |
+ "</ul>\n"
|
jaroslav@914
|
164 |
)
|
jaroslav@914
|
165 |
@BrwsrTest public void onPersonFunction() {
|
jaroslav@929
|
166 |
trasfertToFemale();
|
jaroslav@929
|
167 |
}
|
jaroslav@929
|
168 |
|
jaroslav@929
|
169 |
private void trasfertToFemale() {
|
jaroslav@914
|
170 |
KnockoutModel m = new KnockoutModel();
|
jaroslav@929
|
171 |
|
jaroslav@914
|
172 |
final Person first = new Person();
|
jaroslav@914
|
173 |
first.setFirstName("first");
|
jaroslav@914
|
174 |
first.setSex(Sex.MALE);
|
jaroslav@914
|
175 |
m.getPeople().add(first);
|
jaroslav@929
|
176 |
|
jaroslav@929
|
177 |
|
jaroslav@914
|
178 |
m.applyBindings();
|
jaroslav@929
|
179 |
|
jaroslav@914
|
180 |
int cnt = countChildren("ul");
|
jaroslav@914
|
181 |
assert cnt == 1 : "One child, but was " + cnt;
|
jaroslav@929
|
182 |
|
jaroslav@929
|
183 |
|
jaroslav@914
|
184 |
triggerChildClick("ul", 0);
|
jaroslav@929
|
185 |
|
jaroslav@914
|
186 |
assert first.getSex() == Sex.FEMALE : "Transverted to female: " + first.getSex();
|
jaroslav@914
|
187 |
}
|
jaroslav@930
|
188 |
|
jaroslav@930
|
189 |
@Test public void cloneModel() {
|
jaroslav@930
|
190 |
Person model = new Person();
|
jaroslav@930
|
191 |
|
jaroslav@930
|
192 |
model.setFirstName("first");
|
jaroslav@930
|
193 |
Person snd = model.clone();
|
jaroslav@930
|
194 |
snd.setFirstName("clone");
|
jaroslav@930
|
195 |
assertEquals("first", model.getFirstName(), "Value has not changed");
|
jaroslav@930
|
196 |
assertEquals("clone", snd.getFirstName(), "Value has changed in clone");
|
jaroslav@930
|
197 |
}
|
jaroslav@930
|
198 |
|
jaroslav@930
|
199 |
|
jaroslav@930
|
200 |
@Test public void deepCopyOnClone() {
|
jaroslav@930
|
201 |
People model = new People();
|
jaroslav@930
|
202 |
model.getNicknames().add("Jarda");
|
jaroslav@930
|
203 |
assertEquals(model.getNicknames().size(), 1, "One element");
|
jaroslav@930
|
204 |
People snd = model.clone();
|
jaroslav@930
|
205 |
snd.getNicknames().clear();
|
jaroslav@930
|
206 |
assertEquals(snd.getNicknames().size(), 0, "Clone is empty");
|
jaroslav@930
|
207 |
assertEquals(model.getNicknames().size(), 1, "Still one element");
|
jaroslav@930
|
208 |
}
|
jaroslav@930
|
209 |
|
jaroslav@906
|
210 |
|
jaroslav@879
|
211 |
@OnFunction
|
jaroslav@879
|
212 |
static void call(KnockoutModel m, String data) {
|
jaroslav@879
|
213 |
m.setName(data);
|
jaroslav@879
|
214 |
m.setCallbackCount(m.getCallbackCount() + 1);
|
jaroslav@879
|
215 |
}
|
jaroslav@906
|
216 |
|
jaroslav@906
|
217 |
@OnFunction
|
jaroslav@906
|
218 |
static void removePerson(KnockoutModel model, Person data) {
|
jaroslav@906
|
219 |
model.setCallbackCount(model.getCallbackCount() + 1);
|
jaroslav@906
|
220 |
model.getPeople().remove(data);
|
jaroslav@906
|
221 |
}
|
jaroslav@906
|
222 |
|
jaroslav@879
|
223 |
|
jaroslav@530
|
224 |
@ComputedProperty
|
jaroslav@530
|
225 |
static String helloMessage(String name) {
|
jaroslav@530
|
226 |
return "Hello " + name + "!";
|
jaroslav@530
|
227 |
}
|
jaroslav@530
|
228 |
|
jaroslav@767
|
229 |
@ComputedProperty
|
jaroslav@767
|
230 |
static List<String> cmpResults(List<String> results) {
|
jaroslav@767
|
231 |
return results;
|
jaroslav@767
|
232 |
}
|
jaroslav@767
|
233 |
|
jaroslav@530
|
234 |
@Factory
|
jaroslav@530
|
235 |
public static Object[] create() {
|
jaroslav@530
|
236 |
return VMTest.create(KnockoutTest.class);
|
jaroslav@530
|
237 |
}
|
jaroslav@763
|
238 |
|
jaroslav@1011
|
239 |
private static final String COUNT_CHILDREN =
|
jaroslav@763
|
240 |
"var e = window.document.getElementById(id);\n "
|
jaroslav@763
|
241 |
+ "if (typeof e === 'undefined') return -2;\n "
|
jaroslav@1011
|
242 |
+ "return e.children.length;\n";
|
jaroslav@1011
|
243 |
@JavaScriptBody(args = { "id" }, body = COUNT_CHILDREN)
|
jaroslav@1011
|
244 |
private static int countChildren(String id) {
|
jaroslav@1011
|
245 |
return ((Number)js().call("countChildren", id)).intValue();
|
jaroslav@1011
|
246 |
}
|
jaroslav@879
|
247 |
|
jaroslav@1011
|
248 |
private static final String TRIGGER_CHILD_CLICK =
|
jaroslav@879
|
249 |
"var e = window.document.getElementById(id);\n "
|
jaroslav@879
|
250 |
+ "var ev = window.document.createEvent('MouseEvents');\n "
|
jaroslav@879
|
251 |
+ "ev.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);\n "
|
jaroslav@1011
|
252 |
+ "e.children[pos].dispatchEvent(ev);\n ";
|
jaroslav@1011
|
253 |
@JavaScriptBody(args = { "id", "pos" }, body = TRIGGER_CHILD_CLICK)
|
jaroslav@1011
|
254 |
private static void triggerChildClick(String id, int pos) {
|
jaroslav@1011
|
255 |
js().call("triggerChildClick", id, pos);
|
jaroslav@1011
|
256 |
}
|
jaroslav@908
|
257 |
|
jaroslav@1011
|
258 |
private static final String CHILD_TEXT =
|
jaroslav@908
|
259 |
"var e = window.document.getElementById(id);\n "
|
jaroslav@908
|
260 |
+ "var t = e.children[pos].innerHTML;\n "
|
jaroslav@1011
|
261 |
+ "return t ? t : null;";
|
jaroslav@1011
|
262 |
@JavaScriptBody(args = { "id", "pos" }, body = CHILD_TEXT)
|
jaroslav@1011
|
263 |
private static String childText(String id, int pos) {
|
jaroslav@1011
|
264 |
return (String) js().call("childText", id, pos);
|
jaroslav@1011
|
265 |
}
|
jaroslav@1011
|
266 |
|
jaroslav@1011
|
267 |
|
jaroslav@1011
|
268 |
private static JSObject js;
|
jaroslav@1011
|
269 |
private static JSObject js() {
|
jaroslav@1011
|
270 |
if (js == null) {
|
jaroslav@1011
|
271 |
WebEngine eng = (WebEngine)System.getProperties().get("webEngine");
|
jaroslav@1011
|
272 |
if (eng == null) {
|
jaroslav@1011
|
273 |
js = null;
|
jaroslav@1011
|
274 |
} else {
|
jaroslav@1011
|
275 |
js = (JSObject) eng.executeScript("(function () {" +
|
jaroslav@1011
|
276 |
"var obj = {};"
|
jaroslav@1011
|
277 |
+ ""
|
jaroslav@1011
|
278 |
+ "obj.countChildren = function(id) { " + COUNT_CHILDREN + "};"
|
jaroslav@1011
|
279 |
+ "obj.triggerChildClick = function(id, pos) { " + TRIGGER_CHILD_CLICK + "};"
|
jaroslav@1011
|
280 |
+ "obj.childText = function(id, pos) { " + CHILD_TEXT + "};"
|
jaroslav@1011
|
281 |
+ "return obj;"
|
jaroslav@1011
|
282 |
+ "})();");
|
jaroslav@1011
|
283 |
}
|
jaroslav@1011
|
284 |
}
|
jaroslav@1011
|
285 |
|
jaroslav@1011
|
286 |
return js;
|
jaroslav@1011
|
287 |
}
|
jaroslav@530
|
288 |
}
|