Make the validation-triggering methods propagate renderable indexes. (#…

…7318)

* - Make the 'validateCell' call the 'done' callback (resulting in calling the renderer) with renderable row/column indexes. (#7301)
- Add a test case.
- Add a CHANGELOG.md entry.

* - Replace setTimeout with await/async in the test case for #7301

CHANGELOG.md

@@ -16,6 +16,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fixed an issue where sorting indicator moved incorrectly when column was added. [#6397](https://github.com/handsontable/handsontable/issues/6397)
 - Fixed a bug, where untrimming previously trimmed rows would sometimes result in the table instance not refreshing its height, leaving the row headers not properly rendered. [#6276](https://github.com/handsontable/handsontable/issues/6276)
 - Fix a problem when `event.target`'s parent in the `mouseover` event was not defined, the table threw an error when hovering over row/column headers. [#6926](https://github.com/handsontable/handsontable/issues/6926)
+- Fixed an issue, where calling the validation-triggering methods on a `hiddenColumns`-enabled Handsontable instance rendered the validated cells improperly. [#7301](https://github.com/handsontable/handsontable/issues/7301)
 
 ## [8.1.0] - 2020-10-01
 

src/core.js

@@ -1238,8 +1238,12 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
       const td = instance.getCell(row, col, true);
 
       if (td && td.nodeName !== 'TH') {
-        instance.view.wt.wtSettings.settings.cellRenderer(row, col, td);
+        const renderableRow = instance.rowIndexMapper.getRenderableFromVisualIndex(row);
+        const renderableColumn = instance.columnIndexMapper.getRenderableFromVisualIndex(col);
+
+        instance.view.wt.wtSettings.settings.cellRenderer(renderableRow, renderableColumn, td);
       }
+
       callback(valid);
     }
 

test/e2e/Core_validate.spec.js

@@ -2244,4 +2244,30 @@ describe('Core_validate', () => {
       done();
     }, 200);
   });
+
+  it('should call the callback in the `done` function using the renderable indexes (passing them to the renderer)', async() => {
+    const hot = handsontable({
+      data: Handsontable.helper.createSpreadsheetData(1, 4),
+      hiddenColumns: {
+        columns: [1]
+      },
+      columns: [
+        { type: 'text' },
+        { type: 'text' },
+        { type: 'date' },
+        { type: 'text' },
+      ]
+    });
+
+    spyOn(hot.view.wt.wtSettings.settings, 'cellRenderer');
+
+    hot.validateCells();
+
+    await sleep(200);
+
+    const mostRecentRendererCallArgs = hot.view.wt.wtSettings.settings.cellRenderer.calls.mostRecent().args;
+
+    // The `date` column (the one that is being validated) should be described as the `1` (renderable) column.
+    expect(mostRecentRendererCallArgs[1]).toEqual(1);
+  });
 });