Files
zulip/frontend_tests/node_tests/stream_list.js
Anders Kaseorg 6ec808b8df js: Add "use strict" directive to CommonJS files.
ES and TypeScript modules are strict by default and don’t need this
directive.  ESLint will remind us to add it to new CommonJS files and
remove it from ES and TypeScript modules.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-31 22:09:46 -07:00

759 lines
19 KiB
JavaScript

"use strict";
set_global("document", "document-stub");
set_global("$", global.make_zjquery());
zrequire("unread_ui");
zrequire("Filter", "js/filter");
zrequire("stream_sort");
zrequire("colorspace");
zrequire("stream_color");
zrequire("hash_util");
zrequire("unread");
zrequire("stream_data");
zrequire("scroll_util");
zrequire("list_cursor");
zrequire("stream_list");
zrequire("topic_zoom");
zrequire("ui");
set_global("page_params", {
is_admin: false,
realm_users: [],
});
stream_color.initialize();
const noop = function () {};
const return_false = function () {
return false;
};
const return_true = function () {
return true;
};
set_global("topic_list", {});
set_global("overlays", {});
set_global("popovers", {});
set_global("keydown_util", {
handle: noop,
});
run_test("create_sidebar_row", () => {
// Make a couple calls to create_sidebar_row() and make sure they
// generate the right markup as well as play nice with get_stream_li().
page_params.demote_inactive_streams = 1;
const devel = {
name: "devel",
stream_id: 100,
color: "blue",
subscribed: true,
pin_to_top: true,
};
global.stream_data.add_sub(devel);
const social = {
name: "social",
stream_id: 200,
color: "green",
subscribed: true,
};
global.stream_data.add_sub(social);
global.unread.num_unread_for_stream = function () {
return 42;
};
(function create_devel_sidebar_row() {
const devel_value = $.create("devel-value");
const devel_count = $.create("devel-count");
const sidebar_row = $("<devel sidebar row>");
sidebar_row.set_find_results(".count", devel_count);
devel_count.set_find_results(".value", devel_value);
devel_count.set_parent(sidebar_row);
global.stub_templates((template_name, data) => {
assert.equal(template_name, "stream_sidebar_row");
assert.equal(data.uri, "#narrow/stream/100-devel");
return "<devel sidebar row>";
});
stream_list.create_sidebar_row(devel);
assert.equal(devel_value.text(), "42");
})();
(function create_social_sidebar_row() {
const social_value = $.create("social-value");
const social_count = $.create("social-count");
const sidebar_row = $("<social sidebar row>");
sidebar_row.set_find_results(".count", social_count);
social_count.set_find_results(".value", social_value);
social_count.set_parent(sidebar_row);
global.stub_templates((template_name, data) => {
assert.equal(template_name, "stream_sidebar_row");
assert.equal(data.uri, "#narrow/stream/200-social");
return "<social sidebar row>";
});
stream_list.create_sidebar_row(social);
assert.equal(social_value.text(), "42");
})();
const split = '<hr class="stream-split">';
const devel_sidebar = $("<devel sidebar row>");
const social_sidebar = $("<social sidebar row>");
let appended_elems;
$("#stream_filters").append = function (elems) {
appended_elems = elems;
};
let topic_list_cleared;
topic_list.clear = () => {
topic_list_cleared = true;
};
stream_list.build_stream_list();
assert(topic_list_cleared);
const expected_elems = [
devel_sidebar, //pinned
split, //separator
social_sidebar, //not pinned
];
assert.deepEqual(appended_elems, expected_elems);
const social_li = $("<social sidebar row>");
const stream_id = social.stream_id;
social_li.length = 0;
const privacy_elem = $.create("privacy-stub");
social_li.set_find_results(".stream-privacy", privacy_elem);
social.invite_only = true;
social.color = "#222222";
global.stub_templates((template_name, data) => {
assert.equal(template_name, "stream_privacy");
assert.equal(data.invite_only, true);
assert.equal(data.dark_background, "dark_background");
return "<div>privacy-html";
});
stream_list.redraw_stream_privacy(social);
assert.equal(privacy_elem.html(), "<div>privacy-html");
stream_list.set_in_home_view(stream_id, false);
assert(social_li.hasClass("out_of_home_view"));
stream_list.set_in_home_view(stream_id, true);
assert(!social_li.hasClass("out_of_home_view"));
const row = stream_list.stream_sidebar.get_row(stream_id);
stream_data.is_active = return_true;
row.update_whether_active();
assert(!social_li.hasClass("inactive_stream"));
stream_data.is_active = return_false;
row.update_whether_active();
assert(social_li.hasClass("inactive_stream"));
let removed;
social_li.remove = function () {
removed = true;
};
row.remove();
assert(removed);
});
run_test("pinned_streams_never_inactive", () => {
// Ensure that pinned streams are never treated as dormant ie never given "inactive" class
stream_data.clear_subscriptions();
const devel = {
name: "devel",
stream_id: 100,
color: "blue",
subscribed: true,
pin_to_top: true,
};
global.stream_data.add_sub(devel);
const social = {
name: "social",
stream_id: 200,
color: "green",
subscribed: true,
};
global.stream_data.add_sub(social);
// we use social and devel created in create_social_sidebar_row() and create_devel_sidebar_row()
// non-pinned streams can be made inactive
const social_sidebar = $("<social sidebar row>");
let stream_id = social.stream_id;
let row = stream_list.stream_sidebar.get_row(stream_id);
stream_data.is_active = return_false;
stream_list.build_stream_list();
assert(social_sidebar.hasClass("inactive_stream"));
stream_data.is_active = return_true;
row.update_whether_active();
assert(!social_sidebar.hasClass("inactive_stream"));
stream_data.is_active = return_false;
row.update_whether_active();
assert(social_sidebar.hasClass("inactive_stream"));
// pinned streams can never be made inactive
const devel_sidebar = $("<devel sidebar row>");
stream_id = devel.stream_id;
row = stream_list.stream_sidebar.get_row(stream_id);
stream_data.is_active = return_false;
stream_list.build_stream_list();
assert(!devel_sidebar.hasClass("inactive_stream"));
row.update_whether_active();
assert(!devel_sidebar.hasClass("inactive_stream"));
});
set_global("$", global.make_zjquery());
function add_row(sub) {
global.stream_data.add_sub(sub);
const row = {
update_whether_active() {},
get_li() {
const html = "<" + sub.name + " sidebar row html>";
const obj = $(html);
obj.length = 1; // bypass blueslip error
return obj;
},
};
stream_list.stream_sidebar.set_row(sub.stream_id, row);
}
function initialize_stream_data() {
stream_data.clear_subscriptions();
// pinned streams
const develSub = {
name: "devel",
stream_id: 1000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(develSub);
const RomeSub = {
name: "Rome",
stream_id: 2000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(RomeSub);
const testSub = {
name: "test",
stream_id: 3000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(testSub);
// unpinned streams
const announceSub = {
name: "announce",
stream_id: 4000,
color: "green",
pin_to_top: false,
subscribed: true,
};
add_row(announceSub);
const DenmarkSub = {
name: "Denmark",
stream_id: 5000,
color: "green",
pin_to_top: false,
subscribed: true,
};
add_row(DenmarkSub);
const carSub = {
name: "cars",
stream_id: 6000,
color: "green",
pin_to_top: false,
subscribed: true,
};
add_row(carSub);
}
function elem($obj) {
return {to_$: () => $obj};
}
run_test("zoom_in_and_zoom_out", () => {
const label1 = $.create("label1 stub");
const label2 = $.create("label2 stub");
label1.show();
label2.show();
assert(label1.visible());
assert(label2.visible());
$(".stream-filters-label").each = (f) => {
f.call(elem(label1));
f.call(elem(label2));
};
const splitter = $.create("hr stub");
splitter.show();
assert(splitter.visible());
$(".stream-split").each = (f) => {
f.call(elem(splitter));
};
const stream_li1 = $.create("stream1 stub");
const stream_li2 = $.create("stream2 stub");
function make_attr(arg) {
return (sel) => {
assert.equal(sel, "data-stream-id");
return arg;
};
}
stream_li1.attr = make_attr("42");
stream_li1.hide();
stream_li2.attr = make_attr("99");
$("#stream_filters li.narrow-filter").each = (f) => {
f.call(elem(stream_li1));
f.call(elem(stream_li2));
};
$("#stream-filters-container")[0] = {
dataset: {},
};
stream_list.set_event_handlers();
stream_list.zoom_in_topics({stream_id: 42});
assert(!label1.visible());
assert(!label2.visible());
assert(!splitter.visible());
assert(stream_li1.visible());
assert(!stream_li2.visible());
assert($("#streams_list").hasClass("zoom-in"));
$("#stream_filters li.narrow-filter").show = () => {
stream_li1.show();
stream_li2.show();
};
stream_li1.length = 1;
stream_list.zoom_out_topics({stream_li: stream_li1});
assert(label1.visible());
assert(label2.visible());
assert(splitter.visible());
assert(stream_li1.visible());
assert(stream_li2.visible());
assert($("#streams_list").hasClass("zoom-out"));
});
set_global("$", global.make_zjquery());
run_test("narrowing", () => {
initialize_stream_data();
set_global("narrow_state", {
stream() {
return "devel";
},
topic: noop,
});
topic_list.close = noop;
topic_list.rebuild = noop;
topic_list.active_stream_id = noop;
topic_list.get_stream_li = noop;
scroll_util.scroll_element_into_container = noop;
set_global("ui", {
get_scroll_element: (element) => element,
});
assert(!$("<devel sidebar row html>").hasClass("active-filter"));
stream_list.set_event_handlers();
let filter;
filter = new Filter([{operator: "stream", operand: "devel"}]);
stream_list.handle_narrow_activated(filter);
assert($("<devel sidebar row html>").hasClass("active-filter"));
filter = new Filter([
{operator: "stream", operand: "cars"},
{operator: "topic", operand: "sedans"},
]);
stream_list.handle_narrow_activated(filter);
assert(!$("ul.filters li").hasClass("active-filter"));
assert(!$("<cars sidebar row html>").hasClass("active-filter")); // false because of topic
filter = new Filter([{operator: "stream", operand: "cars"}]);
stream_list.handle_narrow_activated(filter);
assert(!$("ul.filters li").hasClass("active-filter"));
assert($("<cars sidebar row html>").hasClass("active-filter"));
let removed_classes;
$("ul#stream_filters li").removeClass = (classes) => {
removed_classes = classes;
};
let topics_closed;
topic_list.close = () => {
topics_closed = true;
};
stream_list.handle_narrow_deactivated();
assert.equal(removed_classes, "active-filter");
assert(topics_closed);
});
run_test("focusout_user_filter", () => {
const e = {};
const click_handler = $(".stream-list-filter").get_on_handler("focusout");
click_handler(e);
});
run_test("focus_user_filter", () => {
const e = {
stopPropagation() {},
};
const click_handler = $(".stream-list-filter").get_on_handler("click");
click_handler(e);
});
run_test("sort_streams", () => {
stream_data.clear_subscriptions();
// Get coverage on early-exit.
stream_list.build_stream_list();
initialize_stream_data();
global.stream_data.is_active = function (sub) {
return sub.name !== "cars";
};
let appended_elems;
$("#stream_filters").append = function (elems) {
appended_elems = elems;
};
stream_list.build_stream_list();
const split = '<hr class="stream-split">';
const expected_elems = [
$("<devel sidebar row html>"),
$("<Rome sidebar row html>"),
$("<test sidebar row html>"),
split,
$("<announce sidebar row html>"),
$("<Denmark sidebar row html>"),
split,
$("<cars sidebar row html>"),
];
assert.deepEqual(appended_elems, expected_elems);
const streams = global.stream_sort.get_streams();
assert.deepEqual(streams, [
// three groups: pinned, normal, dormant
"devel",
"Rome",
"test",
//
"announce",
"Denmark",
//
"cars",
]);
const denmark_sub = stream_data.get_sub("Denmark");
const stream_id = denmark_sub.stream_id;
assert(stream_list.stream_sidebar.has_row_for(stream_id));
stream_list.remove_sidebar_row(stream_id);
assert(!stream_list.stream_sidebar.has_row_for(stream_id));
});
run_test("separators_only_pinned_and_dormant", () => {
// Test only pinned and dormant streams
stream_data.clear_subscriptions();
// Get coverage on early-exit.
stream_list.build_stream_list();
// pinned streams
const develSub = {
name: "devel",
stream_id: 1000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(develSub);
const RomeSub = {
name: "Rome",
stream_id: 2000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(RomeSub);
// dormant stream
const DenmarkSub = {
name: "Denmark",
stream_id: 3000,
color: "blue",
pin_to_top: false,
subscribed: true,
};
add_row(DenmarkSub);
global.stream_data.is_active = function (sub) {
return sub.name !== "Denmark";
};
let appended_elems;
$("#stream_filters").append = function (elems) {
appended_elems = elems;
};
stream_list.build_stream_list();
const split = '<hr class="stream-split">';
const expected_elems = [
// pinned
$("<devel sidebar row html>"),
$("<Rome sidebar row html>"),
split,
// dormant
$("<Denmark sidebar row html>"),
];
assert.deepEqual(appended_elems, expected_elems);
});
run_test("separators_only_pinned", () => {
// Test only pinned streams
stream_data.clear_subscriptions();
// Get coverage on early-exit.
stream_list.build_stream_list();
// pinned streams
const develSub = {
name: "devel",
stream_id: 1000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(develSub);
const RomeSub = {
name: "Rome",
stream_id: 2000,
color: "blue",
pin_to_top: true,
subscribed: true,
};
add_row(RomeSub);
let appended_elems;
$("#stream_filters").append = function (elems) {
appended_elems = elems;
};
stream_list.build_stream_list();
const expected_elems = [
// pinned
$("<devel sidebar row html>"),
$("<Rome sidebar row html>"),
// no separator at the end as no stream follows
];
assert.deepEqual(appended_elems, expected_elems);
});
run_test("update_count_in_dom", () => {
function make_elem(elem, count_selector, value_selector) {
const count = $(count_selector);
const value = $(value_selector);
elem.set_find_results(".count", count);
count.set_find_results(".value", value);
count.set_parent(elem);
return elem;
}
const stream_li = make_elem($("<stream li>"), "<stream-count>", "<stream-value>");
$("<stream li>").length = 0;
stream_li.addClass("subscription_block");
stream_li.addClass("stream-with-count");
assert(stream_li.hasClass("stream-with-count"));
const stream_count = new Map();
const stream_id = 11;
const stream_row = {
get_li() {
return stream_li;
},
};
stream_list.stream_sidebar.set_row(stream_id, stream_row);
stream_count.set(stream_id, 0);
const counts = {
stream_count,
topic_count: new Map(),
};
stream_list.update_dom_with_unread_counts(counts);
assert.equal($("<stream li>").text(), "never-been-set");
assert(!stream_li.hasClass("stream-with-count"));
stream_count.set(stream_id, 99);
stream_list.update_dom_with_unread_counts(counts);
assert.equal($("<stream-value>").text(), "99");
assert(stream_li.hasClass("stream-with-count"));
});
narrow_state.active = () => false;
run_test("rename_stream", () => {
const sub = stream_data.get_sub_by_name("devel");
const new_name = "Development";
stream_data.rename_sub(sub, new_name);
const li_stub = $.create("li stub");
li_stub.length = 0;
global.stub_templates((name, payload) => {
assert.equal(name, "stream_sidebar_row");
assert.deepEqual(payload, {
name: "Development",
id: 1000,
uri: "#narrow/stream/1000-Development",
is_muted: false,
invite_only: undefined,
is_web_public: undefined,
color: payload.color,
pin_to_top: true,
dark_background: payload.dark_background,
});
return {to_$: () => li_stub};
});
let count_updated;
stream_list.update_count_in_dom = (li) => {
assert.equal(li, li_stub);
count_updated = true;
};
stream_list.rename_stream(sub);
assert(count_updated);
});
set_global("$", global.make_zjquery());
run_test("refresh_pin", () => {
initialize_stream_data();
const sub = {
name: "maybe_pin",
stream_id: 100,
color: "blue",
pin_to_top: false,
};
stream_data.add_sub(sub);
const pinned_sub = {
...sub,
pin_to_top: true,
};
const li_stub = $.create("li stub");
li_stub.length = 0;
global.stub_templates(() => ({to_$: () => li_stub}));
stream_list.update_count_in_dom = noop;
$("#stream_filters").append = noop;
let scrolled;
stream_list.scroll_stream_into_view = (li) => {
assert.equal(li, li_stub);
scrolled = true;
};
stream_list.refresh_pinned_or_unpinned_stream(pinned_sub);
assert(scrolled);
});
run_test("create_initial_sidebar_rows", () => {
initialize_stream_data();
const html_dict = new Map();
stream_list.stream_sidebar = {
has_row_for: return_false,
set_row(stream_id, widget) {
html_dict.set(stream_id, widget.get_li().html());
},
};
stream_list.update_count_in_dom = noop;
global.stub_templates((template_name, data) => {
assert.equal(template_name, "stream_sidebar_row");
return "<div>stub-html-" + data.name;
});
// Test this code with stubs above...
stream_list.create_initial_sidebar_rows();
assert.equal(html_dict.get(1000), "<div>stub-html-devel");
assert.equal(html_dict.get(5000), "<div>stub-html-Denmark");
});