codex-overleaf-link 2.3.4 → 2.3.6

package/extension/src/content/runScrollLayout.js

@@ -0,0 +1,124 @@
+(function initRunScrollLayout(root, factory) {
+  if (typeof module === 'object' && module.exports) {
+    module.exports = factory();
+  } else {
+    root.CodexOverleafModuleRegistry.define('RunScrollLayout', [], factory);
+  }
+})(typeof window !== 'undefined' ? window : globalThis, function runScrollLayoutFactory() {
+  'use strict';
+
+  const READING_ANCHORS = '.run-final-answer p, .run-final-answer li, .run-final-answer pre, .run-final-answer h1, .run-final-answer h2, .run-final-answer h3, .run-stream p, .run-stream li, .run-stream pre, [data-run-task], [data-run-status]';
+
+  function create({ getScroller, onLayoutChange, isFollowing = () => true, window: host = globalThis } = {}) {
+    let current = null;
+    let resizeObserver = null;
+    let mutationObserver = null;
+    let anchor = null;
+    let extent = '';
+
+    function measure() { return current ? `${current.scrollHeight}:${current.clientHeight}` : ''; }
+
+    function captureAnchor(force = false) {
+      if (!current || isFollowing()) { anchor = null; return; }
+      // A layout-induced scroll can arrive before ResizeObserver. Keep the
+      // pre-layout anchor until notify has compensated its displacement.
+      if (!force && extent !== measure()) return;
+      const bounds = current.getBoundingClientRect?.();
+      if (!bounds) return;
+      const nodes = current.querySelectorAll?.(READING_ANCHORS) || [];
+      anchor = null;
+      for (const node of nodes) {
+        const rect = node.getBoundingClientRect();
+        if (rect.height > 0 && rect.bottom > bounds.top && rect.top < bounds.bottom) {
+          anchor = { node, offset: rect.top - bounds.top };
+          break;
+        }
+      }
+    }
+
+    function restoreAnchor() {
+      if (isFollowing() || !anchor || !current.contains?.(anchor.node)) return;
+      const rect = anchor.node.getBoundingClientRect();
+      if (!rect.height) return;
+      const delta = rect.top - current.getBoundingClientRect().top - anchor.offset;
+      if (Math.abs(delta) > 0.5) current.scrollTop += delta;
+    }
+
+    function snapshot() {
+      captureAnchor();
+      const run = anchor?.node.closest?.('[data-run-id]');
+      return { scrollTop: current?.scrollTop || 0, runId: run?.dataset?.runId || '',
+        index: run ? Array.from(run.querySelectorAll(READING_ANCHORS)).indexOf(anchor.node) : -1,
+        offset: anchor?.offset || 0 };
+    }
+
+    function restore(reading) {
+      if (!current || !reading) return;
+      current.scrollTop = reading.scrollTop;
+      // History repaint replaces nodes. Rebind by run identity and paragraph
+      // position; a missing anchor falls back to the saved scroll offset.
+      const run = Array.from(current.querySelectorAll?.('[data-run-id]') || [])
+        .find(node => node.dataset.runId === reading.runId);
+      const node = run?.querySelectorAll(READING_ANCHORS)[reading.index];
+      anchor = node ? { node, offset: reading.offset } : null;
+      restoreAnchor();
+      extent = measure();
+      captureAnchor(true);
+    }
+
+    function dispose() {
+      resizeObserver?.disconnect();
+      mutationObserver?.disconnect();
+      resizeObserver = null;
+      mutationObserver = null;
+      current = null;
+      anchor = null;
+      extent = '';
+    }
+
+    function notify() {
+      if (!current) return;
+      const active = getScroller();
+      if (active !== current) {
+        bind(active);
+        return;
+      }
+      restoreAnchor();
+      extent = measure();
+      onLayoutChange(current);
+      captureAnchor(true);
+    }
+
+    function bind(scroller) {
+      if (scroller === current) return;
+      dispose();
+      if (!scroller || typeof host.ResizeObserver !== 'function') return;
+      current = scroller;
+      extent = measure();
+      captureAnchor(true);
+      resizeObserver = new host.ResizeObserver(notify);
+      resizeObserver.observe(scroller);
+      // Observe run-sized children, rather than every streaming text node.
+      for (const child of scroller.children || []) resizeObserver.observe(child);
+      if (typeof host.MutationObserver === 'function') {
+        mutationObserver = new host.MutationObserver(records => {
+          if (current !== scroller) return;
+          for (const record of records) {
+            for (const node of record.removedNodes) {
+              if (node.nodeType === 1) resizeObserver.unobserve(node);
+            }
+            for (const node of record.addedNodes) {
+              if (node.nodeType === 1) resizeObserver.observe(node);
+            }
+          }
+          notify();
+        });
+        mutationObserver.observe(scroller, { childList: true });
+      }
+    }
+
+    return Object.freeze({ bind, dispose, captureAnchor, snapshot, restore });
+  }
+
+  return Object.freeze({ create });
+});

package/extension/src/content/runTimelineView.js

@@ -14,6 +14,8 @@
     const {
       RunGuidanceView,
       RunResultActions,
+      RunScrollLayout,
+      RunFailureNotice,
       tr,
       tx,
       getLocale,
@@ -48,6 +50,7 @@
 
   let logAutoFollow = true;
   let userScrollIntentUntil = 0;
+  let userScrollExtent = '';
   // Scroll engine: a single rAF coalesces a burst of scroll requests into one
   // write per frame (streaming can fire ~25/sec); `scrollLogPendingForce`
   // survives that coalesce so a forced scroll is never lost. `unreadSinceDetach`
@@ -60,6 +63,12 @@
   // reads a static "Processing…" and the user can't tell a working run from a
   // hung one — the single highest-value streaming signal per competitor UX.
   let runElapsedTimer = null;
+  const scrollLayout = RunScrollLayout?.create({
+    getScroller: getLogScrollContainer,
+    isFollowing: () => logAutoFollow,
+    onLayoutChange: scroller => logAutoFollow ? scrollLogToBottom() : updateJumpToLatestButton(scroller)
+  });
+  const failureNotice = RunFailureNotice?.create({ tr, projectRunSettlement, sanitizeText: sanitizeAssistantVisibleText });
 
   // Re-arm auto-follow (called by the runtime when a new run starts, so the
   // log snaps back to following the live stream).
@@ -70,6 +79,7 @@
 
   function bindLogAutoFollow() {
     const scroller = getLogScrollContainer();
+    scrollLayout?.bind(scroller);
     if (!scroller || scroller.dataset.autoFollowBound === 'true') {
       return;
     }
@@ -79,15 +89,14 @@
     scroller.addEventListener('pointerdown', markUserScrollIntent, { passive: true });
     scroller.addEventListener('keydown', event => {
       if (['ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End', ' '].includes(event.key)) {
-        markUserScrollIntent();
+        markUserScrollIntent(event);
       }
     });
     scroller.addEventListener('scroll', () => {
-      if (Date.now() <= userScrollIntentUntil) {
+      if (Date.now() <= userScrollIntentUntil && userScrollExtent === `${scroller.scrollHeight}:${scroller.clientHeight}`) {
         logAutoFollow = isLogNearBottom(scroller);
-      } else if (isLogNearBottom(scroller)) {
-        logAutoFollow = true;
       }
+      scrollLayout?.captureAnchor();
       // Reveal / hide the floating "jump to latest" button the instant the
       // user detaches from or re-reaches the bottom.
       updateJumpToLatestButton(scroller);
@@ -125,6 +134,7 @@
     if (!el) {
       return;
     }
+    if (el.dataset) el.dataset.logAutoFollow = logAutoFollow ? 'true' : 'false';
     const button = ensureJumpToLatestButton();
     if (!button) {
       return;
@@ -157,8 +167,16 @@
     return getPanel()?.querySelector('[data-log]') || getPanel()?.querySelector('[data-main]');
   }
 
-  function markUserScrollIntent() {
+  function markUserScrollIntent(event) {
+    const scroller = getLogScrollContainer();
+    if (!scroller || (event?.type === 'pointerdown' && event.target !== scroller)) return;
+    if (event?.target?.closest?.('input, textarea, select, [contenteditable="true"]')) return;
     userScrollIntentUntil = Date.now() + 1200;
+    userScrollExtent = `${scroller.scrollHeight}:${scroller.clientHeight}`;
+    if ((event?.type === 'wheel' && event.deltaY < 0) || ['ArrowUp', 'PageUp', 'Home'].includes(event?.key)) {
+      logAutoFollow = false;
+      scrollLogPendingForce = false;
+    }
   }
 
   function isLogNearBottom(log) {
@@ -181,7 +199,7 @@
       userScrollIntentUntil = 0;
       unreadSinceDetach = 0;
       scrollLogPendingForce = true;
-    } else if (!(logAutoFollow || isLogNearBottom(scroller))) {
+    } else if (!logAutoFollow) {
       // The user has scrolled up: do not yank them. Just keep the jump button
       // state current.
       updateJumpToLatestButton(scroller);
@@ -195,7 +213,7 @@
       }
       // Re-check intent AT PAINT TIME: a user who flicked up between schedule
       // and paint must not be snapped back down (closes the one-frame fight).
-      if (scrollLogPendingForce || logAutoFollow || isLogNearBottom(el)) {
+      if (scrollLogPendingForce || logAutoFollow) {
         setLogScrollPosition(el);
       }
       scrollLogPendingForce = false;
@@ -284,11 +302,13 @@
     }
     return tr('processed', { elapsed });
   }
-  function renderRunHistory() {
+  function renderRunHistory(options = {}) {
     const log = getPanel()?.querySelector('[data-log]');
     if (!log) {
       return;
     }
+    const reading = options.preserveScroll === true && !logAutoFollow
+      ? scrollLayout?.snapshot() || { scrollTop: log.scrollTop } : null;
     log.replaceChildren();
     if (!getState().runs?.length) {
       const empty = document.createElement('div');
@@ -317,7 +337,8 @@
     for (const run of runs) {
       log.append(renderRunCard(run));
     }
-    scrollLogToBottom({ force: true });
+    if (reading) { log.scrollTop = reading.scrollTop; scrollLayout?.restore(reading); updateJumpToLatestButton(log); }
+    else scrollLogToBottom({ force: true });
   }
 
   function renderRunCard(run) {
@@ -637,7 +658,7 @@
       if (row.key) dt.dataset.metaKey = row.key;
       const dd = document.createElement('dd');
       dd.className = 'run-final-answer__meta-value';
-      dd.textContent = row.value;
+      dd.textContent = failureNotice?.formatMetaValue(report, row) ?? row.value;
       metaBlock.append(dt, dd);
     }
     if (metaBlock.children.length) {
@@ -714,6 +735,7 @@
         report.append(main);
       }
 
+      failureNotice?.append(report, event, run);
       appendCompletionMetaBlock(report, structured.meta);
       appendCompileFix(report);
       appendRejectedRedo(report);
@@ -735,6 +757,7 @@
     report.append(body);
     appendCompileFix(report);
     appendRejectedRedo(report);
+    failureNotice?.append(report, event, run);
     appendCompletionMetaBlock(report, split.meta);
     appendRecoveryActionForFailure(report, event, run);
     return report;
@@ -793,6 +816,9 @@
   }
 
   function appendRecoveryActionForFailure(report, event, run) {
+    const recovery = failureNotice?.prepareRecovery(report, { openFile: openProjectFileForFailure });
+    if (recovery?.handled) return;
+    report = recovery?.target || report;
     const failureCode = event?.failure?.code || '';
     if (RETRYABLE_FAILURE_CODES.has(failureCode) && typeof refillComposerForRetry === 'function') {
       const retry = buildRecoveryButton(failureCode,

package/extension/src/content/settingsPanel.js

@@ -95,18 +95,18 @@
           </details>
           <details class="codex-set-group" data-set-group="experimental">
             <summary class="codex-set-group-head">
-              <span class="codex-set-group-title">${codexSetIcon('flask')}<span data-i18n="experimentalTitle">Experimental</span></span>
+              <span class="codex-set-group-title">${codexSetIcon('database')}<span data-i18n="otSettingsTitle">Project cache</span></span>
               <span class="codex-set-saved" data-set-saved hidden>✓ <span data-i18n="settingsSaved">Saved</span></span>
             </summary>
             <div class="codex-set-card">
               <label class="codex-project-settings-row codex-project-settings-row--switch">
                 <span class="codex-project-settings-row-label">
-                  <span data-i18n="experimentalOtMenuTitle">Experimental OT Mirror</span>
-                  <small class="codex-set-row-sub" data-i18n="experimentalOtMenuSubtitle">Experimental — speeds up reading the file you are editing; Codex falls back to normal reading whenever unsure.</small>
+                  <span data-i18n="experimentalOtMenuTitle">OT Mirror</span>
+                  <small class="codex-set-row-sub" data-i18n="experimentalOtMenuSubtitle">Warms recent edits to the active text file locally. File scope and freshness are checked before reuse.</small>
                 </span>
                 <input type="checkbox" class="codex-switch" data-experimental-ot>
               </label>
-              <p class="codex-set-row-help" data-experimental-ot-menu-status></p>
+              <p class="codex-set-row-help" data-experimental-ot-menu-status aria-live="polite"></p>
             </div>
           </details>
         </div>
@@ -159,17 +159,25 @@
               <button type="button" class="codex-set-btn" data-provider-settings-open data-i18n="providerSettingsConfigure">Configure</button>
             </div>
           </details>
+          <details class="codex-set-group" data-set-group="context-loading" open>
+            <summary class="codex-set-group-head">
+              <span class="codex-set-group-title">${codexSetIcon('database')}<span data-i18n="contextLoadingTitle">Context loading</span></span>
+              <span class="codex-set-saved" data-set-saved hidden>✓ <span data-i18n="settingsSaved">Saved</span></span>
+            </summary>
+            <div class="codex-set-card">
+              <label class="codex-project-settings-row codex-project-settings-row--switch">
+                <span class="codex-project-settings-row-label" data-i18n="preloadProjectContextTitle">Preload project context</span>
+                <input type="checkbox" class="codex-switch" data-preload-project-context>
+              </label>
+              <p class="codex-set-row-help" data-i18n="preloadProjectContextDescription">Fetch the exact project file list in the background after an Overleaf project becomes idle.</p>
+            </div>
+          </details>
           <details class="codex-set-group" data-set-group="updates" open>
             <summary class="codex-set-group-head">
               <span class="codex-set-group-title">${codexSetIcon('software')}<span data-i18n="softwareUpdatesTitle">Software updates</span></span>
             </summary>
             <div class="codex-set-card" data-update-settings>
               <div class="codex-set-row">
-                <label class="codex-project-settings-row codex-project-settings-row--switch">
-                  <span class="codex-project-settings-row-label" data-i18n="preloadProjectContextTitle">Preload project context</span>
-                  <input type="checkbox" class="codex-switch" data-preload-project-context>
-                </label>
-                <p class="codex-set-row-help" data-i18n="preloadProjectContextDescription">Fetch the exact project file list in the background after an Overleaf project becomes idle.</p>
                 <p class="codex-set-row-help" data-update-settings-summary data-i18n="softwareUpdatesHelp">Automatically checks signed stable releases for the Extension and Native Host.</p>
                 <p class="codex-set-note" data-update-settings-state aria-live="polite" hidden></p>
                 <button type="button" class="codex-set-btn" data-check-updates data-i18n="checkForUpdates">Check for updates</button>
@@ -235,8 +243,11 @@
         instance.callbacks.onHistoryOpen?.();
       }
     });
+    container.querySelector('[data-storage-card]')?.addEventListener('toggle', event => {
+      if (event.target.open) instance.callbacks.onStorageOpen?.();
+    });
     container.querySelector('[data-history-filter]')?.addEventListener('input', () => instance.callbacks.onHistoryFilter?.());
-    // Experimental OT mirror: a single visible switch. The click is
+    // OT mirror: a single visible switch; legacy storage/DOM keys are retained. The click is
     // intercepted (the runtime's handler preventDefaults, runs the enable
     // confirmation, then sets checked + drives the change flow itself) so the
     // confirm-before-enable contract survives the control unification.
@@ -251,10 +262,17 @@
     for (const selector of ['[data-governance-readonly-patterns]', '[data-governance-writable-patterns]', '[data-sensitive-check-enabled]', '[data-sensitive-confirm-allowed]', '[data-preload-project-context]', '[data-load-codex-local-skills]', '[data-load-codex-overleaf-skills]', '[data-theme-select]', '[data-language-select]']) {
       const element = container.querySelector(selector);
       element?.addEventListener?.('change', event => {
-        instance.callbacks.onInputChange?.(event);
-        flashSaved(instance, event);
+        Promise.resolve(instance.callbacks.onInputChange?.(event))
+          .then(() => {
+            flashSaved(instance, event);
+            if (selector === '[data-language-select]' && container.querySelector('[data-storage-card]')?.open) {
+              instance.callbacks.onStorageOpen?.();
+            }
+          }).catch(() => {});
+      });
+      element?.addEventListener?.('input', event => {
+        Promise.resolve(instance.callbacks.onInputChange?.(event)).catch(() => {});
       });
-      element?.addEventListener?.('input', event => instance.callbacks.onInputChange?.(event));
     }
     // Guardrails: live, non-blocking analysis of the protection globs.
     for (const selector of ['[data-governance-readonly-patterns]', '[data-governance-writable-patterns]']) {
@@ -265,6 +283,7 @@
     setupGroupPersistence(instance);
 
     return {
+      get container() { return instance.container; },
       show: () => show(instance),
       hide: () => hide(instance),
       loadState: state => loadState(instance, state),

package/extension/src/content/themeController.js

@@ -51,6 +51,9 @@
     const resolved = resolveTheme(preference, mediaQueryList);
     if (panelRoot && typeof panelRoot.setAttribute === 'function') {
       panelRoot.setAttribute('data-theme', resolved);
+      for (const target of panelRoot.ownerDocument?.querySelectorAll?.('.codex-provider-dialog-root, #codex-overleaf-launcher') || []) {
+        target.setAttribute('data-theme', resolved);
+      }
     }
     return resolved;
   }

package/extension/src/content/updateNotice.js

@@ -90,7 +90,8 @@
         install: 'codex-overleaf/consent-update-install',
         retry: 'codex-overleaf/consent-update-check',
         later: 'codex-overleaf/consent-update-later',
-        dismiss: 'codex-overleaf/consent-update-dismiss'
+        dismiss: 'codex-overleaf/consent-update-dismiss',
+        reload: 'codex-overleaf/consent-update-reload'
       }[action]);
     } catch (error) {
       currentView = await reconcileAfterActionError(error, {
@@ -212,7 +213,10 @@
     const stateName = currentView?.state?.state || 'idle';
     let requestedAction = 'check';
     try {
-      if (stateName === 'update_available') {
+      if (['reload_required', 'reload_tabs_required'].includes(stateName)) {
+        requestedAction = 'reload';
+        currentView = await request('codex-overleaf/consent-update-reload');
+      } else if (stateName === 'update_available') {
         requestedAction = 'install';
         currentView = await request('codex-overleaf/consent-update-install');
       } else if (['failed', 'rolled_back'].includes(stateName)) {
@@ -276,7 +280,7 @@
       body.append(recovery, command);
     }
 
-    if (!['update_available', 'failed', 'rolled_back'].includes(state.state)) {
+    if (!['update_available', 'failed', 'rolled_back', 'reload_required', 'reload_tabs_required'].includes(state.state)) {
       const bar = document.createElement('div');
       bar.className = 'codex-update-notice-progress' + (progress.determinate ? '' : ' is-indeterminate');
       bar.setAttribute('role', 'progressbar');
@@ -328,7 +332,11 @@
     let statusText = '';
     let buttonText = tx('Check for updates', '检查更新');
 
-    if (stateName === 'checking') {
+    if (['reload_required', 'reload_tabs_required'].includes(stateName)) {
+      summaryText = tx(`Installed v${latestVersion}; running extension v${currentVersion}.`, `已安装 v${latestVersion}；扩展当前运行 v${currentVersion}。`);
+      statusText = getCopy(state).detail;
+      buttonText = stateName === 'reload_required' ? tx('Reload extension', '重新加载扩展') : tx('Refresh Overleaf tabs', '刷新 Overleaf 标签页');
+    } else if (stateName === 'checking') {
       statusText = tx('Checking the latest stable release…', '正在检查最新稳定版本…');
       buttonText = tx('Checking…', '检查中…');
     } else if (stateName === 'update_available') {
@@ -355,6 +363,10 @@
 
   function visibleActions(state) {
     if (actionInFlight) return [];
+    if (['reload_required', 'reload_tabs_required'].includes(state)) {
+      return [{ id: 'reload', label: state === 'reload_required'
+        ? tx('Reload extension', '重新加载扩展') : tx('Refresh Overleaf tabs', '刷新 Overleaf 标签页'), primary: true }];
+    }
     if (state === 'update_available') {
       return [
         { id: 'later', label: tx('Later', '稍后'), primary: false },
@@ -380,6 +392,14 @@
     const target = state.latestVersion ? 'v' + state.latestVersion : '';
     const blocker = blockersCopy(state.blockers?.length ? state.blockers : [state.blocker]);
     return {
+      reload_required: {
+        eyebrow: tx('Installed, awaiting reload', '已安装，等待加载'), title: target,
+        detail: state.message || tx('The new files are installed. Reload the extension when Overleaf is saved and idle.', '新版文件已安装，请在 Overleaf 保存并空闲后重新加载扩展。')
+      },
+      reload_tabs_required: {
+        eyebrow: tx('Updated runtime is ready', '新版运行组件已就绪'), title: target,
+        detail: state.message || tx('Refresh the saved, idle Overleaf tabs to load the updated panel.', '刷新已保存且空闲的 Overleaf 标签页以加载新版面板。')
+      },
       update_available: {
         eyebrow: tx('Update available', '发现新版本'),
         title: target,