@cdmx/wappler_ag_grid 2.1.9 → 2.1.10

package/CHANGELOG.md

@@ -9,9 +9,9 @@ value is a JSON array/object are matched against their JSON text. Fixes "contain
 columns (e.g. Monitoring Results / Screening Results) returning no rows.
 
 ### Changes Made
-1. **`dmx-ag-grid.js`** - `js_data_changes` columns get a `filterValueGetter` that runs the render function
-   and strips tags via `removeHtmlTags` (now a hoisted function declaration); the shared filter value getter
-   stringifies object/array values.
+1. **`dmx-ag-grid.js`** - text-type `js_data_changes` columns get a `filterValueGetter` that runs the render
+   function and strips tags via `removeHtmlTags` (now a hoisted function declaration); number/date columns keep
+   the raw value for their comparison filters. The shared filter value getter stringifies object/array values.
 2. **`tests/13-flags-styles.html`**, **`tests/data/sample-data.js`** - `jsFilterGrid` scenario with a
    `transactions` fixture and page assertions for column + quick filters.
 

package/README.md

@@ -408,7 +408,7 @@ ex: jsChanges.
   }
 </script>
   ```
-Column filters, the floating filter row and the quick filter match the text this function renders (HTML tags removed, `<br>` treated as a line break), so searching for a word that is visible in the cell finds the row. Columns whose raw value is a JSON array/object are matched against their JSON text.
+Column filters, the floating filter row and the quick filter match the text this function renders (HTML tags removed, `<br>` treated as a line break), so searching for a word that is visible in the cell finds the row. This applies to text columns; number and date columns keep filtering on their raw value. Columns whose raw value is a JSON array/object are matched against their JSON text.
 
 ---
 # Custom Headers

package/dmx-ag-grid.js

@@ -1542,14 +1542,18 @@ dmx.Component('ag-grid', {
               }
               // ponytail: filter on what the user sees - renderer output with tags stripped.
               // Covers column/floating filters, quick filter, applyFilters and cfilters (all read filterValueGetter).
-              const baseFilterValueGetter = filterValueGetter;
-              filterValueGetter = (params) => {
-                const fn = window[matchingJsChange.function];
-                if (typeof fn !== 'function' || !params.data) {
-                  return baseFilterValueGetter ? baseFilterValueGetter(params) : undefined;
-                }
-                return removeHtmlTags(fn(params.data));
-              };
+              // Text columns only: number/date filters compare the raw value, so they keep the base getter.
+              if (dataType === 'text') {
+                const baseFilterValueGetter = filterValueGetter;
+                filterValueGetter = (params) => {
+                  const fn = window[matchingJsChange.function];
+                  const rendered = (typeof fn === 'function' && params.data) ? fn(params.data) : undefined;
+                  if (typeof rendered !== 'string') {
+                    return baseFilterValueGetter ? baseFilterValueGetter(params) : undefined;
+                  }
+                  return removeHtmlTags(rendered);
+                };
+              }
             }
             else {
               cellRenderer = undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "2.1.9",
+    "version": "2.1.10",
     "type": "module",
     "description": "App Connect module for AG Grid v35 - Advanced data grid with enhanced editing, filtering, and tree data capabilities.",
     "license": "MIT",
@@ -29,3 +29,4 @@
         "publish-dry-run": "npm publish ./dist --access public --dry-run"
     }
 }
+

package/tests/13-flags-styles.html

@@ -244,7 +244,8 @@
     <p class="desc">
       <code>monitoring_results</code> / <code>screening_results</code> are JSON lists rendered by
       <code>js_data_changes</code> functions (one entry per line via <code>&lt;br&gt;</code>). Since 2.1.9 the
-      column filters, <code>applyFilters</code> and the quick filter match the rendered text, not the raw array.
+      column filters, <code>applyFilters</code> and the quick filter match the rendered text, not the raw array
+      (text columns only: <code>amount</code> also has a JS renderer and must keep its number filter).
       Try typing <code>PAYOUT</code> in a floating filter or the quick filter box.
     </p>
     <input type="search" id="jsqf" placeholder="Quick filter…" oninput="document.getElementById('jsFilterGrid').dmxComponent.get('gridInstance').setGridOption('quickFilterText', this.value)">
@@ -254,7 +255,7 @@
         dmx-bind:data="txns.value"
         grid_theme="ag-theme-alpine"
         quick_filter_field="jsqf"
-        dmx-bind:js_data_changes="[{field:'monitoring_results', function:'renderMonitoring'},{field:'screening_results', function:'renderScreening'}]"
+        dmx-bind:js_data_changes="[{field:'monitoring_results', function:'renderMonitoring'},{field:'screening_results', function:'renderScreening'},{field:'amount', function:'renderAmount'}]"
         dmx-bind:pagination="false">
       </dmx-ag-grid>
     </div>
@@ -275,6 +276,8 @@
   // js_data_changes renderers for jsFilterGrid: JSON lists -> one entry per line.
   window.renderMonitoring = data => (data.monitoring_results || []).map(r => '<b>' + r.rule + '</b> (' + r.score + ')').join('<br>');
   window.renderScreening  = data => (data.screening_results  || []).map(r => r.list + ': ' + r.match).join('<br>');
+  // Number column with a JS renderer: its number filter must keep comparing the raw value.
+  window.renderAmount     = data => '<span class="badge">' + Number(data.amount).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 }) + '</span>';
 
   // Helpers: count rows in a grid's DOM with a given background colour. Multiple matches
   // are accepted (puppeteer normalises CSS to rgb()).
@@ -414,6 +417,8 @@
         checks.jsFilter_noMatch = { expect: 0, actual: visible() };
         await call('applyFilters', { id: { type: 'equals', filter: 9003 } });
         checks.jsFilter_plainColumn = { expect: 1, actual: visible() };
+        await call('applyFilters', { amount: { type: 'greaterThan', filter: 1000 } });
+        checks.jsFilter_numberWithRenderer = { expect: txns.filter(r => r.amount > 1000).length, actual: visible() };
         await call('clearFilters');
         gi.setGridOption('quickFilterText', 'payout');
         checks.jsFilter_quick = { expect: anyPayout, actual: visible() };

package/tests/findings.json

@@ -1,5 +1,5 @@
 {
-  "startedAt": "2026-10-01T12:37:40.392Z",
+  "startedAt": "2026-10-01T12:45:25.153Z",
   "base": "http://localhost:8765/tests",
   "pages": [
     {
@@ -789,6 +789,10 @@
             "expect": 1,
             "actual": 1
           },
+          "jsFilter_numberWithRenderer": {
+            "expect": 3,
+            "actual": 3
+          },
           "jsFilter_quick": {
             "expect": 4,
             "actual": 4
@@ -924,5 +928,5 @@
       }
     }
   ],
-  "finishedAt": "2026-10-01T12:38:05.318Z"
+  "finishedAt": "2026-10-01T12:45:49.727Z"
 }

package/tests/run-all.cjs

@@ -25,7 +25,7 @@ const PAGES = [
   { file: '10-state-persistence.html',grids: ['stateGrid'] },
   { file: '11-layout.html',           grids: ['autoH','fixedH','scrollH'] },
   { file: '12-methods.html',          grids: ['m'] },
-  { file: '13-flags-styles.html',     grids: ['flagsGrid','stylesGrid','transformGrid','tipGrid','jsFilterGrid'] },
+  { file: '13-flags-styles.html',     grids: ['flagsGrid','rsFn','rsOp','rsCompound','rsShort','rsFirst','rsLegacy','csCell','transformGrid','tipGrid','jsFilterGrid'] },
   { file: '14-compact-view.html',     grids: ['compactGrid','extButtons','cellEvtGrid'] },
   { file: '15-csp.html',              grids: ['cspGrid','statusGrid'] }
 ];