diff --git a/web/src/stream_list.ts b/web/src/stream_list.ts
index 312a0d98d2..b5e58daab1 100644
--- a/web/src/stream_list.ts
+++ b/web/src/stream_list.ts
@@ -429,13 +429,13 @@ export function zoom_in_topics(options: {stream_id: number | undefined}): void {
         const stream_id = options.stream_id;
 
         if (stream_id_for_elt($elt) === stream_id) {
-            $elt.show();
+            $elt.toggleClass("hide", false);
             // Add search box for topics list.
             $elt.children("div.bottom_left_row").append($(render_filter_topics()));
             $("#topic_filter_query").trigger("focus");
             topic_list.setup_topic_search_typeahead();
         } else {
-            $elt.hide();
+            $elt.toggleClass("hide", true);
         }
     });
 }
@@ -450,7 +450,7 @@ export function zoom_out_topics(): void {
     });
 
     $("#streams_list").expectOne().removeClass("zoom-in").addClass("zoom-out");
-    $("#stream_filters li.narrow-filter").show();
+    $("#stream_filters li.narrow-filter").toggleClass("hide", false);
     // Remove search box for topics list from DOM.
     $(".filter-topics").remove();
 }
diff --git a/web/styles/left_sidebar.css b/web/styles/left_sidebar.css
index 56300638e6..a38151e8e9 100644
--- a/web/styles/left_sidebar.css
+++ b/web/styles/left_sidebar.css
@@ -1904,6 +1904,10 @@ li.topic-list-item {
 }
 
 .zoom-in {
+    .narrow-filter.hide {
+        display: none;
+    }
+
     .narrow-filter > .bottom_left_row {
         position: sticky;
         /* We subtract a quarter pixel of space to correct
diff --git a/web/tests/stream_list.test.cjs b/web/tests/stream_list.test.cjs
index 2876690a32..910cb33070 100644
--- a/web/tests/stream_list.test.cjs
+++ b/web/tests/stream_list.test.cjs
@@ -455,14 +455,14 @@ test_ui("zoom_in_and_zoom_out", ({mock_template}) => {
     assert.ok(!$label1.visible());
     assert.ok(!$label2.visible());
     assert.ok(!$splitter.visible());
-    assert.ok($stream_li1.visible());
-    assert.ok(!$stream_li2.visible());
+    assert.ok(!$stream_li1.hasClass("hide"));
+    assert.ok($stream_li2.hasClass("hide"));
     assert.ok($("#streams_list").hasClass("zoom-in"));
     assert.ok(filter_topics_appended);
 
-    $("#stream_filters li.narrow-filter").show = () => {
-        $stream_li1.show();
-        $stream_li2.show();
+    $("#stream_filters li.narrow-filter").toggleClass = (classname, value) => {
+        $stream_li1.toggleClass(classname, value);
+        $stream_li2.toggleClass(classname, value);
     };
 
     $stream_li1.length = 1;
@@ -474,8 +474,8 @@ test_ui("zoom_in_and_zoom_out", ({mock_template}) => {
     assert.ok($label1.visible());
     assert.ok($label2.visible());
     assert.ok($splitter.visible());
-    assert.ok($stream_li1.visible());
-    assert.ok($stream_li2.visible());
+    assert.ok(!$stream_li1.hasClass("hide"));
+    assert.ok(!$stream_li2.hasClass("hide"));
     assert.ok($("#streams_list").hasClass("zoom-out"));
     assert.ok(!filter_topics_appended);
 });