diff --git a/web/packages/teleport/src/Player/DesktopPlayer.tsx b/web/packages/teleport/src/Player/DesktopPlayer.tsx
index 1e2c1b3a1e2d9..a0bace9583951 100644
--- a/web/packages/teleport/src/Player/DesktopPlayer.tsx
+++ b/web/packages/teleport/src/Player/DesktopPlayer.tsx
@@ -69,7 +69,7 @@ export const DesktopPlayer = ({
     clusterId,
   });
 
-  const isError = playerStatus === StatusEnum.ERROR;
+  const isError = playerStatus === StatusEnum.ERROR || statusText !== '';
   const isLoading = playerStatus === StatusEnum.LOADING;
   const isPlaying = playerStatus === StatusEnum.PLAYING;
   const isComplete = isError || playerStatus === StatusEnum.COMPLETE;
diff --git a/web/packages/teleport/src/Player/SshPlayer.tsx b/web/packages/teleport/src/Player/SshPlayer.tsx
index 878bc1c230caa..ce70754ec6f68 100644
--- a/web/packages/teleport/src/Player/SshPlayer.tsx
+++ b/web/packages/teleport/src/Player/SshPlayer.tsx
@@ -34,7 +34,11 @@ export default function Player({ sid, clusterId, durationMs }) {
     clusterId,
     sid
   );
-  const isError = playerStatus === StatusEnum.ERROR;
+
+  // statusText is currently only set when an error happens, so for now we can assume
+  // if it is not empty, an error occured (even if the player is in COMPLETE state, which gets
+  // set on close)
+  const isError = playerStatus === StatusEnum.ERROR || statusText !== '';
   const isLoading = playerStatus === StatusEnum.LOADING;
   const isPlaying = playerStatus === StatusEnum.PLAYING;
   const isComplete = isError || playerStatus === StatusEnum.COMPLETE;