ep_vim 0.12.1 → 0.12.3

package/README.md

@@ -19,7 +19,7 @@ A vim-mode plugin for [Etherpad](https://etherpad.org/). Adds modal editing with
 - **Line operations** — `dd`, `cc`, `yy`, `D`, `J` (join), `Y` (yank line)
 - **Registers** — `"a`–`"z` named registers for yank/delete/put, `"_` blackhole register
 - **Put** — `p` / `P` with linewise and characterwise register handling
-- **Editing** — `i` `a` `A` `I` (insert/append), `x`, `r`, `s`, `S`, `C`, `o`, `O`, `~` (toggle case)
+- **Editing** — `i` `a` `A` `I` (insert/append), `x`, `X`, `r`, `s`, `S`, `C`, `o`, `O`, `~` (toggle case)
 - **Marks** — `m{a-z}` to set, `'{a-z}` / `` `{a-z} `` to jump
 - **Search** — `/` and `?` forward/backward, `n`/`N` repeat, `*`/`#` search word under cursor
 - **Scrolling** — `zz`/`zt`/`zb` center/top/bottom, `Ctrl+d`/`Ctrl+u` half-page, `Ctrl+f`/`Ctrl+b` full-page (requires ctrl keys enabled)
@@ -30,8 +30,12 @@ A vim-mode plugin for [Etherpad](https://etherpad.org/). Adds modal editing with
 - **Toggle** — toolbar button to enable/disable vim mode, persisted in localStorage; settings panel for system clipboard and ctrl key behavior
 
 ## Differences from vi
+The following are not planned, but PRs are welcome.
 
-- **No command line, macros, or globals** - these are not planned, but PRs welcome.
+- **No command line, macros, or globals** 
+- **No visual block mode**  
+- **No indentation operators** — `>>`, `<<`, and `>` / `<` in visual mode
+- **No increment/decrement** — `Ctrl+a` and `Ctrl+x` 
 
 ## Installation
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ep_vim",
-  "version": "0.12.1",
+  "version": "0.12.3",
   "description": "Vim-mode plugin for Etherpad with modal editing, motions, and operators",
   "author": {
     "name": "Seth Rothschild",
@@ -25,7 +25,7 @@
     "ep_etherpad-lite": ">=1.8.6"
   },
   "scripts": {
-    "test": "npm run format && node --test static/js/vim-core.test.js static/js/index.test.js",
+    "test": "npm run format && node --test static/js/vim-core.test.js static/js/motions.test.js static/js/operators.test.js static/js/insert.test.js static/js/visual.test.js static/js/paste_registers.test.js static/js/search.test.js static/js/misc.test.js",
     "format": "prettier -w static/js/*"
   },
   "engines": {

package/static/js/index.js

@@ -704,9 +704,9 @@ commands.normal["v"] = ({ editorInfo, rep, line, char }) => {
   updateVisualSelection(editorInfo, rep);
 };
 
-commands.normal["V"] = ({ editorInfo, rep, line }) => {
-  state.visualAnchor = [line, 0];
-  state.visualCursor = [line, 0];
+commands.normal["V"] = ({ editorInfo, rep, line, char }) => {
+  state.visualAnchor = [line, char];
+  state.visualCursor = [line, char];
   state.mode = "visual-line";
   updateVisualSelection(editorInfo, rep);
 };
@@ -786,6 +786,16 @@ commands["visual-line"]["a"] = () => {
   state.pendingKey = "a";
 };
 
+const swapVisualEnds = ({ editorInfo, rep }) => {
+  const tmp = state.visualAnchor;
+  state.visualAnchor = state.visualCursor;
+  state.visualCursor = tmp;
+  updateVisualSelection(editorInfo, rep);
+};
+
+commands["visual-char"]["o"] = swapVisualEnds;
+commands["visual-line"]["o"] = swapVisualEnds;
+
 commands.normal["gv"] = ({ editorInfo, rep }) => {
   if (!state.lastVisualSelection) return;
   const { anchor, cursor, mode } = state.lastVisualSelection;
@@ -869,6 +879,18 @@ commands.normal["x"] = ({ editorInfo, rep, line, char, lineText, count }) => {
   }
 };
 
+commands.normal["X"] = ({ editorInfo, rep, line, char, lineText, count }) => {
+  if (char > 0) {
+    const deleteCount = Math.min(count, char);
+    const startChar = char - deleteCount;
+    setRegister(lineText.slice(startChar, char));
+    replaceRange(editorInfo, [line, startChar], [line, char], "");
+    const newLineText = getLineText(rep, line);
+    moveBlockCursor(editorInfo, line, clampChar(startChar, newLineText));
+    recordCommand("X", count);
+  }
+};
+
 commands.normal["p"] = ({ editorInfo, line, char, lineText, count }) => {
   const reg = getActiveRegister();
   if (reg !== null) {
@@ -1290,9 +1312,9 @@ exports.aceKeyEvent = (_hookName, { evt, rep, editorInfo }) => {
         cursor: state.visualCursor,
         mode: "visual-line",
       };
-      const line = Math.min(state.visualAnchor[0], state.visualCursor[0]);
+      const [vLine, vChar] = state.visualCursor;
       state.mode = "normal";
-      moveBlockCursor(editorInfo, line, 0);
+      moveBlockCursor(editorInfo, vLine, vChar);
     } else if (state.mode === "visual-char") {
       state.lastVisualSelection = {
         anchor: state.visualAnchor,

package/static/js/insert.test.js

@@ -0,0 +1,198 @@
+"use strict";
+
+const { describe, it, beforeEach } = require("node:test");
+const assert = require("node:assert/strict");
+
+// Mock navigator for clipboard operations
+global.navigator = {
+  clipboard: {
+    writeText: () => Promise.resolve(),
+  },
+};
+
+const {
+  _state: state,
+  _handleKey: handleKey,
+  _commands: commands,
+  _parameterized: parameterized,
+  _setVimEnabled: setVimEnabled,
+  _setUseCtrlKeys: setUseCtrlKeys,
+  aceKeyEvent,
+} = require("./index.js");
+
+const makeRep = (lines) => ({
+  lines: {
+    length: () => lines.length,
+    atIndex: (n) => ({ text: lines[n] }),
+  },
+});
+
+const makeMockEditorInfo = () => {
+  const calls = [];
+  return {
+    editorInfo: {
+      ace_inCallStackIfNecessary: (_name, fn) => fn(),
+      ace_performSelectionChange: (start, end, _flag) => {
+        calls.push({ type: "select", start, end });
+      },
+      ace_updateBrowserSelectionFromRep: () => {},
+      ace_performDocumentReplaceRange: (start, end, newText) => {
+        calls.push({ type: "replace", start, end, newText });
+      },
+    },
+    calls,
+  };
+};
+
+// ---------------------------------------------------------------------------
+
+const resetState = () => {
+  state.mode = "normal";
+  state.pendingKey = null;
+  state.pendingCount = null;
+  state.countBuffer = "";
+  state.register = null;
+  state.namedRegisters = {};
+  state.pendingRegister = null;
+  state.awaitingRegister = false;
+  state.marks = {};
+  state.lastCharSearch = null;
+  state.visualAnchor = null;
+  state.visualCursor = null;
+  state.editorDoc = null;
+  state.currentRep = null;
+  state.desiredColumn = null;
+  state.lastCommand = null;
+  state.searchMode = false;
+  state.searchBuffer = "";
+  state.searchDirection = null;
+  state.lastSearch = null;
+  state.lastVisualSelection = null;
+};
+
+describe("insert mode commands", () => {
+  beforeEach(() => {
+    state.mode = "normal";
+    state.pendingKey = null;
+    state.pendingCount = null;
+    state.countBuffer = "";
+    state.register = null;
+    state.marks = {};
+    state.lastCharSearch = null;
+    state.visualAnchor = null;
+    state.visualCursor = null;
+    state.editorDoc = null;
+    state.currentRep = null;
+    state.desiredColumn = null;
+    state.lastCommand = null;
+    state.searchMode = false;
+    state.searchBuffer = "";
+    state.searchDirection = null;
+    state.lastSearch = null;
+  });
+
+  it("i enters insert mode at cursor", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 2, lineText: "hello" };
+    commands.normal["i"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("a enters insert mode after cursor", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 2, lineText: "hello" };
+    commands.normal["a"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("A enters insert mode at end of line", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 2, lineText: "hello" };
+    commands.normal["A"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("I enters insert mode at first non-blank", () => {
+    const rep = makeRep(["  hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 2, lineText: "  hello" };
+    commands.normal["I"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("o opens line below", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo, calls } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 0, lineText: "hello" };
+    commands.normal["o"](ctx);
+
+    assert.equal(state.mode, "insert");
+    assert.equal(calls.length, 2);
+  });
+
+  it("O opens line above", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo, calls } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 0, lineText: "hello" };
+    commands.normal["O"](ctx);
+
+    assert.equal(state.mode, "insert");
+    assert.equal(calls.length, 2);
+  });
+
+  it("s replaces character and enters insert", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 1,
+      lineText: "hello",
+      count: 1,
+    };
+    commands.normal["s"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("S replaces entire line and enters insert", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = { rep, editorInfo, line: 0, char: 2, lineText: "hello" };
+    commands.normal["S"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+
+  it("C changes to end of line and enters insert", () => {
+    const rep = makeRep(["hello world"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 6,
+      lineText: "hello world",
+    };
+    commands.normal["C"](ctx);
+
+    assert.equal(state.mode, "insert");
+  });
+});

package/static/js/misc.test.js

@@ -0,0 +1,363 @@
+"use strict";
+
+const { describe, it, beforeEach } = require("node:test");
+const assert = require("node:assert/strict");
+
+// Mock navigator for clipboard operations
+global.navigator = {
+  clipboard: {
+    writeText: () => Promise.resolve(),
+  },
+};
+
+const {
+  _state: state,
+  _handleKey: handleKey,
+  _commands: commands,
+  _parameterized: parameterized,
+  _setVimEnabled: setVimEnabled,
+  _setUseCtrlKeys: setUseCtrlKeys,
+  aceKeyEvent,
+} = require("./index.js");
+
+const makeRep = (lines) => ({
+  lines: {
+    length: () => lines.length,
+    atIndex: (n) => ({ text: lines[n] }),
+  },
+});
+
+const makeMockEditorInfo = () => {
+  const calls = [];
+  return {
+    editorInfo: {
+      ace_inCallStackIfNecessary: (_name, fn) => fn(),
+      ace_performSelectionChange: (start, end, _flag) => {
+        calls.push({ type: "select", start, end });
+      },
+      ace_updateBrowserSelectionFromRep: () => {},
+      ace_performDocumentReplaceRange: (start, end, newText) => {
+        calls.push({ type: "replace", start, end, newText });
+      },
+    },
+    calls,
+  };
+};
+
+// ---------------------------------------------------------------------------
+
+const resetState = () => {
+  state.mode = "normal";
+  state.pendingKey = null;
+  state.pendingCount = null;
+  state.countBuffer = "";
+  state.register = null;
+  state.namedRegisters = {};
+  state.pendingRegister = null;
+  state.awaitingRegister = false;
+  state.marks = {};
+  state.lastCharSearch = null;
+  state.visualAnchor = null;
+  state.visualCursor = null;
+  state.editorDoc = null;
+  state.currentRep = null;
+  state.desiredColumn = null;
+  state.lastCommand = null;
+  state.searchMode = false;
+  state.searchBuffer = "";
+  state.searchDirection = null;
+  state.lastSearch = null;
+  state.lastVisualSelection = null;
+};
+
+describe("undo command", () => {
+  beforeEach(() => {
+    state.mode = "normal";
+    state.pendingKey = null;
+    state.pendingCount = null;
+    state.countBuffer = "";
+    state.register = null;
+    state.marks = {};
+    state.lastCharSearch = null;
+    state.visualAnchor = null;
+    state.visualCursor = null;
+    state.editorDoc = null;
+    state.currentRep = null;
+    state.desiredColumn = null;
+    state.lastCommand = null;
+    state.searchMode = false;
+    state.searchBuffer = "";
+    state.searchDirection = null;
+    state.lastSearch = null;
+  });
+
+  it("u calls undo", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo: baseEditorInfo } = makeMockEditorInfo();
+
+    const editorInfo = {
+      ...baseEditorInfo,
+      ace_doUndoRedo: () => {},
+    };
+
+    const ctx = { rep, editorInfo, line: 0, char: 0, lineText: "hello" };
+    commands.normal["u"](ctx);
+  });
+});
+
+describe("repeat command", () => {
+  beforeEach(() => {
+    state.mode = "normal";
+    state.pendingKey = null;
+    state.pendingCount = null;
+    state.countBuffer = "";
+    state.register = null;
+    state.marks = {};
+    state.lastCharSearch = null;
+    state.visualAnchor = null;
+    state.visualCursor = null;
+    state.editorDoc = null;
+    state.currentRep = null;
+    state.desiredColumn = null;
+    state.lastCommand = null;
+    state.searchMode = false;
+    state.searchBuffer = "";
+    state.searchDirection = null;
+    state.lastSearch = null;
+  });
+
+  it(". repeats last command", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo, calls } = makeMockEditorInfo();
+
+    state.lastCommand = { key: "h", count: 1, param: null };
+
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 3,
+      lineText: "hello",
+    };
+    commands.normal["."](ctx);
+
+    assert.equal(calls.length, 1);
+  });
+
+  it(". does nothing with no last command", () => {
+    const rep = makeRep(["hello"]);
+    const { editorInfo, calls } = makeMockEditorInfo();
+
+    state.lastCommand = null;
+
+    const ctx = { rep, editorInfo, line: 0, char: 0, lineText: "hello" };
+    commands.normal["."](ctx);
+
+    assert.equal(calls.length, 0);
+  });
+
+  it(". repeats parameterized command", () => {
+    const rep = makeRep(["hello world"]);
+    const { editorInfo } = makeMockEditorInfo();
+
+    state.lastCommand = { key: "m", count: 1, param: "a" };
+
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 2,
+      lineText: "hello world",
+    };
+    commands.normal["."](ctx);
+
+    assert.deepEqual(state.marks["a"], [0, 2]);
+  });
+});
+
+describe("missing feature: zz center screen", () => {
+  beforeEach(resetState);
+
+  it("zz does nothing when editorDoc is null", () => {
+    state.editorDoc = null;
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 0,
+      lineText: "hello",
+      count: 1,
+      hasCount: false,
+    };
+
+    assert.doesNotThrow(() => commands.normal["zz"](ctx));
+  });
+});
+
+describe("zt and zb scroll commands", () => {
+  beforeEach(resetState);
+
+  it("zt does nothing when editorDoc is null", () => {
+    state.editorDoc = null;
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 0,
+      lineText: "hello",
+      count: 1,
+      hasCount: false,
+    };
+    assert.doesNotThrow(() => commands.normal["zt"](ctx));
+  });
+
+  it("zb does nothing when editorDoc is null", () => {
+    state.editorDoc = null;
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 0,
+      lineText: "hello",
+      count: 1,
+      hasCount: false,
+    };
+    assert.doesNotThrow(() => commands.normal["zb"](ctx));
+  });
+
+  it("zt calls scrollIntoView with block: start", () => {
+    const scrollCalls = [];
+    const mockLineDiv = {
+      scrollIntoView: (opts) => scrollCalls.push(opts),
+    };
+    state.editorDoc = {
+      body: {
+        querySelectorAll: () => [mockLineDiv],
+      },
+    };
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 0,
+      lineText: "hello",
+      count: 1,
+      hasCount: false,
+    };
+    commands.normal["zt"](ctx);
+    assert.equal(scrollCalls.length, 1);
+    assert.deepEqual(scrollCalls[0], { block: "start" });
+  });
+
+  it("zb calls scrollIntoView with block: end", () => {
+    const scrollCalls = [];
+    const mockLineDiv = {
+      scrollIntoView: (opts) => scrollCalls.push(opts),
+    };
+    state.editorDoc = {
+      body: {
+        querySelectorAll: () => [mockLineDiv],
+      },
+    };
+    const rep = makeRep(["hello"]);
+    const { editorInfo } = makeMockEditorInfo();
+    const ctx = {
+      rep,
+      editorInfo,
+      line: 0,
+      char: 0,
+      lineText: "hello",
+      count: 1,
+      hasCount: false,
+    };
+    commands.normal["zb"](ctx);
+    assert.equal(scrollCalls.length, 1);
+    assert.deepEqual(scrollCalls[0], { block: "end" });
+  });
+});
+
+describe("Ctrl+f and Ctrl+b page scroll", () => {
+  beforeEach(() => {
+    resetState();
+    setVimEnabled(true);
+    setUseCtrlKeys(true);
+  });
+
+  const makeCtrlEvt = (key) => ({
+    type: "keydown",
+    key,
+    ctrlKey: true,
+    metaKey: false,
+    target: { ownerDocument: null },
+    preventDefault: () => {},
+  });
+
+  it("Ctrl+f moves forward one full page", () => {
+    const lines = Array.from({ length: 50 }, (_, i) => `line${i}`);
+    const rep = makeRep(lines);
+    rep.selStart = [0, 0];
+    const { editorInfo, calls } = makeMockEditorInfo();
+    aceKeyEvent("aceKeyEvent", {
+      evt: makeCtrlEvt("f"),
+      rep,
+      editorInfo,
+    });
+    const selectCall = calls.find((c) => c.type === "select");
+    assert.ok(selectCall, "expected a select call");
+    assert.equal(selectCall.start[0], 30);
+  });
+
+  it("Ctrl+b moves backward one full page", () => {
+    const lines = Array.from({ length: 50 }, (_, i) => `line${i}`);
+    const rep = makeRep(lines);
+    rep.selStart = [40, 0];
+    state.mode = "normal";
+    const { editorInfo, calls } = makeMockEditorInfo();
+    aceKeyEvent("aceKeyEvent", {
+      evt: makeCtrlEvt("b"),
+      rep,
+      editorInfo,
+    });
+    const selectCall = calls.find((c) => c.type === "select");
+    assert.ok(selectCall, "expected a select call");
+    assert.equal(selectCall.start[0], 10);
+  });
+
+  it("Ctrl+f clamps at end of document", () => {
+    const lines = Array.from({ length: 10 }, (_, i) => `line${i}`);
+    const rep = makeRep(lines);
+    rep.selStart = [5, 0];
+    const { editorInfo, calls } = makeMockEditorInfo();
+    aceKeyEvent("aceKeyEvent", {
+      evt: makeCtrlEvt("f"),
+      rep,
+      editorInfo,
+    });
+    const selectCall = calls.find((c) => c.type === "select");
+    assert.ok(selectCall, "expected a select call");
+    assert.equal(selectCall.start[0], 9);
+  });
+
+  it("Ctrl+b clamps at start of document", () => {
+    const lines = Array.from({ length: 10 }, (_, i) => `line${i}`);
+    const rep = makeRep(lines);
+    rep.selStart = [3, 0];
+    const { editorInfo, calls } = makeMockEditorInfo();
+    aceKeyEvent("aceKeyEvent", {
+      evt: makeCtrlEvt("b"),
+      rep,
+      editorInfo,
+    });
+    const selectCall = calls.find((c) => c.type === "select");
+    assert.ok(selectCall, "expected a select call");
+    assert.equal(selectCall.start[0], 0);
+  });
+});