关于抑制Chromium内核浏览器执行WritableStream.close()时系统光标切换为“后台工作”状态的技术问询

This is a super frustrating issue for screen recording tools—nothing throws off a recording like unexpected cursor changes popping up every few seconds. Let’s break down why this happens and the most practical workarounds to fix it:

Why the Cursor Changes #

Chromium-based browsers (Chrome/Edge) trigger Windows’ "background working" cursor when handling certain file system operations, and WritableStream.close() is one of them. Closing the stream forces a flush of buffered data to disk, which the browser treats as a potentially blocking I/O task. Unfortunately, there’s no official API flag to disable this system-level cursor behavior directly.

Workaround 1: Keep the Stream Open (Best Solution) #

The core problem is calling close() every second. Instead of opening and closing a new stream for each tiny write, open a single stream once at the start of recording and keep it open until the user stops. Only call close() when the recording ends. This way, the cursor flicker only happens once—at the very end of the session.

Here’s how to adjust your code:

<body>
  <button onclick="startBackup()">Start Backup</button>
  <button onclick="stopBackup()">Stop Backup</button>
  <script>
    let activeWritable;
    let backupInterval;

    async function startBackup() {
      const dirHandle = await window.showDirectoryPicker();
      const fileHandle = await dirHandle.getFileHandle('backup.txt', { create: true });
      // Open the stream once at the start of recording
      activeWritable = await fileHandle.createWritable();
      
      backupInterval = setInterval(async () => {
        await activeWritable.write("Test\n");
        console.log('Wrote backup chunk');
        // No close() here—stream stays open for ongoing writes
      }, 1000);
    }

    async function stopBackup() {
      clearInterval(backupInterval);
      if (activeWritable) {
        console.log('Closing backup stream...');
        await activeWritable.close(); // Cursor flickers once, only when stopping
        activeWritable = null;
      }
    }
  </script>
</body>

This approach eliminates frequent cursor interruptions entirely during recording, which is perfect for your use case.

Workaround 2: Batch Writes to Reduce close() Frequency #

If keeping the stream open long-term isn’t feasible (e.g., you need periodic file snapshots), batch multiple writes into a single close() call. For example, accumulate data for 10 seconds before writing and closing the stream. This cuts the cursor flicker frequency from every second to every 10 seconds (or whatever interval makes sense for your backup needs).

Example:

<body>
  <button onclick="selectDirectory()">Select Directory for Backup</button>
  <script>
    let backupBuffer = [];

    async function selectDirectory() {
      const dirHandle = await window.showDirectoryPicker();
      const fileHandle = await dirHandle.getFileHandle('backup.txt', { create: true });
      
      setInterval(async () => {
        backupBuffer.push("Test");
        // Only write and close when buffer reaches a threshold (e.g., 10 chunks)
        if (backupBuffer.length >= 10) {
          const writable = await fileHandle.createWritable();
          await writable.write(backupBuffer.join("\n"));
          console.log('Closing writable after batch...');
          await writable.close(); // Cursor flickers once per batch
          backupBuffer = [];
        }
      }, 1000);
    }
  </script>
</body>

Workaround 3: DOM Cursor Override (Less Reliable) #

You can try overriding the DOM cursor to mask the system cursor change, but this is hit-or-miss because the browser’s system cursor takes priority over CSS. Still, it’s worth testing if the other workarounds don’t fit your workflow:

async function safeClose(writable) {
  // Force DOM cursor to default while closing
  document.body.style.cursor = 'default';
  await writable.close();
  // Reset cursor after a short delay to cover the flicker window
  setTimeout(() => {
    document.body.style.cursor = '';
  }, 150);
}

Note that this won’t prevent the system cursor from changing, but it might make the flicker less noticeable to the user.

Final Notes #

The first workaround (keeping the stream open) is by far the most effective for screen recording tools, as it removes frequent cursor interruptions entirely. Chromium doesn’t expose a way to disable the system cursor trigger for file operations, so adjusting how and how often you call close() is the best path forward.

内容的提问来源于stack exchange，提问作者KMathmann