Merge pull request #83 from walkframe/fix/issue-82

fix: `evaluates` option not working well

.github/workflows/check.yaml

@@ -10,9 +10,9 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - name: setup
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: "16"
+          node-version: "22"
 
       - name: cache
         uses: actions/cache@v3

.github/workflows/e2e.yaml

@@ -17,28 +17,38 @@ jobs:
         with:
           python-version: "3.12"
       - name: setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: "16"
+          node-version: "22"
 
-      - name: cache
+      - name: cache1
         uses: actions/cache@v3
         with:
           path: |
             node_modules
-          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}
+          key: ${{ runner.os }}-${{ hashFiles('./yarn.lock') }}
+
+      - name: cache2
+        uses: actions/cache@v3
+        with:
+          path: |
+            storybook/node_modules
+          key: ${{ runner.os }}-${{ hashFiles('./storybook/yarn.lock') }}
 
       - name: install
         run: |
           yarn install
           npx playwright install --with-deps
 
       - name: build
-        run: yarn run build-storybook
+        run: |
+          cd storybook
+          yarn install
+          yarn run build
 
       - name: run server
         run: |
-          python -m http.server 5233 --directory "${{ github.workspace }}/storybook-static" &
+          python -m http.server 5233 --directory "${{ github.workspace }}/storybook/storybook-static" &
 
       - name: e2e test
         run: yarn e2e

.github/workflows/release.yaml

@@ -13,9 +13,9 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - name: setup
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: "16"
+          node-version: "22"
 
       - name: cache
         uses: actions/cache@v3

.github/workflows/unittest.yaml

@@ -12,9 +12,9 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - name: setup
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: "16"
+          node-version: "22"
       - name: cache
         uses: actions/cache@v3
         with:

.tool-versions

@@ -1 +1 @@
-nodejs 16.14.0
+nodejs 22.13.1

e2e/event.spec.ts

@@ -4,12 +4,15 @@ import { jsonMinify, jsonQuery } from './utils';
 test('show the diff', async ({ page }) => {
   await page.goto('http://localhost:5233/iframe.html?id=table-operations--sheet-on-change&viewMode=story');
   const b2 = page.locator("[data-address='B2']");
-  await b2.dblclick();
-  await page.keyboard.type('777');
+  await b2.click();
+  await page.keyboard.type('=sum(C1:E1)+10');
   await page.keyboard.press('Enter');
 
-  const diff = page.locator('#diff');
-  expect(jsonMinify(await diff.inputValue())).toContain('{"B2":7777}');
+  const diff = page.locator('#changes');
+  expect(jsonMinify(await diff.inputValue())).toContain('{"B2":22}');
+  const evaluates = page.locator('#evaluates');
+  await evaluates.uncheck();
+  expect(jsonMinify(await diff.inputValue())).toContain('{"B2":"=sum(C1:E1)+10"}');
 });
 
 test('1 operation makes 1 diff history', async ({ page }) => {

package.json

@@ -7,8 +7,8 @@
   "scripts": {
     "build": "rm -rf ./dist || true && tsc --project ./src/index.ts -p ./tsconfig.json",
     "audit-fix": "yarn-audit-fix --force",
-    "storybook": "start-storybook -p 5233",
-    "build-storybook": "build-storybook",
+    "storybook:run": "cd storybook && yarn run run",
+    "storybook:build": "cd storybook && yarn run build",
     "less": "lessc --clean-css ./src/styles/root.less ./src/styles/root.min.css",
     "generate-style": "node ./generate-style.js",
     "playwright": "npx playwright test --ui",
@@ -45,7 +45,7 @@
     "@babel/preset-env": "^7.14.4",
     "@babel/preset-react": "^7.13.13",
     "@babel/preset-typescript": "^7.13.0",
-    "@playwright/test": "^1.41.1",
+    "@playwright/test": "^1.50.1",
     "@storybook/addon-essentials": "^6.5.12",
     "@storybook/addon-links": "^6.5.12",
     "@storybook/react": "^6.5.12",
@@ -63,7 +63,6 @@
     "jest-environment-jsdom": "^29.4.3",
     "less": "^4.1.3",
     "less-plugin-clean-css": "^1.5.1",
-    "playwright": "^1.41.1",
     "prettier": "^3.2.5",
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0",

src/formula/functions/__utils.ts

@@ -40,7 +40,7 @@ export const eq = (left: any, right: any): boolean => {
 
 export const ne = (left: any, right: any): boolean => {
   return !eq(left, right);
-}
+};
 
 export const ensureNumber = (value: any, alternative?: number): number => {
   if (typeof value === 'undefined' && typeof alternative !== 'undefined') {

src/formula/solver.ts

@@ -6,14 +6,27 @@ import { p2a } from '../lib/converters';
 
 const SOLVING = new Special('solving');
 
-export const solveFormula = ({ value, table, raise = true }: { value: any; table: Table; raise?: boolean }) => {
+type SolveFormulaType = {
+  value: any;
+  table: Table;
+  raise?: boolean;
+  evaluates?: boolean | null;
+};
+
+export const solveFormula = ({ value, table, raise = true, evaluates = true }: SolveFormulaType) => {
+  if (evaluates === null) {
+    return value;
+  }
   let solved = value;
   if (typeof value === 'string') {
     if (value.charAt(0) === '=') {
       try {
         const lexer = new Lexer(value.substring(1));
         lexer.tokenize();
         const parser = new Parser(lexer.tokens);
+        if (evaluates === false) {
+          return '=' + lexer.stringifyToRef(table);
+        }
         const expr = parser.build();
         solved = expr?.evaluate?.({ table });
       } catch (e) {
@@ -32,7 +45,7 @@ export const solveFormula = ({ value, table, raise = true }: { value: any; table
 
 export const solveTable = ({ table, raise = true }: { table: Table; raise?: boolean }): MatrixType => {
   const area = table.getArea();
-  return table.getMatrixFlatten({ area, evaluates: false }).map((row, i) => {
+  return table.getMatrixFlatten({ area, evaluates: null }).map((row, i) => {
     const y = area.top + i;
     return row.map((value, j) => {
       const x = area.left + j;

src/index.ts

@@ -14,6 +14,7 @@ export type {
   WriterType,
   CellsByAddressType,
   CellsByIdType,
+  HistoryType,
 } from './types';
 export { ThousandSeparatorRendererMixin } from './renderers/thousand_separator';
 export { CheckboxRendererMixin } from './renderers/checkbox';

src/lib/autofill.ts

@@ -35,7 +35,7 @@ export class Autofill {
 
   public get applied(): Table {
     const [orientation, sign] = DirectionMapping[this.direction];
-    const matrix = this.table.getMatrix({ area: this.src, evaluates: false });
+    const matrix = this.table.getMatrix({ area: this.src, evaluates: null });
     const srcShape = areaShape({ ...this.src, base: 1 });
     const dstShape = areaShape({ ...this.dst, base: 1 });
 

src/lib/table.ts

@@ -52,7 +52,8 @@ type Props = {
 const noFilter: CellFilter = () => true;
 
 type GetProps = {
-  evaluates?: boolean;
+  // null for the system, do not use it
+  evaluates?: boolean | null;
   raise?: boolean;
   filter?: CellFilter;
 };
@@ -495,13 +496,12 @@ export class Table implements UserTable {
         if (!filter(cell)) {
           continue;
         }
-        matrix[y - top][x - left] = evaluates
-          ? solveFormula({
-              value: cell[key],
-              table: this,
-              raise,
-            })
-          : cell[key];
+        matrix[y - top][x - left] = solveFormula({
+          value: cell[key],
+          table: this,
+          raise,
+          evaluates,
+        });
       }
     }
     return matrix;
@@ -513,13 +513,12 @@ export class Table implements UserTable {
       for (let x = left; x <= right; x++) {
         const cell = this.getByPoint({ y: y - top, x: x - left });
         if (cell != null && filter(cell)) {
-          result[p2a({ y, x })] = evaluates
-            ? solveFormula({
-                value: cell[key],
-                table: this,
-                raise,
-              })
-            : cell[key];
+          result[p2a({ y, x })] = solveFormula({
+            value: cell[key],
+            table: this,
+            raise,
+            evaluates,
+          });
         }
       }
     }
@@ -534,13 +533,12 @@ export class Table implements UserTable {
       for (let x = left; x <= right; x++) {
         const cell = this.getByPoint({ y: y - top, x: x - left });
         if (cell != null && filter(cell)) {
-          row[x2c(x) || y2r(y)] = evaluates
-            ? solveFormula({
-                value: cell[key],
-                table: this,
-                raise,
-              })
-            : cell[key];
+          row[x2c(x) || y2r(y)] = solveFormula({
+            value: cell[key],
+            table: this,
+            raise,
+            evaluates,
+          });
         }
       }
     }
@@ -555,13 +553,12 @@ export class Table implements UserTable {
       for (let y = top; y <= bottom; y++) {
         const cell = this.getByPoint({ y: y - top, x: x - left });
         if (cell != null && filter(cell)) {
-          col[y2r(y) || x2c(x)] = evaluates
-            ? solveFormula({
-                value: cell[key],
-                table: this,
-                raise,
-              })
-            : cell[key];
+          col[y2r(y) || x2c(x)] = solveFormula({
+            value: cell[key],
+            table: this,
+            raise,
+            evaluates,
+          });
         }
       }
     }
@@ -586,13 +583,12 @@ export class Table implements UserTable {
         if (cell != null && filter(cell)) {
           matrix[y - top][x - left] = {
             ...cell,
-            value: evaluates
-              ? solveFormula({
-                  value: cell?.value,
-                  table: this,
-                  raise,
-                })
-              : cell?.value,
+            value: solveFormula({
+              value: cell?.value,
+              table: this,
+              raise,
+              evaluates,
+            }),
           };
         }
       }
@@ -608,13 +604,12 @@ export class Table implements UserTable {
         if (cell != null && filter(cell)) {
           result[p2a({ y, x })] = {
             ...cell,
-            value: evaluates
-              ? solveFormula({
-                  value: cell?.value,
-                  table: this,
-                  raise,
-                })
-              : cell?.value,
+            value: solveFormula({
+              value: cell?.value,
+              table: this,
+              raise,
+              evaluates,
+            }),
           };
         }
       }
@@ -632,13 +627,12 @@ export class Table implements UserTable {
         if (cell != null && filter(cell)) {
           row[x2c(x) || y2r(y)] = {
             ...cell,
-            value: evaluates
-              ? solveFormula({
-                  value: cell?.value,
-                  table: this,
-                  raise,
-                })
-              : cell?.value,
+            value: solveFormula({
+              value: cell?.value,
+              table: this,
+              raise,
+              evaluates,
+            }),
           };
         }
       }
@@ -656,13 +650,12 @@ export class Table implements UserTable {
         if (cell != null && filter(cell)) {
           col[y2r(y) || x2c(x)] = {
             ...cell,
-            value: evaluates
-              ? solveFormula({
-                  value: cell?.value,
-                  table: this,
-                  raise,
-                })
-              : cell?.value,
+            value: solveFormula({
+              value: cell?.value,
+              table: this,
+              raise,
+              evaluates,
+            }),
           };
         }
       }
@@ -1324,7 +1317,7 @@ export class Table implements UserTable {
 
     if (s[0] === '=') {
       if (evaluates) {
-        return String(solveFormula({ value: s, table: this, raise: false }));
+        return String(solveFormula({ value: s, table: this, raise: false, evaluates }));
       }
       const lexer = new Lexer(s.substring(1));
       lexer.tokenize();