mpMath: 与微信公众号的斗智之旅(2)

if (formula.inline && formula.range.startContainer != formula.range.endContainer) {
  // 我们在这里处理如下情况, 即 `$` 跨越了多个元素.
  // <p>明显 $</p>
  // <p>|I| = |I_1| + |I_2| + |I_3|</p>
  // <p>$. <svg></svg></p>
  // 如果不做任何处理, 则输出结果丑了一点.
  let startTextNode = formula.range.startContainer;  // 一定是 text.
  let endTextNode = formula.range.endContainer;  // 这也是个 text node.
  let startNode = startTextNode.parentNode;
  let endNode = endTextNode.parentNode;
  formula.range.deleteContents();
  startNode.appendChild(outputNode);
  mergeNode(startNode, endNode);
} else {
  formula.range.deleteContents();
  formula.range.insertNode(outputNode);
}

// https://res.wx.qq.com/mpres/zh_CN/htmledition/js/default~media/appmsg_edit_v2_gray~media/msg_modify_fe.956f1c09.js
handleDOMEvents: {
    compositionstart(Se) {
        // 这里 Se 看起来像是 view.
        const Ae = Se.state.selection.$from;
        if (!Ae.parentOffset) {
            Se.dispatch(Se.state.tr.insertText("\u200B", Ae.pos).setMeta("preserveSafariComposingTextStyle", {
                pos: Ae.pos
            }))
        }
    },
}

// o 一定是 view.
ln.compositionstart = ln.compositionupdate = o => {
    if (!o.composing) {
        o.domObserver.flush();
        let {state: n} = o, a = n.selection.$to;
    }
}

(function findEditorView() {
  const seen = new WeakSet();
  const keyPaths = new Map();

  function scan(obj, path = 'window') {
    if (!obj || seen.has(obj)) return;
    seen.add(obj);

    // 检测目标对象特征
    if (typeof obj === 'object' &&
        'state' in obj &&
        'composing' in obj &&
        obj.state?.doc !== undefined) {
      console.log('Found candidate:', obj);
      console.log('Access path:', path);
      console.log('State snapshot:', JSON.stringify(obj.state, (k, v) =>
        k.startsWith('_') ? undefined : v, 2));
      return;
    }

    // 广度优先搜索对象树
    Object.getOwnPropertyNames(obj).forEach(key => {
      try {
        const val = obj[key];
        if (val && typeof val === 'object') {
          const newPath = `${path}.${key}`;
          if (!keyPaths.has(val)) keyPaths.set(val, newPath);
          scan(val, newPath);
        }
      } catch (e) { /* 忽略权限限制 */ }
    });
  }

  console.warn('开始深度扫描window对象... (可能需要10-30秒)');
  scan(window);
  console.info('扫描完成，检查上方输出的候选对象');
})();

// content-script.js
// 发送消息到扩展，并等待响应
return chrome.runtime.sendMessage({
    action: 'convert',
    input: latexText,
    display: !formula.inline
}).then(response => {
    // 收到响应后，使用响应结果
    let parser = new DOMParser();
    let doc = parser.parseFromString(response.result, 'text/html');
    let outputNode = doc.body.firstChild;
});

// popup.js
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    if (message.action === 'convert') {
        console.log("receiver convert message", message);
        var result = formula2Svg(message.input, message.display);
        var outerHTML = svg2outHTML(result, message.input, message.display);
        sendResponse({result: outerHTML});
    }
});

// client.js
// key: reqid, value: (resolve, reject)
var pendingRpcRequests = {};

function formula2SvgPromise(latexText, display) {
    let reqid = 'req_' + Math.random().toString(36);
    let { promise, resolve, reject } = Promise.withResolvers();
    pendingRpcRequests[reqid] = { resolve, reject };

    var outputNode = getMathOutputNode();
    let options = MathJax.getMetricsFor(outputNode);
    options.display = display;
    srvframe = document.getElementById('hidva_com_mathjax_server');
    srvframe.contentWindow.postMessage({
        reqid: reqid,
        type: 'convert',
        latex_input: latexText,
        options: options
    }, '*');
    return promise;
}

window.addEventListener('message', function (event) {
    if (!event.data.type || !event.data.reqid || !event.data.resp || event.data.type != 'convert') {
        console.log("hidva.com: unknown event", event);
        return;
    }
    console.log("hidva.com: rece convert resp: ", event.data);
    pendingRpcRequests[event.data.reqid].resolve(event.data.resp);
    delete pendingRpcRequests[event.data.reqid];
});


// server.js
window.addEventListener('message', function (event) {
  if (!event.data.type || !event.data.reqid) {
    console.log("hidva.com: unknown event", event);
    return;
  }
  var reqid = event.data.reqid;
  if (event.data.type == 'convert') {
     console.log("hidva.com: receive convert", event);
     var latex_node = formula2Svg(event.data.latex_input, event.data.options);
     event.source.postMessage({
       reqid: reqid,
       type: 'convert',
       resp: latex_node.outerHTML
     }, '*');
     return;
  }
  console.log("hidva.com: unknown event", event);
  return;
});