test: disable flaky macOS panel test & refactor screen capture testing (#41441)

* Disable flaky test

* Add helper for storing test artifacts

* Refactor screen capture tests

We have a pattern for inspecting a screen capture, so this refactor codifies that pattern into a helper. This gives us shorter test code, consistency (previously, the display in test code and the display captured could theoretically be different), and better debugging/observability on failure.

spec/lib/artifacts.ts

@@ -0,0 +1,36 @@
+import path = require('node:path');
+import fs = require('node:fs/promises');
+import { randomBytes } from 'node:crypto';
+
+const IS_CI = !!process.env.CI;
+const ARTIFACT_DIR = path.join(__dirname, '..', 'artifacts');
+
+async function ensureArtifactDir (): Promise<void> {
+  if (!IS_CI) {
+    return;
+  }
+
+  await fs.mkdir(ARTIFACT_DIR, { recursive: true });
+}
+
+export async function createArtifact (
+  fileName: string,
+  data: Buffer
+): Promise<void> {
+  if (!IS_CI) {
+    return;
+  }
+
+  await ensureArtifactDir();
+  await fs.writeFile(path.join(ARTIFACT_DIR, fileName), data);
+}
+
+export async function createArtifactWithRandomId (
+  makeFileName: (id: string) => string,
+  data: Buffer
+): Promise<string> {
+  const randomId = randomBytes(12).toString('hex');
+  const fileName = makeFileName(randomId);
+  await createArtifact(fileName, data);
+  return fileName;
+}