{
  "beforeRevision": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
  "afterRevision": "499ddf307010062beac5dfa30ac85f49083bbe88",
  "builds": {
    "before": "8e676f49549e7308",
    "after": "5eaccd708ea64185"
  },
  "agentServer": "1.56.0",
  "sdk": "1.56.0",
  "implementation": {
    "pullRequest": "https://github.com/OpenHands/OpenHands/pull/18762",
    "sourcePath": "src/components/features/diff-viewer/file-diff-viewer.tsx",
    "layoutOnly": true,
    "intendedVisualRedesign": false
  },
  "captureProvenance": "markdown-preview-cap-capture-provenance.json",
  "captureProvenanceSha256": "faf9451ec0cf80c75b5db6326c08c710f1e65a690051ecf414d60eed76b99eac",
  "evidenceDownload": "markdown-preview-cap-evidence.zip",
  "evidenceDownloadSha256": "6dd5b4bd99af026932b61e7612c201d967ee338c4e5bc9a9e41c3dbec404442e",
  "scope": {
    "host": "standalone Local Agent Canvas",
    "themes": [
      "OpenHands-Neutral",
      "Light+",
      "OpenHands-DeepSea"
    ],
    "pairedCases": 16,
    "selectedOriginals": 24,
    "geometryPairsWithZeroDifferences": 16,
    "pairedContentAndControlsReads": 12,
    "maxHeightPixels": 600,
    "desktopShortNewHeightPixels": 185,
    "phoneShortNewHeightPixels": 209,
    "modes": "Working Old/New and actual Diff; historical Old/New selected screenshots."
  },
  "limits": [
    "Existing Monaco disposal errors (#17567) reproduce on old/diff transitions: baseline 3 and After 2. Baseline count includes the first discarded recording attempt. No other captured page error message.",
    "After representative-theme reads initially raced React render. Re-drove all four theme states with visible-preview wait plus 300ms settle. Only the four -verified theme PNGs are selected; their measured dimensions match baseline.",
    "Layout-only migration from an inline declaration to a Tailwind/CSS-owned property; the film demonstrates retained behavior, not a visual redesign.",
    "Representative live evidence covers Local standalone Canvas in Neutral, Light+ and DeepSea, plus the recorded viewport cases. No all-five-theme, authenticated Cloud, ACP or arbitrary embedded-host visual pass is claimed."
  ],
  "diagnostics": {
    "before": {
      "pageErrors": 3,
      "appErrors": 3,
      "warnings": 0,
      "distinctMessages": [
        "TextModel got disposed before DiffEditorWidget model got reset"
      ]
    },
    "after": {
      "pageErrors": 2,
      "appErrors": 2,
      "warnings": 0,
      "distinctMessages": [
        "TextModel got disposed before DiffEditorWidget model got reset"
      ]
    }
  },
  "cleanup": {
    "before": {
      "stoppedAt": "2026-10-21T12:04:06.807Z",
      "browserStopped": true,
      "launcherStopped": true,
      "ports": {
        "ingress": "closed",
        "agentServer": "closed",
        "automation": "closed",
        "frontend": "closed",
        "vscode": "closed"
      },
      "privatePurged": true,
      "evidenceFilesBeforePurge": 28,
      "evidenceFilesAfterPurge": 28,
      "ok": true
    },
    "after": {
      "stoppedAt": "2026-10-21T12:07:08.024Z",
      "browserStopped": true,
      "launcherStopped": true,
      "ports": {
        "ingress": "closed",
        "agentServer": "closed",
        "automation": "closed",
        "frontend": "closed",
        "vscode": "closed"
      },
      "privatePurged": true,
      "evidenceFilesBeforePurge": 16,
      "evidenceFilesAfterPurge": 16,
      "ok": true
    }
  },
  "page": "https://enyst.github.io/arch/agentic-linting-refactoring.html#markdown-preview-cap-film",
  "directDownload": "https://enyst.github.io/experiments/agentic-linting-refactoring/markdown-preview-cap-before-after.mp4",
  "title": "Markdown preview cap",
  "recipeSha256": "25e5dedfae04a3566494b2bc325ac7dba7ed0327fff83106c06c031483920bd4",
  "film": {
    "file": "markdown-preview-cap-before-after.mp4",
    "dimensions": [
      1440,
      1120
    ],
    "durationSeconds": 34.6,
    "framesPerSecond": 20,
    "source": "Authentic control-openhands browser receipts. Complete app viewports are established before any explicitly labeled actual screenshot Detail crops. Title cards and banners are editorial labels, not execution proof.",
    "scenes": [
      {
        "phase": "before",
        "head": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
        "servedBuildFingerprint": "8e676f49549e7308",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "Before \u00b7 Inline cap",
        "kind": "recording",
        "publicSourcePath": "markdown-preview-cap-before-desktop-raw.mp4",
        "subtitle": "Neutral \u00b7 Desktop \u00b7 Same 600 px cap",
        "caption": "Before: entire actual desktop recording; local scrolling, Old/New, actual Diff and shorter Markdown content retain their behavior.",
        "scope": "Entire original normal-speed CLI recording. No pause/resume or speed changes; the CLI holds its final frame.",
        "source": "markdown-preview-cap-before-desktop-raw.mp4",
        "sourceSha256": "a491039adab2f0a55ad86959ed0cdd72b18db8f4d959281590a2313c76503223",
        "sourceBytes": 237779,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          1.4,
          8.8
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 7.4,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "after",
        "head": "499ddf307010062beac5dfa30ac85f49083bbe88",
        "servedBuildFingerprint": "5eaccd708ea64185",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "After \u00b7 CSS cap",
        "kind": "recording",
        "publicSourcePath": "markdown-preview-cap-after-desktop-raw.mp4",
        "subtitle": "Neutral \u00b7 Desktop \u00b7 Same 600 px cap",
        "caption": "After: entire actual desktop recording; local scrolling, Old/New, actual Diff and shorter Markdown content retain their behavior.",
        "scope": "Entire original normal-speed CLI recording. No pause/resume or speed changes; the CLI holds its final frame.",
        "source": "markdown-preview-cap-after-desktop-raw.mp4",
        "sourceSha256": "a3ef11cbe9ab1d1daeadfcda7afd60bbc4834280eb3c25c9db350b946875db1f",
        "sourceBytes": 255923,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          8.8,
          16.2
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 7.4,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "before",
        "head": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
        "servedBuildFingerprint": "8e676f49549e7308",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "Before \u00b7 Inline cap",
        "kind": "recording",
        "publicSourcePath": "markdown-preview-cap-before-phone-raw.mp4",
        "subtitle": "Neutral \u00b7 Phone \u00b7 Scroll and shrink",
        "caption": "Before: entire actual phone recording; long content scrolls and short content shrinks under the same 600 px cap.",
        "scope": "Entire original normal-speed CLI recording. No pause/resume or speed changes; the CLI holds its final frame.",
        "source": "markdown-preview-cap-before-phone-raw.mp4",
        "sourceSha256": "480943bd4906474d403513c420d0818682777522cec1b7105873f2122b894ef5",
        "sourceBytes": 105908,
        "sourceDimensions": [
          390,
          844
        ],
        "timelineSeconds": [
          16.2,
          19.4
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 3.2,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "after",
        "head": "499ddf307010062beac5dfa30ac85f49083bbe88",
        "servedBuildFingerprint": "5eaccd708ea64185",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "After \u00b7 CSS cap",
        "kind": "recording",
        "publicSourcePath": "markdown-preview-cap-after-phone-raw.mp4",
        "subtitle": "Neutral \u00b7 Phone \u00b7 Scroll and shrink",
        "caption": "After: entire actual phone recording; long content scrolls and short content shrinks under the same 600 px cap.",
        "scope": "Entire original normal-speed CLI recording. No pause/resume or speed changes; the CLI holds its final frame.",
        "source": "markdown-preview-cap-after-phone-raw.mp4",
        "sourceSha256": "f2b26a89101b6f835c0d212371709b0cc8892e23e7cc4e0168939eb670f612da",
        "sourceBytes": 103098,
        "sourceDimensions": [
          390,
          844
        ],
        "timelineSeconds": [
          19.4,
          22.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": 3.2,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 0.0
      },
      {
        "phase": "before",
        "head": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
        "servedBuildFingerprint": "8e676f49549e7308",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "Before \u00b7 Inline cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-evidence/before-light-plus-desktop-long.png",
        "subtitle": "Light+ \u00b7 Full context \u00b7 600 px cap",
        "caption": "Before: matched full context in Light+; measured long preview height and max-height are 600 pixels.",
        "scope": "Matched actual full-viewport screenshot hold.",
        "source": "markdown-preview-cap-evidence/before-light-plus-desktop-long.png",
        "sourceSha256": "e5daddf8368a96dec29e5c36c8bb10fd4f5e6e9c559829b65b2b5f96138bf0b4",
        "sourceBytes": 145769,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          22.6,
          24.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "after",
        "head": "499ddf307010062beac5dfa30ac85f49083bbe88",
        "servedBuildFingerprint": "5eaccd708ea64185",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "After \u00b7 CSS cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-evidence/preview-after-light-plus-desktop-long-verified.png",
        "subtitle": "Light+ \u00b7 Full context \u00b7 600 px cap",
        "caption": "After: matched full context in Light+; measured long preview height and max-height are 600 pixels.",
        "scope": "Matched actual full-viewport screenshot hold.",
        "source": "markdown-preview-cap-evidence/preview-after-light-plus-desktop-long-verified.png",
        "sourceSha256": "f03010e43fee0c82792094436b1db34a9259d4b8b669da61b3d8f48352ae44ba",
        "sourceBytes": 145030,
        "sourceDimensions": [
          1440,
          1000
        ],
        "timelineSeconds": [
          24.6,
          26.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Full real viewport, proportionally fitted below a separate editorial banner.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "before",
        "head": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
        "servedBuildFingerprint": "8e676f49549e7308",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "Before \u00b7 Inline cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-before-long-detail.png",
        "subtitle": "Detail \u00b7 Same 600 px cap \u00b7 Light+",
        "caption": "Before: actual long-preview detail in Light+; the 600-pixel maximum and local scrollbar are preserved.",
        "scope": "Actual screenshot detail after full context; no UI synthesized.",
        "actualDetailCrop": true,
        "detailOf": "markdown-preview-cap-evidence/before-light-plus-desktop-long.png",
        "detailOfSha256": "e5daddf8368a96dec29e5c36c8bb10fd4f5e6e9c559829b65b2b5f96138bf0b4",
        "detailCropPixels": [
          887,
          81,
          553,
          650
        ],
        "source": "markdown-preview-cap-before-long-detail.png",
        "sourceSha256": "9c01ce973131708135b4e76ed733be20ca9108e33c4d3ae7e1c8e98989a99533",
        "sourceBytes": 65243,
        "sourceDimensions": [
          553,
          650
        ],
        "timelineSeconds": [
          26.6,
          28.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "after",
        "head": "499ddf307010062beac5dfa30ac85f49083bbe88",
        "servedBuildFingerprint": "5eaccd708ea64185",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "After \u00b7 CSS cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-after-long-detail.png",
        "subtitle": "Detail \u00b7 Same 600 px cap \u00b7 Light+",
        "caption": "After: actual long-preview detail in Light+; the 600-pixel maximum and local scrollbar are preserved.",
        "scope": "Actual screenshot detail after full context; no UI synthesized.",
        "actualDetailCrop": true,
        "detailOf": "markdown-preview-cap-evidence/preview-after-light-plus-desktop-long-verified.png",
        "detailOfSha256": "f03010e43fee0c82792094436b1db34a9259d4b8b669da61b3d8f48352ae44ba",
        "detailCropPixels": [
          887,
          81,
          553,
          650
        ],
        "source": "markdown-preview-cap-after-long-detail.png",
        "sourceSha256": "9c01ce973131708135b4e76ed733be20ca9108e33c4d3ae7e1c8e98989a99533",
        "sourceBytes": 65243,
        "sourceDimensions": [
          553,
          650
        ],
        "timelineSeconds": [
          28.6,
          30.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "before",
        "head": "630e587a0de0b4106173ba0d39ac865d60a51a5a",
        "servedBuildFingerprint": "8e676f49549e7308",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "Before \u00b7 Inline cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-before-short-detail.png",
        "subtitle": "Detail \u00b7 Short content \u00b7 185 px",
        "caption": "Before: actual short-preview detail; measured content panel height is 185 pixels in both runs, below the 600-pixel cap.",
        "scope": "Actual screenshot detail after full context; no UI synthesized.",
        "actualDetailCrop": true,
        "detailOf": "markdown-preview-cap-evidence/before-light-plus-desktop-short.png",
        "detailOfSha256": "a631e9239d114a52bb34d2e65cab35b7c1494a8bef1c47cc16040cffad2f27f8",
        "detailCropPixels": [
          895,
          121,
          545,
          225
        ],
        "source": "markdown-preview-cap-before-short-detail.png",
        "sourceSha256": "35015fd4f0e0e59dc59b63996e5170638ebc872f9a5593c366196cf05917a9a5",
        "sourceBytes": 17113,
        "sourceDimensions": [
          545,
          225
        ],
        "timelineSeconds": [
          30.6,
          32.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 2.0
      },
      {
        "phase": "after",
        "head": "499ddf307010062beac5dfa30ac85f49083bbe88",
        "servedBuildFingerprint": "5eaccd708ea64185",
        "agentServer": "1.56.0",
        "sdk": "1.56.0",
        "label": "After \u00b7 CSS cap",
        "kind": "screenshot",
        "publicSourcePath": "markdown-preview-cap-after-short-detail.png",
        "subtitle": "Detail \u00b7 Short content \u00b7 185 px",
        "caption": "After: actual short-preview detail; measured content panel height is 185 pixels in both runs, below the 600-pixel cap.",
        "scope": "Actual screenshot detail after full context; no UI synthesized.",
        "actualDetailCrop": true,
        "detailOf": "markdown-preview-cap-evidence/preview-after-light-plus-desktop-short-verified.png",
        "detailOfSha256": "cf6c842705cdcbaba2ae5553dd1ab78b4fd6e536dfe932fe0a50089ba1892c0a",
        "detailCropPixels": [
          895,
          121,
          545,
          225
        ],
        "source": "markdown-preview-cap-after-short-detail.png",
        "sourceSha256": "675e8126008dd297b9e70bf619a850d478d97fe54314e12dbc56e71bea0ee787",
        "sourceBytes": 17122,
        "sourceDimensions": [
          545,
          225
        ],
        "timelineSeconds": [
          32.6,
          34.6
        ],
        "selectedSourceStartSeconds": 0.0,
        "sourceDurationSeconds": null,
        "presentation": "Actual screenshot detail crop, proportionally enlarged below a separate editorial banner; full viewport established earlier.",
        "stillOrHeldSeconds": 2.0
      }
    ],
    "chapters": [
      {
        "from": 0,
        "to": 1.4,
        "kind": "presentation-title",
        "caption": "Markdown preview cap"
      },
      {
        "from": 1.4,
        "to": 8.8,
        "kind": "recording",
        "caption": "Before: entire actual desktop recording; local scrolling, Old/New, actual Diff and shorter Markdown content retain their behavior."
      },
      {
        "from": 8.8,
        "to": 16.200000000000003,
        "kind": "recording",
        "caption": "After: entire actual desktop recording; local scrolling, Old/New, actual Diff and shorter Markdown content retain their behavior."
      },
      {
        "from": 16.200000000000003,
        "to": 19.400000000000002,
        "kind": "recording",
        "caption": "Before: entire actual phone recording; long content scrolls and short content shrinks under the same 600 px cap."
      },
      {
        "from": 19.400000000000002,
        "to": 22.6,
        "kind": "recording",
        "caption": "After: entire actual phone recording; long content scrolls and short content shrinks under the same 600 px cap."
      },
      {
        "from": 22.6,
        "to": 24.6,
        "kind": "screenshot",
        "caption": "Before: matched full context in Light+; measured long preview height and max-height are 600 pixels."
      },
      {
        "from": 24.6,
        "to": 26.6,
        "kind": "screenshot",
        "caption": "After: matched full context in Light+; measured long preview height and max-height are 600 pixels."
      },
      {
        "from": 26.6,
        "to": 28.6,
        "kind": "screenshot",
        "caption": "Before: actual long-preview detail in Light+; the 600-pixel maximum and local scrollbar are preserved."
      },
      {
        "from": 28.6,
        "to": 30.6,
        "kind": "screenshot",
        "caption": "After: actual long-preview detail in Light+; the 600-pixel maximum and local scrollbar are preserved."
      },
      {
        "from": 30.6,
        "to": 32.6,
        "kind": "screenshot",
        "caption": "Before: actual short-preview detail; measured content panel height is 185 pixels in both runs, below the 600-pixel cap."
      },
      {
        "from": 32.6,
        "to": 34.6,
        "kind": "screenshot",
        "caption": "After: actual short-preview detail; measured content panel height is 185 pixels in both runs, below the 600-pixel cap."
      }
    ],
    "ambience": {
      "origin": "Original synthesized ambient pad; no external samples or provider.",
      "frequenciesHz": [
        174.61,
        220,
        261.63
      ],
      "amplitude": 0.004,
      "fadeInSeconds": 1.5,
      "fadeOutSeconds": 2,
      "meanDbfs": -52.8,
      "peakDbfs": -42.9,
      "applicationAudio": false
    }
  },
  "preview": {
    "file": "markdown-preview-cap-before-after.gif",
    "durationSeconds": 33.25,
    "dimensions": [
      864,
      672
    ],
    "audio": false,
    "limitation": "Scaled silent preview; use the MP4 or original screenshots for small UI details."
  },
  "files": {
    "markdown-preview-cap-before-after.mp4": {
      "sha256": "6b5ae2457e044ea0a72a64842284c8ad26ab0ded59fedeeda456a546ec6359d0",
      "bytes": 1517343
    },
    "markdown-preview-cap-poster.jpg": {
      "sha256": "233a9744844e39d531455b3ddb28cd0fc0b4aa8cc0fc11f04713e390a3448f8b",
      "bytes": 109079
    },
    "markdown-preview-cap-captions.vtt": {
      "sha256": "7b892347f2dd1c6aebc198c3e4975c1063f84913f6a7a0027b0ca9f4f871eb66",
      "bytes": 1498
    },
    "markdown-preview-cap-before-after.gif": {
      "sha256": "49963c23bd19ccd9fa00496941c11af2b44c8ba34fc0bb05ad2a506d4054af85",
      "bytes": 1443495
    }
  }
}
