Revert "search: Fix blur event handler for search_query_box."

This reverts commit 63643c9d9d.

As the commit mentions, it makes a UI change for legacy search which
has largely been considered a regression.  We've been running with
this reverted in zulip.com essentially since it was first merged.
This commit is contained in:
Tim Abbott
2020-07-14 12:26:28 -07:00
parent 42d601e214
commit cb54e30832
3 changed files with 26 additions and 14 deletions

View File

@@ -78,6 +78,7 @@ run_test('initialize', () => {
const search_query_box = $('#search_query'); const search_query_box = $('#search_query');
const searchbox_form = $('#searchbox_form'); const searchbox_form = $('#searchbox_form');
const search_button = $('.search_button'); const search_button = $('.search_button');
const searchbox = $('#searchbox');
searchbox_form.on = (event, func) => { searchbox_form.on = (event, func) => {
assert.equal(event, 'compositionend'); assert.equal(event, 'compositionend');
@@ -182,7 +183,6 @@ run_test('initialize', () => {
search.is_using_input_method = true; search.is_using_input_method = true;
_setup('stream:Verona'); _setup('stream:Verona');
search_query_box.is = return_true;
assert.equal(opts.updater('stream:Verona'), 'stream:Verona'); assert.equal(opts.updater('stream:Verona'), 'stream:Verona');
assert(!is_blurred); assert(!is_blurred);
@@ -290,6 +290,18 @@ run_test('initialize', () => {
} }
}; };
searchbox.on = (event, callback) => {
if (event === 'focusin') {
searchbox.css({"box-shadow": "unset"});
callback();
assert.deepEqual(searchbox.css(), {"box-shadow": "inset 0px 0px 0px 2px hsl(204, 20%, 74%)"});
} else if (event === 'focusout') {
searchbox.css({"box-shadow": "inset 0px 0px 0px 2px hsl(204, 20%, 74%)"});
callback();
assert.deepEqual(searchbox.css(), {"box-shadow": "unset"});
}
};
search.initialize(); search.initialize();
}); });

View File

@@ -9,7 +9,7 @@ const return_true = () => true;
const return_false = () => false; const return_false = () => false;
set_global('$', global.make_zjquery()); set_global('$', global.make_zjquery());
set_global('narrow_state', {filter: return_false}); set_global('narrow_state', {});
set_global('search_suggestion', {}); set_global('search_suggestion', {});
set_global('ui_util', { set_global('ui_util', {
change_tab_to: noop, change_tab_to: noop,

View File

@@ -91,15 +91,7 @@ exports.initialize = function () {
if (page_params.search_pills_enabled) { if (page_params.search_pills_enabled) {
search_pill.append_search_string(search_string, search_pill.append_search_string(search_string,
search_pill_widget.widget); search_pill_widget.widget);
if (search_query_box.is(':focus')) { return search_query_box.val();
// We usually allow the user to continue
// typing until the enter key is pressed.
// But we narrow when the user clicks on a
// typeahead suggestion. This change in behaviour
// is a workaround to be able to display the
// navbar every time search_query_box loses focus.
return search_query_box.val();
}
} }
return exports.narrow_or_search_for_term(search_string); return exports.narrow_or_search_for_term(search_string);
}, },
@@ -175,7 +167,7 @@ exports.initialize = function () {
// selecting something in the typeahead menu causes // selecting something in the typeahead menu causes
// the box to lose focus a moment before. // the box to lose focus a moment before.
// //
// The workaround is to check 300ms later -- long // The workaround is to check 100ms later -- long
// enough for the search to have gone through, but // enough for the search to have gone through, but
// short enough that the user won't notice (though // short enough that the user won't notice (though
// really it would be OK if they did). // really it would be OK if they did).
@@ -194,10 +186,18 @@ exports.initialize = function () {
} }
setTimeout(() => { setTimeout(() => {
exports.update_button_visibility(); exports.update_button_visibility();
}, 100);
});
if (page_params.search_pills_enabled) {
// Uses jquery instead of pure css as the `:focus` event occurs on `#search_query`,
// while we want to add box-shadow to `#searchbox`. This could have been done
// with `:focus-within` CSS selector, but it is not supported in IE or Opera.
searchbox.on('focusout', function () {
tab_bar.close_search_bar_and_open_narrow_description(); tab_bar.close_search_bar_and_open_narrow_description();
searchbox.css({"box-shadow": "unset"}); searchbox.css({"box-shadow": "unset"});
}, 300); });
}); }
}; };
exports.focus_search = function () { exports.focus_search = function () {