:bug: fix #337 at v3.1.16

CHANGELOG.md

@@ -59,6 +59,7 @@
 
 ### v3.1.16 / 2020-04-2x
 
+* [337](https://github.com/Vanessa219/vditor/issues/337) insertValue 光标错误 `修复缺陷`
 * [324](https://github.com/Vanessa219/vditor/issues/324) 支持多款主题预览 `引入特性`
 
 ### v3.1.15 / 2020-04-21

demo/index.html

@@ -44,8 +44,8 @@
 </h2>
 <h2>
     Vditor for you
-    <button onclick="window.vditor.setTheme('dark', 'native')">Dark</button>
-    <button onclick="window.vditor.setTheme('light', 'github')">Light</button>
+    <button onclick="window.vditor.setTheme('dark', 'dark',  'native')">Dark</button>
+    <button onclick="window.vditor.setTheme('light', 'light', 'github')">Light</button>
 </h2>
 <div id="vditor">
 <h1>Vditor</h1>

src/assets/scss/_content.scss

@@ -84,14 +84,13 @@
     border-left: 1px solid var(--border-color);
     box-sizing: border-box;
     border-radius: 0 0 3px 0;
-    background-color: var(--textarea-background-color);
-    padding: 10px;
 
     & > div::-webkit-scrollbar {
       display: none;
     }
 
     & > .vditor-reset {
+      padding: 10px;
       margin: 0 auto;
     }
   }

src/index.ts

@@ -311,16 +311,18 @@ class Vditor extends VditorMethod {
         } else if (this.vditor.currentMode === "wysiwyg") {
             const range = getEditorRange(this.vditor.wysiwyg.element);
             range.collapse(true);
+            this.vditor.wysiwyg.preventInput = true;
             document.execCommand("insertHTML", false, value);
             if (render) {
-                input(this.vditor, range);
+                input(this.vditor, getSelection().getRangeAt(0));
             }
         } else if (this.vditor.currentMode === "ir") {
             const range = getEditorRange(this.vditor.ir.element);
             range.collapse(true);
+            this.vditor.ir.preventInput = true;
             document.execCommand("insertHTML", false, value);
             if (render) {
-                irInput(this.vditor, range);
+                irInput(this.vditor, getSelection().getRangeAt(0), true);
             }
         }
     }

src/ts/ir/input.ts

@@ -10,10 +10,10 @@ import {processCodeRender} from "../util/processCode";
 import {getSelectPosition, setRangeByWbr} from "../util/selection";
 import {processAfterRender} from "./process";
 
-export const input = (vditor: IVditor, range: Range) => {
+export const input = (vditor: IVditor, range: Range, ignoreSpace = false) => {
     let blockElement = hasClosestBlock(range.startContainer);
-    // 前后可以输入空格，但是 insert html 中有换行需忽略（使用 wbr 标识）
-    if (blockElement && !blockElement.querySelector("wbr")) {
+    // 前后可以输入空格
+    if (blockElement && !ignoreSpace) {
         if (isHrMD(blockElement.innerHTML) || isHeadingMD(blockElement.innerHTML)) {
             return;
         }