mirror of
https://github.com/meteor/meteor.git
synced 2026-05-02 03:01:46 -04:00
table fixes and tests
This commit is contained in:
@@ -31,95 +31,13 @@ var legacyLabels = {
|
||||
|
||||
|
||||
Tinytest.add("liveui - tables", function(test) {
|
||||
var R = ReactiveVar(0);
|
||||
|
||||
var table = OnscreenDiv(Meteor.ui.render(function() {
|
||||
var buf = [];
|
||||
buf.push("<table>");
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<tr><td>"+(i+1)+"</td></tr>");
|
||||
buf.push("</table>");
|
||||
return buf.join('');
|
||||
}));
|
||||
|
||||
R.set(1);
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
|
||||
R.set(10);
|
||||
test.equal(table.html(), "<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table><tbody>"+
|
||||
"<tr><td>1</td></tr>"+
|
||||
"<tr><td>2</td></tr>"+
|
||||
"<tr><td>3</td></tr>"+
|
||||
"<tr><td>4</td></tr>"+
|
||||
"<tr><td>5</td></tr>"+
|
||||
"<tr><td>6</td></tr>"+
|
||||
"<tr><td>7</td></tr>"+
|
||||
"<tr><td>8</td></tr>"+
|
||||
"<tr><td>9</td></tr>"+
|
||||
"<tr><td>10</td></tr>"+
|
||||
"</tbody></table>");
|
||||
|
||||
R.set(0);
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table></table>");
|
||||
table.kill();
|
||||
Meteor.flush();
|
||||
test.equal(R.numListeners(), 0);
|
||||
|
||||
var div = OnscreenDiv();
|
||||
div.node().appendChild(document.createElement("TABLE"));
|
||||
div.node().firstChild.appendChild(Meteor.ui.render(function() {
|
||||
var buf = [];
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<tr><td>"+(i+1)+"</td></tr>");
|
||||
return buf.join('');
|
||||
}));
|
||||
test.equal(div.html(), "<table><!----></table>");
|
||||
R.set(3);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(), "<table><tbody>"+
|
||||
"<tr><td>1</td></tr>"+
|
||||
"<tr><td>2</td></tr>"+
|
||||
"<tr><td>3</td></tr>"+
|
||||
"</tbody></table>");
|
||||
test.equal(div.node().firstChild.rows.length, 3);
|
||||
R.set(0);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(), "<table><!----></table>");
|
||||
div.kill();
|
||||
Meteor.flush();
|
||||
|
||||
test.equal(R.numListeners(), 0);
|
||||
|
||||
div = OnscreenDiv();
|
||||
div.node().appendChild(DomUtils.htmlToFragment("<table><tr></tr></table>"));
|
||||
R.set(3);
|
||||
div.node().getElementsByTagName("tr")[0].appendChild(Meteor.ui.render(
|
||||
function() {
|
||||
var buf = [];
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<td>"+(i+1)+"</td>");
|
||||
return buf.join('');
|
||||
}));
|
||||
test.equal(div.html(),
|
||||
"<table><tbody><tr><td>1</td><td>2</td><td>3</td>"+
|
||||
"</tr></tbody></table>");
|
||||
R.set(1);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(),
|
||||
"<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
div.kill();
|
||||
Meteor.flush();
|
||||
test.equal(R.numListeners(), 0);
|
||||
var R = ReactiveVar("");
|
||||
|
||||
// Test tables with patching
|
||||
R.set("");
|
||||
div = OnscreenDiv(Meteor.ui.render(function() {
|
||||
var div = OnscreenDiv(Meteor.ui.render(function() {
|
||||
return '<table id="my-awesome-table">'+R.get()+'</table>';
|
||||
}));
|
||||
}, {preserve: legacyLabels}));
|
||||
Meteor.flush();
|
||||
R.set("<tr><td>Hello</td></tr>");
|
||||
Meteor.flush();
|
||||
|
||||
@@ -308,6 +308,20 @@ Spark.isolate = function (htmlFunc) {
|
||||
var frag = Spark.render(function () {
|
||||
return Spark.isolate(htmlFunc);
|
||||
});
|
||||
|
||||
var tempRange = new LiveRange(Spark._ANNOTATION_ISOLATE, frag, null,
|
||||
true /* inner */);
|
||||
tempRange.operate(function (start, end) {
|
||||
// Wrap contents of frag, *inside* the ISOLATE annotation,
|
||||
// as appropriate for insertion into `range`. We want the
|
||||
// wrapping inside the range so that if you have a <table>
|
||||
// containing an isolate, and the isolate returns a <tr>
|
||||
// sometimes and a <thead> other times, the wrapping will
|
||||
// change as appropriate.
|
||||
DomUtils.wrapFragmentForContainer(frag, range.containerNode());
|
||||
});
|
||||
tempRange.destroy();
|
||||
|
||||
var oldContents = range.replace_contents(frag); // XXX should patch
|
||||
Spark.finalize(oldContents);
|
||||
notifyWatchers(range);
|
||||
|
||||
@@ -478,3 +478,89 @@ Tinytest.add("spark - data context", function (test) {
|
||||
"</div>");
|
||||
});
|
||||
});
|
||||
|
||||
Tinytest.add("spark - tables", function (test) {
|
||||
var R = ReactiveVar(0);
|
||||
|
||||
var table = OnscreenDiv(Meteor.render(function() {
|
||||
var buf = [];
|
||||
buf.push("<table>");
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<tr><td>"+(i+1)+"</td></tr>");
|
||||
buf.push("</table>");
|
||||
return buf.join('');
|
||||
}));
|
||||
|
||||
R.set(1);
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
|
||||
R.set(10);
|
||||
test.equal(table.html(), "<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table><tbody>"+
|
||||
"<tr><td>1</td></tr>"+
|
||||
"<tr><td>2</td></tr>"+
|
||||
"<tr><td>3</td></tr>"+
|
||||
"<tr><td>4</td></tr>"+
|
||||
"<tr><td>5</td></tr>"+
|
||||
"<tr><td>6</td></tr>"+
|
||||
"<tr><td>7</td></tr>"+
|
||||
"<tr><td>8</td></tr>"+
|
||||
"<tr><td>9</td></tr>"+
|
||||
"<tr><td>10</td></tr>"+
|
||||
"</tbody></table>");
|
||||
|
||||
R.set(0);
|
||||
Meteor.flush();
|
||||
test.equal(table.html(), "<table></table>");
|
||||
table.kill();
|
||||
Meteor.flush();
|
||||
test.equal(R.numListeners(), 0);
|
||||
|
||||
var div = OnscreenDiv();
|
||||
div.node().appendChild(document.createElement("TABLE"));
|
||||
div.node().firstChild.appendChild(Meteor.render(function() {
|
||||
var buf = [];
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<tr><td>"+(i+1)+"</td></tr>");
|
||||
return buf.join('');
|
||||
}));
|
||||
test.equal(div.html(), "<table><!----></table>");
|
||||
R.set(3);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(), "<table><tbody>"+
|
||||
"<tr><td>1</td></tr>"+
|
||||
"<tr><td>2</td></tr>"+
|
||||
"<tr><td>3</td></tr>"+
|
||||
"</tbody></table>");
|
||||
test.equal(div.node().firstChild.rows.length, 3);
|
||||
R.set(0);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(), "<table><!----></table>");
|
||||
div.kill();
|
||||
Meteor.flush();
|
||||
|
||||
test.equal(R.numListeners(), 0);
|
||||
|
||||
div = OnscreenDiv();
|
||||
div.node().appendChild(DomUtils.htmlToFragment("<table><tr></tr></table>"));
|
||||
R.set(3);
|
||||
div.node().getElementsByTagName("tr")[0].appendChild(Meteor.render(
|
||||
function() {
|
||||
var buf = [];
|
||||
for(var i=0; i<R.get(); i++)
|
||||
buf.push("<td>"+(i+1)+"</td>");
|
||||
return buf.join('');
|
||||
}));
|
||||
test.equal(div.html(),
|
||||
"<table><tbody><tr><td>1</td><td>2</td><td>3</td>"+
|
||||
"</tr></tbody></table>");
|
||||
R.set(1);
|
||||
Meteor.flush();
|
||||
test.equal(div.html(),
|
||||
"<table><tbody><tr><td>1</td></tr></tbody></table>");
|
||||
div.kill();
|
||||
Meteor.flush();
|
||||
test.equal(R.numListeners(), 0);
|
||||
});
|
||||
Reference in New Issue
Block a user