diff --git a/src/browser/renderer/dom/DomRenderer.ts b/src/browser/renderer/dom/DomRenderer.ts
index c89cee6252..92d152f0d0 100644
--- a/src/browser/renderer/dom/DomRenderer.ts
+++ b/src/browser/renderer/dom/DomRenderer.ts
@@ -343,6 +343,9 @@ export class DomRenderer extends Disposable implements IRenderer {
     }
 
     this._selectionRenderModel.update(this._terminal, start, end, columnSelectMode);
+    if (!this._selectionRenderModel.hasSelection) {
+      return;
+    }
 
     // Translate from buffer position to viewport position
     const viewportStartRow = this._selectionRenderModel.viewportStartRow;
@@ -350,11 +353,6 @@ export class DomRenderer extends Disposable implements IRenderer {
     const viewportCappedStartRow = this._selectionRenderModel.viewportCappedStartRow;
     const viewportCappedEndRow = this._selectionRenderModel.viewportCappedEndRow;
 
-    // No need to draw the selection
-    if (viewportCappedStartRow >= this._bufferService.rows || viewportCappedEndRow < 0) {
-      return;
-    }
-
     // Create the selections
     const documentFragment = this._document.createDocumentFragment();
 
diff --git a/test/playwright/SharedRendererTests.ts b/test/playwright/SharedRendererTests.ts
index c4b665365a..68492b3db2 100644
--- a/test/playwright/SharedRendererTests.ts
+++ b/test/playwright/SharedRendererTests.ts
@@ -1234,6 +1234,20 @@ export function injectSharedRendererTests(ctx: ISharedRendererTestContext): void
       await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, rows), [0, 0, 0, 255]);
       await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, rows, CellColorPosition.FIRST), [0, 0, 255, 255]);
     });
+    test('#4917 The selection should not be displayed if it is not within the scope of the viewport.', async () => {
+      const theme: ITheme = {
+        selectionBackground: '#FF0000'
+      };
+      await ctx.value.page.evaluate(`window.term.options.theme = ${JSON.stringify(theme)};`);
+      for (let index = 0; index < 160; index++) {
+        await ctx.value.proxy.writeln(``);
+      }
+      await ctx.value.proxy.scrollToBottom();
+      const rows = await ctx.value.proxy.buffer.active.length;
+      await ctx.value.proxy.selectLines(rows - 1, rows - 1);
+      await ctx.value.proxy.scrollLines(-2);
+      await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, 1), [0, 0, 0, 255]);
+    });
   });
 }