ソースを参照

test(handsontable): 优化测试

zhangweicheng 5 年 前
コミット
a3ec665629

+ 2 - 2
handsontable/handsontable.d.ts

@@ -130,7 +130,7 @@ declare namespace _Handsontable {
 
     listen(): void;
 
-    loadData(data: any[]): void;
+    loadData(data: any[], reCalcWidth? :boolean): void;
 
     populateFromArray(row: number, col: number, input: any[], endRow?: number, endCol?: number, source?: string, method?: string, direction?: string, deltas?: any[]): any;
 
@@ -140,7 +140,7 @@ declare namespace _Handsontable {
 
     removeHook(key: string, callback: (() => void) | (() => void)[]): void;
 
-    render(): void;
+    render(reCalcWidth? :boolean): void;
 
     rowOffset(): number;
 

+ 3 - 3
handsontable/src/3rdparty/walkontable/src/core.js

@@ -72,14 +72,14 @@ class Walkontable {
    *                                   rendering anyway
    * @returns {Walkontable}
    */
-  draw(fastDraw = false) {
+  draw(fastDraw = false, reCalcWidth = true) {
     this.drawInterrupted = false;
 
-    if (!fastDraw && !isVisible(this.wtTable.TABLE)) {
+    if (reCalcWidth === true && !fastDraw && !isVisible(this.wtTable.TABLE)) {
       // draw interrupted because TABLE is not visible
       this.drawInterrupted = true;
     } else {
-      this.wtTable.draw(fastDraw);
+      this.wtTable.draw(fastDraw, reCalcWidth);
     }
 
     return this;

+ 2 - 2
handsontable/src/3rdparty/walkontable/src/overlay/_base.js

@@ -236,12 +236,12 @@ class Overlay {
    *
    * @param {Boolean} [fastDraw=false]
    */
-  refresh(fastDraw = false) {
+  refresh(fastDraw = false, reCalcWidth = true) {
     // When hot settings are changed we allow to refresh overlay once before blocking
     const nextCycleRenderFlag = this.shouldBeRendered();
 
     if (this.clone && (this.needFullRender || nextCycleRenderFlag)) {
-      this.clone.draw(fastDraw);
+      this.clone.draw(fastDraw, reCalcWidth);
     }
     this.needFullRender = nextCycleRenderFlag;
   }

+ 8 - 8
handsontable/src/3rdparty/walkontable/src/overlays.js

@@ -477,8 +477,8 @@ class Overlays {
   /**
    * @param {Boolean} [fastDraw=false]
    */
-  refresh(fastDraw = false) {
-    if (this.topOverlay.areElementSizesAdjusted && this.leftOverlay.areElementSizesAdjusted) {
+  refresh(fastDraw = false, reCalcWidth = true) {
+    if (reCalcWidth === true && this.topOverlay.areElementSizesAdjusted && this.leftOverlay.areElementSizesAdjusted) {
       const container = this.wot.wtTable.wtRootElement.parentNode || this.wot.wtTable.wtRootElement;
       const width = container.clientWidth;
       const height = container.clientHeight;
@@ -491,22 +491,22 @@ class Overlays {
     }
 
     if (this.bottomOverlay.clone) {
-      this.bottomOverlay.refresh(fastDraw);
+      this.bottomOverlay.refresh(fastDraw, reCalcWidth);
     }
 
-    this.leftOverlay.refresh(fastDraw);
-    this.topOverlay.refresh(fastDraw);
+    this.leftOverlay.refresh(fastDraw, reCalcWidth);
+    this.topOverlay.refresh(fastDraw, reCalcWidth);
 
     if (this.topLeftCornerOverlay) {
-      this.topLeftCornerOverlay.refresh(fastDraw);
+      this.topLeftCornerOverlay.refresh(fastDraw, reCalcWidth);
     }
 
     if (this.bottomLeftCornerOverlay && this.bottomLeftCornerOverlay.clone) {
-      this.bottomLeftCornerOverlay.refresh(fastDraw);
+      this.bottomLeftCornerOverlay.refresh(fastDraw, reCalcWidth);
     }
 
     if (this.debug) {
-      this.debug.refresh(fastDraw);
+      this.debug.refresh(fastDraw, reCalcWidth);
     }
   }
 

+ 5 - 5
handsontable/src/3rdparty/walkontable/src/table.js

@@ -191,7 +191,7 @@ class Table {
    * @param {Boolean} fastDraw If TRUE, will try to avoid full redraw and only update the border positions. If FALSE or UNDEFINED, will perform a full redraw
    * @returns {Table}
    */
-  draw(fastDraw) {
+  draw(fastDraw, reCalcWidth = true) {
     const { wtOverlays, wtViewport } = this.wot;
     const totalRows = this.instance.getSetting('totalRows');
     const rowHeaders = this.wot.getSetting('rowHeaders').length;
@@ -201,7 +201,7 @@ class Table {
 
     if (!this.isWorkingOnClone()) {
       this.holderOffset = offset(this.holder);
-      runFastDraw = wtViewport.createRenderCalculators(runFastDraw);
+      if (reCalcWidth === true) runFastDraw = wtViewport.createRenderCalculators(runFastDraw);
 
       if (rowHeaders && !this.wot.getSetting('fixedColumnsLeft')) {
         const leftScrollPos = wtOverlays.leftOverlay.getScrollPosition();
@@ -259,7 +259,7 @@ class Table {
       this.columnFilter = new ColumnFilter(startColumn, this.wot.getSetting('totalColumns'), rowHeaders);
 
       this.alignOverlaysWithTrimmingContainer();
-      this._doDraw(); // creates calculator after draw
+      this._doDraw(reCalcWidth); // creates calculator after draw
     }
     this.refreshSelections(runFastDraw);
 
@@ -288,10 +288,10 @@ class Table {
     return this;
   }
 
-  _doDraw() {
+  _doDraw(reCalcWidth = true) {
     const wtRenderer = new TableRenderer(this);
 
-    wtRenderer.render();
+    wtRenderer.render(reCalcWidth);
   }
 
   removeClassFromCells(className) {

+ 21 - 14
handsontable/src/3rdparty/walkontable/src/tableRenderer.js

@@ -40,12 +40,14 @@ class TableRenderer {
     this.columnHeaderCount = 0;
     this.fixedRowsTop = 0;
     this.fixedRowsBottom = 0;
+    this.workspaceWidth = this.wot.wtViewport.getWorkspaceWidth();
+    this.innerHeight = innerHeight(this.instance.wtTable.TBODY) - 1;
   }
 
   /**
    *
    */
-  render() {
+  render(reCalcWidth = true) {
     if (!this.wtTable.isWorkingOnClone()) {
       const skipRender = {};
       this.wot.getSetting('beforeDraw', true, skipRender);
@@ -89,11 +91,12 @@ class TableRenderer {
       this.renderRows(totalRows, rowsToRender, columnsToRender);
 
       if (!this.wtTable.isWorkingOnClone()) {
-        workspaceWidth = this.wot.wtViewport.getWorkspaceWidth();
+        if (reCalcWidth === true) this.workspaceWidth = this.wot.wtViewport.getWorkspaceWidth();
+        workspaceWidth = this.workspaceWidth;
         this.wot.wtViewport.containerWidth = null;
       }
 
-      this.adjustColumnWidths(columnsToRender);
+      if (reCalcWidth === true) this.adjustColumnWidths(columnsToRender);
       this.markOversizedColumnHeaders();
       this.adjustColumnHeaderHeights();
     }
@@ -104,23 +107,26 @@ class TableRenderer {
     this.removeRedundantRows(rowsToRender);
 
     if (!this.wtTable.isWorkingOnClone() || this.wot.isOverlayName(Overlay.CLONE_BOTTOM)) {
-      this.markOversizedRows();
+      this.markOversizedRows(reCalcWidth);
     }
     if (!this.wtTable.isWorkingOnClone()) {
-      this.wot.wtViewport.createVisibleCalculators();
-      this.wot.wtOverlays.refresh(false);
+      if (reCalcWidth === true) this.wot.wtViewport.createVisibleCalculators();
+      this.wot.wtOverlays.refresh(false, reCalcWidth);
 
       this.wot.wtOverlays.applyToDOM();
 
-      const hiderWidth = outerWidth(this.wtTable.hider);
-      const tableWidth = outerWidth(this.wtTable.TABLE);
+      if (reCalcWidth === true) {
 
-      if (hiderWidth !== 0 && (tableWidth !== hiderWidth)) {
-        // Recalculate the column widths, if width changes made in the overlays removed the scrollbar, thus changing the viewport width.
-        this.adjustColumnWidths(columnsToRender);
+        const hiderWidth = outerWidth(this.wtTable.hider);
+        const tableWidth = outerWidth(this.wtTable.TABLE);
+
+        if (hiderWidth !== 0 && (tableWidth !== hiderWidth)) {
+          // Recalculate the column widths, if width changes made in the overlays removed the scrollbar, thus changing the viewport width.
+          this.adjustColumnWidths(columnsToRender);
+        }
       }
 
-      if (workspaceWidth !== this.wot.wtViewport.getWorkspaceWidth()) {
+      if (reCalcWidth === true && workspaceWidth !== this.wot.wtViewport.getWorkspaceWidth()) {
         // workspace width changed though to shown/hidden vertical scrollbar. Let's reapply stretching
         this.wot.wtViewport.containerWidth = null;
 
@@ -238,13 +244,14 @@ class TableRenderer {
   /**
    * Check if any of the rendered rows is higher than expected, and if so, cache them
    */
-  markOversizedRows() {
+  markOversizedRows(reCalcWidth = true) {
     if (this.wot.getSetting('externalRowCalculator')) {
       return;
     }
     let rowCount = this.instance.wtTable.TBODY.childNodes.length;
     const expectedTableHeight = rowCount * this.instance.wtSettings.settings.defaultRowHeight;
-    const actualTableHeight = innerHeight(this.instance.wtTable.TBODY) - 1;
+    if (reCalcWidth === true) this.innerHeight = innerHeight(this.instance.wtTable.TBODY) - 1;
+    const actualTableHeight = this.innerHeight;
     let previousRowHeight;
     let rowInnerHeight;
     let sourceRowIndex;

+ 8 - 8
handsontable/src/core.js

@@ -1241,8 +1241,8 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
    * @param {Boolean} [revertOriginal=false] If `true`, the previous value will be restored. Otherwise, the edited value will be saved.
    * @param {Boolean} [prepareEditorIfNeeded=true] If `true` the editor under the selected cell will be prepared to open.
    */
-  this.destroyEditor = function(revertOriginal = false, prepareEditorIfNeeded = true) {
-    instance._refreshBorders(revertOriginal, prepareEditorIfNeeded);
+  this.destroyEditor = function(revertOriginal = false, prepareEditorIfNeeded = true, reCalcWidth = true) {
+    instance._refreshBorders(revertOriginal, prepareEditorIfNeeded, reCalcWidth);
   };
 
   /**
@@ -1417,12 +1417,12 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
    * @memberof Core#
    * @function render
    */
-  this.render = function() {
+  this.render = function(reCalcWidth = true) {
     if (instance.view) {
       instance.renderCall = true;
       instance.forceFullRender = true; // used when data was changed
       editorManager.lockEditor();
-      instance._refreshBorders(null);
+      instance._refreshBorders(null, true, reCalcWidth);
       editorManager.unlockEditor();
     }
   };
@@ -1436,7 +1436,7 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
    * @fires Hooks#afterLoadData
    * @fires Hooks#afterChange
    */
-  this.loadData = function(data) {
+  this.loadData = function(data, reCalcWidth = true) {
     if (Array.isArray(priv.settings.dataSchema)) {
       instance.dataType = 'array';
     } else if (isFunction(priv.settings.dataSchema)) {
@@ -1511,7 +1511,7 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
       priv.firstRun = [null, 'loadData'];
     } else {
       instance.runHooks('afterChange', null, 'loadData');
-      instance.render();
+      instance.render(reCalcWidth);
     }
     priv.isPopulated = true;
 
@@ -3583,9 +3583,9 @@ export default function Core(rootElement, userSettings, rootInstanceSymbol = fal
    * @param {Boolean} [revertOriginal=false] If `true`, the previous value will be restored. Otherwise, the edited value will be saved.
    * @param {Boolean} [prepareEditorIfNeeded=true] If `true` the editor under the selected cell will be prepared to open.
    */
-  this._refreshBorders = function(revertOriginal = false, prepareEditorIfNeeded = true) {
+  this._refreshBorders = function(revertOriginal = false, prepareEditorIfNeeded = true, reCalcWidth = true) {
     editorManager.destroyEditor(revertOriginal);
-    instance.view.render();
+    instance.view.render(reCalcWidth);
 
     if (prepareEditorIfNeeded && selection.isSelected()) {
       editorManager.prepareEditor();

+ 7 - 4
handsontable/src/selection/mouseEventHandler.js

@@ -64,13 +64,16 @@ export function mouseDown({ isShiftKey, isLeftClick, isRightClick, coords, selec
         selection.selectRows(coords.row);
       }
 
-    } else if (coords.col >= 0 && coords.row >= 0 && !controller.cells) {
-      if (performSelection) {
+    } else if (!currentSelection || (currentSelection.highlight.row !== coords.row || currentSelection.highlight.col !== coords.col)) {
+      if (coords.col >= 0 && coords.row >= 0 && !controller.cells) {
+        if (performSelection) {
+          selection.setRangeStart(coords);
+        }
+      } else if (coords.col < 0 && coords.row < 0) {
         selection.setRangeStart(coords);
       }
-    } else if (coords.col < 0 && coords.row < 0) {
-      selection.setRangeStart(coords);
     }
+
   }
 }
 

+ 3 - 3
handsontable/src/tableView.js

@@ -170,7 +170,7 @@ function TableView(instance) {
     if (outsideClickDeselects) {
       instance.deselectCell();
     } else {
-      instance.destroyEditor(false, false);
+      instance.destroyEditor(false, false, false);
       instance.unlisten();// 点击tab等其它handsontable外的元素时,handsontable要解除监听键盘等事件. handsontable只在mouseup事件通过isOutsideInput只针对input 等几个输入元素
     }
   });
@@ -490,8 +490,8 @@ TableView.prototype.onDraw = function(force) {
   }
 };
 
-TableView.prototype.render = function() {
-  this.wt.draw(!this.instance.forceFullRender);
+TableView.prototype.render = function(reCalcWidth = true) {
+  this.wt.draw(!this.instance.forceFullRender, reCalcWidth);
   this.instance.forceFullRender = false;
   this.instance.renderCall = false;
 };