node tests: Use stubs in lightbox tests.

We stub out jquery elements rather than giving
the illusion of having real DOM.

Also, we make it so that the message_store
interaction has an assertion attached to it.
This commit is contained in:
Steve Howell 2020-02-10 22:21:06 +00:00 committed by showell
parent c4e3cfebb0
commit 8f0018ee7c
1 changed files with 38 additions and 30 deletions

View File

@ -2,10 +2,7 @@ zrequire('lightbox');
set_global('blueslip', global.make_zblueslip()); set_global('blueslip', global.make_zblueslip());
const _message_store = new Map(); set_global('message_store', {});
_message_store.set(1234, { sender_full_name: "Test User" });
set_global('message_store', _message_store);
set_global('Image', class Image {}); set_global('Image', class Image {});
set_global('overlays', { set_global('overlays', {
close_overlay: () => {}, close_overlay: () => {},
@ -21,48 +18,59 @@ set_global('$', global.make_zjquery());
run_test('pan_and_zoom', () => { run_test('pan_and_zoom', () => {
$.clear_all_elements(); $.clear_all_elements();
const img = '<img src="./image.png" data-src-fullsize="./original.png">'; const img = $.create('img-stub');
const link = '<a href="https://zulip.com"></a>'; const link = $.create('link-stub');
const msg = $.create('msg-stub');
/* Due to how zquery works, we have to use a literal [zid] in the element, $(img).closest = () => [];
since that's what the code looks for and we have to manually set the attr
that should be returned from the store. */ img.set_parent(link);
const msg = $('<div [zid]></div>'); link.closest = () => msg;
msg.attr("zid", "1234"); msg.attr("zid", "1234");
$(img).set_parent($(link));
$(link).set_parent(msg); let fetched_zid;
message_store.get = (zid) => {
fetched_zid = zid;
return 'message-stub';
};
// Used by render_lightbox_list_images // Used by render_lightbox_list_images
$.stub_selector('.focused_table .message_inline_image img', []); $.stub_selector('.focused_table .message_inline_image img', []);
lightbox.open(img); lightbox.open(img);
assert.equal(blueslip.get_test_logs('error').length, 0); assert.equal(blueslip.get_test_logs('error').length, 0);
lightbox.open('<img src="./image.png">');
assert.equal(blueslip.get_test_logs('error').length, 0); assert.equal(fetched_zid, 1234);
}); });
run_test('open_url', () => { run_test('youtube', () => {
$.clear_all_elements(); $.clear_all_elements();
const url = 'https://youtube.com/1234'; const href = 'https://youtube.com/some-random-clip';
const img = '<img></img>'; const img = $.create('img-stub');
$(img).attr('src', "https://youtube.com/image.png"); const link = $.create('link-stub');
const link = '<a></a>'; const msg = $.create('msg-stub');
$(link).attr('href', url);
const div = '<div class="youtube-video"></div>'; $(img).attr('src', href);
/* Due to how zquery works, we have to use a literal [zid] in the element,
since that's what the code looks for and we have to manually set the attr $(img).closest = (sel) => {
that should be returned from the store. */ if (sel === '.youtube-video') {
const msg = $('<div [zid]></div>'); // We just need a nonempty array to
msg.attr("zid", "1234"); // set is_youtube_video to true.
$(img).set_parent($(link)); return ['whatever'];
$(link).set_parent($(div)); }
$(div).set_parent(msg); return [];
};
img.set_parent(link);
link.closest = () => msg;
link.attr('href', href);
// Used by render_lightbox_list_images // Used by render_lightbox_list_images
$.stub_selector('.focused_table .message_inline_image img', []); $.stub_selector('.focused_table .message_inline_image img', []);
lightbox.open(img); lightbox.open(img);
assert.equal($('.image-actions .open').attr('href'), url); assert.equal($('.image-actions .open').attr('href'), href);
assert.equal(blueslip.get_test_logs('error').length, 0); assert.equal(blueslip.get_test_logs('error').length, 0);
}); });