From 7ac93b972bffdfac3e1afb1269b963f8b6b26d95 Mon Sep 17 00:00:00 2001 From: moshangqi <2509678669@qq.com> Date: Fri, 1 Dec 2023 11:07:26 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=89=AA=E8=97=8F?= =?UTF-8?q?=E8=AF=AD=E9=9B=80=E5=86=85=E5=AE=B9=E5=88=97=E8=A1=A8=E4=B8=A2?= =?UTF-8?q?=E5=A4=B1=E9=97=AE=E9=A2=98=20&=20=E4=BC=98=E5=8C=96=E6=8F=92?= =?UTF-8?q?=E4=BB=B6=E6=80=A7=E8=83=BD=20&=20=E4=BC=98=E5=8C=96=E4=B8=8A?= =?UTF-8?q?=E4=BC=A0=E5=A4=B1=E8=B4=A5=E6=8F=90=E7=A4=BA=E6=96=87=E6=A1=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 8 ++-- .../SuperSideBar/impl/ClipAssistant/index.tsx | 8 +++- src/core/transform-dom.ts | 40 ++++++++++++------- src/pages/inject/content-scripts.ts | 26 ++++++------ 4 files changed, 48 insertions(+), 34 deletions(-) diff --git a/package.json b/package.json index 55314833..94d47af2 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,12 @@ { "name": "yuque-chrome-extension", - "version": "0.5.2", + "version": "0.5.3", "description": "语雀浏览器插件", "private": true, "releaseNotes": [ - "[特性] 剪藏侧边栏改版", - "[特性] 支持剪藏快捷键操作", - "[特性] 划词新增修饰快捷键" + "[优化] 增加保存失败的提示", + "[修复] 修复插件导致特殊网页卡住问题", + "[修复] 语雀文档剪藏列表丢失情况" ], "repository": { "type": "git", diff --git a/src/components/SuperSideBar/impl/ClipAssistant/index.tsx b/src/components/SuperSideBar/impl/ClipAssistant/index.tsx index f3dad25d..105e75c0 100644 --- a/src/components/SuperSideBar/impl/ClipAssistant/index.tsx +++ b/src/components/SuperSideBar/impl/ClipAssistant/index.tsx @@ -139,8 +139,12 @@ function ClipContent() { backgroundBridge.sidePanel.close(); } editor.setContent(''); - } catch (error) { - message.error(__i18n('保存失败,请重试!')); + } catch (e: any) { + if (e.message === '文档上传未结束! 请删除未上传成功的图片') { + message.error(__i18n('图片正在上传中,请稍后保存')); + } else { + message.error(e.message || __i18n('保存失败,请重试!')); + } } setLoading({ loading: false }); }; diff --git a/src/core/transform-dom.ts b/src/core/transform-dom.ts index 2f606ead..5b213563 100644 --- a/src/core/transform-dom.ts +++ b/src/core/transform-dom.ts @@ -75,6 +75,26 @@ function findYuqueNeTag(element: Element) { return null; } +function findYuqueChildId(element: Element | null) { + let ids: string[] = []; + + if (!element) { + return ids; + } + + element.childNodes.forEach(item => { + const id = (item as Element).id; + if (id) { + ids.push(id); + } else { + const childIds = findYuqueChildId(item as Element); + ids = ids.concat(childIds); + } + }); + + return ids; +} + function isYuqueContent(element: Element) { if (element.closest('.ne-viewer-body') || document.querySelector('.ne-viewer-body')) { return true; @@ -125,26 +145,18 @@ async function transformYuqueContent(element: Element) { }); try { - const ids: string[] = []; + let ids: string[] = []; if (element.classList.contains('ne-viewer-body')) { - element.childNodes.forEach(item => { - const id = (item as Element).id; - if (id) { - ids.push(id); - } - }); + const childIds = findYuqueChildId(element); + ids = ids.concat(childIds); } else if (element.closest('.ne-viewer-body')) { const id = findYuqueNeTag(element)?.id; if (id) { ids.push(id); } } else if (element.querySelector('.ne-viewer-body')) { - element.querySelector('.ne-viewer-body')?.childNodes.forEach(item => { - const id = (item as Element).id; - if (id) { - ids.push(id); - } - }); + const childIds = findYuqueChildId(element.querySelector('.ne-viewer-body')); + ids = ids.concat(childIds); } window.postMessage( @@ -271,7 +283,7 @@ export async function transformDOM(domArray: Element[]) { const imgElements = clonedDOM.querySelectorAll('img'); imgElements.forEach(img => { // 有些 img 采用 srcset 属性去实现,src 中放的其实是小图,所以以 currentSrc 作为渲染的 src - img.setAttribute('src', img.currentSrc); + img.setAttribute('src', img.currentSrc || img.src); }); // 移除 pre code 下的兄弟 diff --git a/src/pages/inject/content-scripts.ts b/src/pages/inject/content-scripts.ts index 78050774..80e7a467 100644 --- a/src/pages/inject/content-scripts.ts +++ b/src/pages/inject/content-scripts.ts @@ -58,6 +58,8 @@ export class App { */ private _shadowRoot: ShadowRoot | null = null; + private rootDiv: HTMLDivElement | null = null; + /** * sidePanel iframe */ @@ -103,6 +105,7 @@ export class App { private initRoot() { const div = document.createElement('div'); + this.rootDiv = div; div.id = 'yuque-extension-root-container'; div.classList.add('yuque-extension-root-container-class'); const css = Chrome.runtime.getURL('content-scripts.css'); @@ -132,20 +135,6 @@ export class App { this.removeLevitateBall = createLevitateBall({ dom: root, }); - // 搜索页二次搜索会清除掉一些 dom ,所以在 init 的时候需要判断我们挂载的 dom 是否还在,如果不在了,重新挂上去 - const observer = new MutationObserver((mutationsList: MutationRecord[]) => { - for (const mutation of mutationsList) { - if (Array.from(mutation.removedNodes).includes(div)) { - this.sidePanelClipReadyPromise = undefined; - document.body.appendChild(div); - } - } - }); - // 监听页面 dom 是否被卸载 - observer.observe(document.body, { - childList: true, - subtree: true, - }); }); } @@ -199,6 +188,15 @@ export class App { private async initSidePanel(): Promise { if (this.initSidePanelPromise) { + // 如果 dom 被卸载掉,延迟 1s 重新将其挂载上去 + if (!document.querySelector('#yuque-extension-root-container') && this.rootDiv) { + document.body.appendChild(this.rootDiv); + await new Promise(resolve => { + setTimeout(() => { + resolve(true); + }, 1000); + }); + } return this.initSidePanelPromise; } this.initSidePanelPromise = new Promise(resolve => {