@odoo/o-spreadsheet 1.0.1

package/tests/plugins/highlight_test.ts

@@ -0,0 +1,413 @@
+import { Model } from "../../src";
+import { toZone } from "../../src/helpers";
+import { HighlightPlugin } from "../../src/plugins/highlight";
+import "../canvas.mock";
+
+let model: Model;
+
+function getPendingHighlights(model: Model): string {
+  const highligthPlugin = (model as any).handlers.find((h) => h instanceof HighlightPlugin);
+  return highligthPlugin.pendingHighlights;
+}
+
+function getColor(model: Model): string {
+  const highligthPlugin = (model as any).handlers.find((h) => h instanceof HighlightPlugin);
+  return highligthPlugin.color;
+}
+
+beforeEach(async () => {
+  model = new Model();
+});
+
+describe("highlight", () => {
+  test("add highlight", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("remove all highlight", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888", B6: "#999" },
+    });
+    expect(model.getters.getHighlights().length).toBe(2);
+    model.dispatch("REMOVE_ALL_HIGHLIGHTS");
+    expect(model.getters.getHighlights()).toEqual([]);
+  });
+
+  test("remove a single highlight", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888", B6: "#999" },
+    });
+    model.dispatch("REMOVE_HIGHLIGHTS", {
+      ranges: { B6: "#999" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("add no hightlight", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: {},
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([]);
+  });
+
+  test("remove highlight with another color", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    model.dispatch("REMOVE_HIGHLIGHTS", {
+      ranges: { B2: "#999" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("remove highlight with same range", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#999" },
+    });
+    model.dispatch("REMOVE_HIGHLIGHTS", {
+      ranges: { B2: "#999" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("remove highlight with sheet reference", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    model.dispatch("REMOVE_HIGHLIGHTS", {
+      ranges: { "Sheet1!B2": "#888" },
+    });
+    expect(model.getters.getHighlights()).toHaveLength(0);
+  });
+
+  test("remove highlight from another sheet", () => {
+    const sheet1 = model.getters.getActiveSheet();
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    model.dispatch("CREATE_SHEET", { id: "42", activate: true });
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: sheet1,
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+      {
+        color: "#888",
+        sheet: "42",
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+    model.dispatch("REMOVE_HIGHLIGHTS", {
+      ranges: { B2: "#888" },
+    });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: "#888",
+        sheet: sheet1,
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("highlight cell selection", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("SELECT_CELL", { col: 1, row: 1 });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: getColor(model),
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("highlight selection sequence", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    const zone1 = { bottom: 5, left: 1, right: 5, top: 1 };
+    const zone2 = { bottom: 10, left: 6, right: 10, top: 6 };
+    model.dispatch("SET_SELECTION", {
+      anchor: [1, 1],
+      zones: [zone1],
+    });
+    model.dispatch("STOP_SELECTION");
+    const firstColor = getColor(model);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: firstColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: zone1,
+      },
+    ]);
+    model.dispatch("START_SELECTION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [6, 6],
+      zones: [zone2],
+    });
+    model.dispatch("STOP_SELECTION");
+    expect(getColor(model)).toBe(firstColor);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: firstColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: zone2,
+      },
+    ]);
+  });
+
+  test("expand selection highlights in a new color", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    const zone1 = { bottom: 5, left: 1, right: 5, top: 1 };
+    const zone2 = { bottom: 10, left: 6, right: 10, top: 6 };
+    model.dispatch("SET_SELECTION", {
+      anchor: [1, 1],
+      zones: [zone1],
+    });
+    model.dispatch("STOP_SELECTION");
+    const firstColor = getColor(model);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: firstColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: zone1,
+      },
+    ]);
+    model.dispatch("PREPARE_SELECTION_EXPANSION");
+    model.dispatch("START_SELECTION_EXPANSION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [6, 6],
+      zones: [zone2],
+    });
+    model.dispatch("STOP_SELECTION");
+    expect(getColor(model)).not.toBe(firstColor);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: getColor(model),
+        sheet: model.getters.getActiveSheet(),
+        zone: zone2,
+      },
+    ]);
+  });
+
+  test("selection highlights with previous selection and expand", () => {
+    model.dispatch("START_SELECTION");
+    const zone1 = { bottom: 5, left: 1, right: 5, top: 1 };
+    model.dispatch("SET_SELECTION", {
+      anchor: [1, 1],
+      zones: [zone1],
+    });
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION_EXPANSION");
+    model.dispatch("SELECT_CELL", { col: 10, row: 10 });
+    model.dispatch("STOP_SELECTION");
+    expect(model.getters.getHighlights().length).toBe(2);
+    const [firstColor, secondColor] = model.getters.getHighlights().map((h) => h.color);
+    expect(firstColor).not.toBe(secondColor);
+  });
+
+  test("set a color", () => {
+    model.dispatch("SET_HIGHLIGHT_COLOR", { color: "#999" });
+    expect(getColor(model)).toBe("#999");
+  });
+
+  test("color changes when manually changed", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    const zone1 = { bottom: 5, left: 1, right: 5, top: 1 };
+    const zone2 = { bottom: 10, left: 6, right: 10, top: 6 };
+    model.dispatch("SET_SELECTION", {
+      anchor: [1, 1],
+      zones: [zone1],
+    });
+    model.dispatch("STOP_SELECTION");
+    const firstColor = getColor(model);
+    expect(model.getters.getHighlights().map((h) => h.color)).toEqual([firstColor]);
+    model.dispatch("SET_HIGHLIGHT_COLOR", { color: "#999" });
+    model.dispatch("START_SELECTION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [6, 6],
+      zones: [zone2],
+    });
+    model.dispatch("STOP_SELECTION");
+    expect(getColor(model)).not.toBe(firstColor);
+    expect(model.getters.getHighlights().map((h) => h.color)).toEqual(["#999"]);
+  });
+
+  test("select same range twice highlights once", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    const anchor: [number, number] = [1, 1];
+    const zone = { bottom: 5, left: 1, right: 5, top: 1 };
+    const zones = [zone];
+    model.dispatch("START_SELECTION");
+    const color = getColor(model);
+    model.dispatch("SET_SELECTION", { anchor, zones });
+    model.dispatch("STOP_SELECTION");
+    expect(model.getters.getHighlights()).toStrictEqual([
+      { color, zone, sheet: model.getters.getActiveSheet() },
+    ]);
+    model.dispatch("START_SELECTION");
+    model.dispatch("SET_SELECTION", { anchor, zones });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      { color, zone, sheet: model.getters.getActiveSheet() },
+    ]);
+  });
+
+  test("selection without pending highlight", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    const zone1 = { bottom: 5, left: 1, right: 5, top: 1 };
+    const zone2 = { bottom: 10, left: 6, right: 10, top: 6 };
+    model.dispatch("SET_SELECTION", {
+      anchor: [1, 1],
+      zones: [zone1],
+    });
+    const firstColor = getColor(model);
+    model.dispatch("STOP_SELECTION");
+    model.dispatch("RESET_PENDING_HIGHLIGHT");
+    model.dispatch("START_SELECTION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [6, 6],
+      zones: [zone2],
+    });
+    model.dispatch("STOP_SELECTION");
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: firstColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: zone1,
+      },
+      {
+        color: getColor(model),
+        sheet: model.getters.getActiveSheet(),
+        zone: zone2,
+      },
+    ]);
+  });
+
+  test("selection with manually set pending highlight", () => {
+    model.dispatch("ADD_HIGHLIGHTS", {
+      ranges: { B10: "#999" },
+    });
+    model.dispatch("ADD_PENDING_HIGHLIGHTS", {
+      ranges: { B10: "#999" },
+    });
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    model.dispatch("SELECT_CELL", { col: 1, row: 1 });
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: getColor(model),
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 1, left: 1, right: 1, top: 1 },
+      },
+    ]);
+  });
+
+  test("expanding selection does not remove pending highlight from previous zones", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("START_SELECTION");
+    model.dispatch("SELECT_CELL", { col: 5, row: 5 });
+    const firstColor = getColor(model);
+    model.dispatch("START_SELECTION_EXPANSION");
+    model.dispatch("SELECT_CELL", { col: 7, row: 7 });
+    expect(model.getters.getSelectedZones().length).toBe(2);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: firstColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 5, left: 5, right: 5, top: 5 },
+      },
+      {
+        color: getColor(model),
+        sheet: model.getters.getActiveSheet(),
+        zone: { bottom: 7, left: 7, right: 7, top: 7 },
+      },
+    ]);
+  });
+
+  test("selecting cells in a merge expands the highlight", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    const sheet = model.getters.getActiveSheet();
+    model.dispatch("ADD_MERGE", { sheet, zone: toZone("A2:A4") });
+    model.dispatch("START_SELECTION_EXPANSION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [0, 4],
+      zones: [toZone("A3:A5")],
+    });
+    const mergeColor = getColor(model);
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: mergeColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: toZone("A2:A5"),
+      },
+    ]);
+  });
+
+  test("selecting cell in a merge does not reset pending highlights", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    const sheet = model.getters.getActiveSheet();
+    model.dispatch("ADD_MERGE", { sheet, zone: toZone("A2:A4") });
+    model.dispatch("START_SELECTION_EXPANSION");
+    model.dispatch("SET_SELECTION", {
+      anchor: [0, 4],
+      zones: [toZone("A3:A5")],
+    });
+    const mergeColor = getColor(model);
+    model.dispatch("ALTER_SELECTION", { cell: [0, 1] }); // TopLeft
+    model.dispatch("ALTER_SELECTION", { cell: [0, 0] }); // above merge
+    model.dispatch("STOP_SELECTION");
+    expect(model.getters.getHighlights()).toStrictEqual([
+      {
+        color: mergeColor,
+        sheet: model.getters.getActiveSheet(),
+        zone: toZone("A1:A5"),
+      },
+    ]);
+  });
+
+  test("disabling selection highlighting resets pending highlights", () => {
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: true });
+    model.dispatch("ADD_PENDING_HIGHLIGHTS", {
+      ranges: { B10: "#999" },
+    });
+    expect(getPendingHighlights(model).length).toBe(1);
+    model.dispatch("HIGHLIGHT_SELECTION", { enabled: false });
+    expect(getPendingHighlights(model).length).toBe(0);
+  });
+});

package/tests/plugins/history_test.ts

@@ -0,0 +1,142 @@
+import { MAX_HISTORY_STEPS } from "../../src/history";
+import { Model } from "../../src/model";
+import { CancelledReason } from "../../src/types/commands";
+import "../helpers"; // to have getcontext mocks
+import { getCell, waitForRecompute } from "../helpers";
+
+// we test here the undo/redo feature
+
+describe("history", () => {
+  test("can undo and redo two consecutive operations", () => {
+    const model = new Model();
+    model.dispatch("SET_VALUE", { xc: "A2", text: "3" });
+    model.dispatch("SET_VALUE", { xc: "A2", text: "5" });
+
+    expect(getCell(model, "A2")!.content).toBe("5");
+
+    model.dispatch("UNDO");
+    expect(getCell(model, "A2")!.content).toBe("3");
+
+    model.dispatch("UNDO");
+    expect(getCell(model, "A2")).toBeNull();
+
+    model.dispatch("REDO");
+    expect(getCell(model, "A2")!.content).toBe("3");
+    model.dispatch("REDO");
+    expect(getCell(model, "A2")!.content).toBe("5");
+  });
+
+  test("redo stack is nuked when new operation is performed", () => {
+    const model = new Model();
+    model.dispatch("SET_VALUE", { xc: "A2", text: "3" });
+
+    expect(getCell(model, "A2")!.content).toBe("3");
+
+    model.dispatch("UNDO");
+    expect(getCell(model, "A2")).toBeNull();
+
+    expect(model.getters.canUndo()).toBe(false);
+    expect(model.getters.canRedo()).toBe(true);
+
+    model.dispatch("SET_VALUE", { xc: "A4", text: "5" });
+    expect(model.getters.canUndo()).toBe(true);
+    expect(model.getters.canRedo()).toBe(false);
+  });
+
+  test("two identical changes do not count as two undo steps", () => {
+    const model = new Model();
+    model.dispatch("SELECT_CELL", { col: 1, row: 1 });
+    model.dispatch("SET_FORMATTING", {
+      sheet: model.getters.getActiveSheet(),
+      target: model.getters.getSelectedZones(),
+      border: "all",
+    });
+    model.dispatch("SET_FORMATTING", {
+      sheet: model.getters.getActiveSheet(),
+      target: model.getters.getSelectedZones(),
+      border: "all",
+    });
+
+    expect(getCell(model, "B2")!.border).toBeDefined();
+    model.dispatch("UNDO");
+    expect(getCell(model, "B2")).toBeNull();
+  });
+
+  test("undo steps are dropped at some point", () => {
+    const model = new Model();
+    expect(model.getters.canUndo()).toBe(false);
+    for (let i = 0; i < MAX_HISTORY_STEPS; i++) {
+      model.dispatch("START_EDITION", { text: String(i) });
+      model.dispatch("STOP_EDITION");
+      expect(getCell(model, "A1")!.content).toBe(String(i));
+    }
+    model.dispatch("START_EDITION", { text: "abc" });
+    model.dispatch("STOP_EDITION");
+    expect(getCell(model, "A1")!.content).toBe("abc");
+    model.dispatch("UNDO");
+    expect(getCell(model, "A1")!.content).toBe(String(MAX_HISTORY_STEPS - 1));
+  });
+
+  test("undo recomputes the cells", () => {
+    const model = new Model();
+    model.dispatch("SET_VALUE", { xc: "A1", text: "=A2" });
+    model.dispatch("SET_VALUE", { xc: "A2", text: "11" });
+    expect(getCell(model, "A1")!.value).toBe(11);
+    model.dispatch("UNDO");
+    expect(getCell(model, "A1")!.value).toBe(null);
+    model.dispatch("REDO");
+    expect(getCell(model, "A1")!.value).toBe(11);
+  });
+
+  test("undo when undo stack is empty does nothing", async () => {
+    const model = new Model({ sheets: [{ cells: { A1: { content: "=WAIT(10)" } } }] });
+    await waitForRecompute();
+
+    expect(getCell(model, "A1")!.value).toBe(10);
+
+    expect(model.dispatch("UNDO")).toEqual({
+      reason: CancelledReason.EmptyUndoStack,
+      status: "CANCELLED",
+    });
+    expect(getCell(model, "A1")!.value).toBe(10);
+  });
+
+  test("undo when redo stack is empty does nothing", async () => {
+    const model = new Model({ sheets: [{ cells: { A1: { content: "=WAIT(10)" } } }] });
+    await waitForRecompute();
+
+    expect(getCell(model, "A1")!.value).toBe(10);
+
+    expect(model.dispatch("REDO")).toEqual({
+      reason: CancelledReason.EmptyRedoStack,
+      status: "CANCELLED",
+    });
+    expect(getCell(model, "A1")!.value).toBe(10);
+  });
+
+  test("undo a sheet creation changes the active sheet", () => {
+    const model = new Model();
+    const sheetId = model.getters.getActiveSheet();
+    model.dispatch("CREATE_SHEET", { id: "42" });
+    model.dispatch("ACTIVATE_SHEET", { from: sheetId, to: "42" });
+    model.dispatch("UNDO");
+    expect(model.getters.getActiveSheet()).toBe(sheetId);
+  });
+
+  test("ACTIVATE_SHEET standalone is not saved", () => {
+    const model = new Model();
+    model.dispatch("CREATE_SHEET", { id: "42" });
+    model.dispatch("SET_VALUE", { xc: "A1", text: "=A2" });
+    model.dispatch("ACTIVATE_SHEET", { from: model.getters.getActiveSheet(), to: "42" });
+    model.dispatch("UNDO");
+    expect(model.getters.getActiveSheet()).toBe("42");
+  });
+
+  test("ACTIVATE_SHEET with another command is saved", () => {
+    const model = new Model();
+    const sheet = model.getters.getActiveSheet();
+    model.dispatch("CREATE_SHEET", { id: "42", activate: true });
+    model.dispatch("UNDO");
+    expect(model.getters.getActiveSheet()).toBe(sheet);
+  });
+});