Add Read "raw_content" contentEditable Element & Edit

contents/read.ts

@@ -1,3 +1,5 @@
+import { formatHTML } from "~utils/html";
+
 const getTitle = () => {
   const title = document.title;
   const metaTitle = document.querySelector<HTMLMetaElement>(`meta[name="title"]`);
@@ -114,6 +116,92 @@ const getTags = () => {
   return "";
 }
 
+const getHTML = () => {
+  // 微信
+  if (location.host === "mp.weixin.qq.com") {
+    console.log("微信");
+
+    return document.querySelector(".rich_media_content").innerHTML;
+  }
+
+  // 腾讯云开发者社区
+  if (location.host === "cloud.tencent.com") {
+    console.log("腾讯云");
+
+    return formatHTML(document.querySelector(".rno-markdown").innerHTML, (doc) => {
+      // 替换掉腾讯云自己的链接
+      const qcloudLinkEl = doc.querySelectorAll("a");
+      qcloudLinkEl.forEach((el) => {
+        if (el.href.includes("qcloud")) {
+          el.parentNode.replaceChild(document.createTextNode(el.innerText), el);
+        }
+      });
+
+      const mdTextEl = doc.querySelectorAll(".rno-markdown__textlink-new") as NodeListOf<HTMLElement>;
+      mdTextEl.forEach((el) => {
+        el.parentNode.replaceChild(document.createTextNode(el.innerText), el);
+      });
+    });
+  }
+
+  // 掘金
+  const itemPropArticle = document.querySelector("[itemprop=articleBody] .markdown-body");
+
+  if (itemPropArticle) {
+    console.log("掘金");
+
+    return formatHTML(itemPropArticle.innerHTML);
+  }
+
+  // CSDN
+  const contentViews = document.getElementById("content_views");
+
+  if (contentViews) {
+    console.log("CSDN");
+
+    return formatHTML(contentViews.innerHTML);
+  }
+
+  // 通用模式
+  const articleEl = document.querySelector("article");
+
+  if (articleEl) {
+    console.log("文章标签");
+
+    return formatHTML(articleEl.innerHTML);
+  }
+
+  // 尝试匹配到文章
+  const firstParagraph = document.querySelector("p");
+
+  let continueFindCorrectParent = true;
+  let parentEl;
+  let limitCount = 0;
+
+  if (firstParagraph) {
+    while (continueFindCorrectParent) {
+      if (limitCount > 20) {
+        continueFindCorrectParent = false;
+        throw new Error("DOM 层级检测遍历次数过多");
+      }
+
+      limitCount += 1;
+
+      parentEl = parentEl ? parentEl.parentElement : firstParagraph.parentElement;
+
+      // 这个父下面有多个疑似正文的元素
+      if (Array.from(parentEl.querySelectorAll("h2, h3, h4, p")).length > 1) {
+        console.log(parentEl, `匹配结束，向上遍历 ${limitCount} 次`);
+        continueFindCorrectParent = false;
+      }
+    }
+
+    return formatHTML(parentEl.innerHTML);
+  }
+
+  return "";
+}
+
 chrome.runtime.onMessage.addListener((req, sender, send) => {
   if (req.type === "toolbox:getInfo") {
     send({
@@ -124,6 +212,7 @@ chrome.runtime.onMessage.addListener((req, sender, send) => {
       image: getImage(),
       sitename: getSiteName(),
       tags: getTags(),
+      raw_content: getHTML(),
     });
   }
 });