From 3161d98adb1ae19887f170a42f93a4e5a1389803 Mon Sep 17 00:00:00 2001 From: "Ghislain B." Date: Sun, 29 Sep 2024 00:09:11 -0400 Subject: [PATCH] feat: option to improve Date Sorting by pre-parsing date items only once (#1268) * feat: option to improve Date Sorting by pre-parsing date items only once --- docs/column-functionalities/sorting.md | 57 +++++ packages/aurelia-slickgrid/package.json | 14 +- .../src/custom-elements/aurelia-slickgrid.ts | 19 +- .../__tests__/slickRowDetailView.spec.ts | 3 +- packages/demo/package.json | 18 +- .../demo/src/examples/slickgrid/example4.html | 3 + .../demo/src/examples/slickgrid/example4.ts | 7 +- pnpm-lock.yaml | 194 +++++++++++------- test/cypress/e2e/example04.cy.ts | 6 +- 9 files changed, 223 insertions(+), 98 deletions(-) diff --git a/docs/column-functionalities/sorting.md b/docs/column-functionalities/sorting.md index ed6a8efa1..309210cd4 100644 --- a/docs/column-functionalities/sorting.md +++ b/docs/column-functionalities/sorting.md @@ -4,6 +4,7 @@ - [Custom Sort Comparer](#custom-sort-comparer) - [Update Sorting Dynamically](#update-sorting-dynamically) - [Dynamic Query Field](#dynamic-query-field) +- [Pre-Parse Date Columns for better perf](#pre-parse-date-columns-for-better-perf) ### Demo [Demo Page](https://ghiscoding.github.io/aurelia-slickgrid/#/slickgrid/example4) / [Demo ViewModel](https://github.com/ghiscoding/aurelia-slickgrid/blob/master/packages/demo/src/examples/slickgrid/example4.ts) @@ -137,3 +138,59 @@ queryFieldNameGetterFn: (dataContext) => { return dataContext.profit > 0 ? 'profitRatio' : 'lossRatio'; }, ``` + +### Pre-Parse Date Columns for better perf +##### requires v5.8.0 and higher + +Sorting very large dataset with dates can be extremely slow when dates formated date strings, the reason is because these strings need to first be parsed and converted to real JS Dates before the Sorting process can actually happen (i.e. US Date Format). However parsing a large dataset can be slow **and** to make it worst, a Sort will revisit the same items over and over which mean that the same date strings will have to be reparsed over and over (for example while trying to Sort a dataset of 100 items, I saw some items being revisit 10 times and I can only imagine that it is exponentially worst with a large dataset). + +So what can we do to make this faster with a more reasonable time? Well, we can simply pre-parse all date strings once and only once and convert them to JS Date objects. Then once we get Date objects, we'll simply read the UNIX timestamp which is what we need to Sort. The first pre-parse takes a bit of time and will be executed only on the first date column Sort (any sort afterward will read the pre-parsed Date objects). + +What perf do we get with pre-parsing versus regular non-parsing? The benchmark was pulled using 50K items with 2 date columns (with US date format) +- without non-parsing: ~15sec +- with pre-parsing: ~1.4sec (1st pre-parse) and any subsequent Date sort is about ~0.2sec => so about ~1.5sec total + +The summary, is that we get a 10x boost **but** not only that, we also get an extremely fast subsequent sort afterward (sorting Date objects is as fast as sorting Numbers). + +#### Usage + +You can use the `preParseDateColumns` grid option, it can be either set as either `boolean` or a `string` but there's big distinction between the 2 approaches (both approaches will mutate the dataset). +1. `string` (i.e. set to `"__"`, it will parse a `"start"` date string and assign it as a `Date` object to a new `"__start"` prop) +2. `boolean` (i.e. parse `"start"` date string and reassign it as a `Date` object on the same `"start"` prop) + +> **Note** this option **does not work** with Backend Services because it simply has no effect. + +For example if our dataset has 2 columns named "start" and "finish", then pre-parse the dataset, + +with the 1nd approach (`string`), let's use `"__"` (which is in reality a prefix) it will mutate the dataset by adding new props (where `Date` is a `Date` object) + +```diff +data = [ +- { id: 0, start: '02/28/24', finish: '03/02/24' }, +- { id: 1, start: '01/14/24', finish: '02/13/24' }, ++ { id: 0, start: '02/28/24', finish: '03/02/24', __start: Date, __finish: Date }, ++ { id: 1, start: '01/14/24', finish: '02/13/24', __start: Date, __finish: Date }, +] +``` + +with the 2nd approach (`boolean`), it will instead mutate the dataset by overwriting the same properties + +```diff +data = [ +- { id: 0, start: '02/28/24', finish: '03/02/24' }, +- { id: 1, start: '01/14/24', finish: '02/13/24' }, ++ { id: 0, start: Date, finish: Date }, ++ { id: 1, start: Date, finish: Date }, +] +``` + +Which approach to choose? Both have pros and cons, overwriting the same props might cause problems with the column `type` that you use, you will have to give it a try yoursel. On the other hand, with the other approach, it will duplicate all date properties and take a bit more memory usage and when changing cells we'll need to make sure to keep these props in sync, however you will likely have less `type` issues. + +What happens when we do any cell changes (for our use case, it would be Create/Update), for any Editors we simply subscribe to the `onCellChange` change event and we re-parse the date strings when detected. We also subscribe to certain CRUD functions as long as they come from the `GridService` then all is fine... However, if you use the DataView functions directly then we have no way of knowing when to parse because these functions from the DataView don't have any events. Lastly, if we overwrite the entire dataset, we will also detect this (via an internal flag) and the next time you sort a date then the pre-parse kicks in again. + +#### Can I call the pre-parse myself? + +Yes, if for example you want to pre-parse right after the grid is loaded, you could call the pre-parse yourself for either all items or a single item +- all item pre-parsing: `this.sgb.sortService.preParseAllDateItems();` + - the items will be read directly from the DataView +- a single item parsing: `this.sgb.sortService.preParseSingleDateItem(item);` diff --git a/packages/aurelia-slickgrid/package.json b/packages/aurelia-slickgrid/package.json index 646578a77..c930173d6 100644 --- a/packages/aurelia-slickgrid/package.json +++ b/packages/aurelia-slickgrid/package.json @@ -53,13 +53,13 @@ "@aurelia/runtime": "^2.0.0-beta.21", "@aurelia/runtime-html": "^2.0.0-beta.21", "@formkit/tempo": "^0.1.2", - "@slickgrid-universal/common": "~5.7.0", - "@slickgrid-universal/custom-footer-component": "~5.7.0", - "@slickgrid-universal/empty-warning-component": "~5.7.0", - "@slickgrid-universal/event-pub-sub": "~5.7.0", - "@slickgrid-universal/pagination-component": "~5.7.0", - "@slickgrid-universal/row-detail-view-plugin": "~5.7.0", - "@slickgrid-universal/utils": "~5.7.0", + "@slickgrid-universal/common": "~5.8.0", + "@slickgrid-universal/custom-footer-component": "~5.8.0", + "@slickgrid-universal/empty-warning-component": "~5.8.0", + "@slickgrid-universal/event-pub-sub": "~5.8.0", + "@slickgrid-universal/pagination-component": "~5.8.0", + "@slickgrid-universal/row-detail-view-plugin": "~5.8.0", + "@slickgrid-universal/utils": "~5.8.0", "dequal": "^2.0.3", "sortablejs": "^1.15.3" }, diff --git a/packages/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts b/packages/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts index 5b179a626..4d6a6f195 100644 --- a/packages/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts +++ b/packages/aurelia-slickgrid/src/custom-elements/aurelia-slickgrid.ts @@ -33,6 +33,7 @@ import { GridStateService, GridStateType, GroupingAndColspanService, + isColumnDateType, type Observable, PaginationService, ResizerService, @@ -62,6 +63,8 @@ import type { AureliaGridInstance, GridOption } from '../models/index'; import { AureliaUtilService, ContainerService, disposeAllSubscriptions, TranslaterService } from '../services/index'; import { SlickRowDetailView } from '../extensions/slickRowDetailView'; +const WARN_NO_PREPARSE_DATE_SIZE = 5000; // data size to warn user when pre-parse isn't enabled + @customElement({ name: 'aurelia-slickgrid', template: ` @@ -173,7 +176,7 @@ export class AureliaSlickgridCustomElement { this.filterFactory = new FilterFactory(slickgridConfig, this.translaterService, this.collectionService); this.filterService = new FilterService(this.filterFactory as any, this._eventPubSubService, this.sharedService, this.backendUtilityService); this.resizerService = new ResizerService(this._eventPubSubService); - this.sortService = new SortService(this.sharedService, this._eventPubSubService, this.backendUtilityService); + this.sortService = new SortService(this.collectionService, this.sharedService, this._eventPubSubService, this.backendUtilityService); this.treeDataService = new TreeDataService(this._eventPubSubService, this.sharedService, this.sortService); this.paginationService = new PaginationService(this._eventPubSubService, this.sharedService, this.backendUtilityService); @@ -268,6 +271,8 @@ export class AureliaSlickgridCustomElement { if (this.gridOptions.darkMode) { this.setDarkMode(true); } + + this.suggestDateParsingWhenHelpful(); } initialization(eventHandler: SlickEventHandler) { @@ -612,6 +617,8 @@ export class AureliaSlickgridCustomElement { this.grid.autosizeColumns(); this._isAutosizeColsCalled = true; } + + this.suggestDateParsingWhenHelpful(); } datasetHierarchicalChanged(newHierarchicalDataset: any[] | undefined) { @@ -745,6 +752,7 @@ export class AureliaSlickgridCustomElement { this.handleOnItemCountChanged(dataView.getFilteredItemCount() || 0, dataView.getItemCount() || 0); }); this._eventHandler.subscribe(dataView.onSetItemsCalled, (_e, args) => { + this.sharedService.isItemsDateParsed = false; this.handleOnItemCountChanged(dataView.getFilteredItemCount() || 0, args.itemCount); // when user has resize by content enabled, we'll force a full width calculation since we change our entire dataset @@ -1536,6 +1544,15 @@ export class AureliaSlickgridCustomElement { }); } + protected suggestDateParsingWhenHelpful() { + if (this.dataview?.getItemCount() > WARN_NO_PREPARSE_DATE_SIZE && !this.gridOptions.preParseDateColumns && this.grid.getColumns().some(c => isColumnDateType(c.type))) { + console.warn( + '[Slickgrid-Universal] For getting better perf, we suggest you enable the `preParseDateColumns` grid option, ' + + 'for more info visit:: https://ghiscoding.gitbook.io/slickgrid-universal/column-functionalities/sorting#pre-parse-date-columns-for-better-perf' + ); + } + } + /** * When the Editor(s) has a "editor.collection" property, we'll load the async collection. * Since this is called after the async call resolves, the pointer will not be the same as the "column" argument passed. diff --git a/packages/aurelia-slickgrid/src/extensions/__tests__/slickRowDetailView.spec.ts b/packages/aurelia-slickgrid/src/extensions/__tests__/slickRowDetailView.spec.ts index f3ee0145d..b15aa89d1 100644 --- a/packages/aurelia-slickgrid/src/extensions/__tests__/slickRowDetailView.spec.ts +++ b/packages/aurelia-slickgrid/src/extensions/__tests__/slickRowDetailView.spec.ts @@ -1,5 +1,5 @@ import { customElement } from 'aurelia'; -import { type Column, type RowDetailViewOption, SharedService, SlickEvent, SlickEventData, SlickEventHandler, type SlickGrid, SlickRowSelectionModel } from '@slickgrid-universal/common'; +import { type Column, type RowDetailViewOption, SlickEvent, SlickEventData, SlickEventHandler, type SlickGrid, SlickRowSelectionModel } from '@slickgrid-universal/common'; import { EventPubSubService } from '@slickgrid-universal/event-pub-sub'; import type { GridOption } from '../../models/gridOption.interface'; @@ -175,7 +175,6 @@ describe('SlickRowDetailView', () => { gridOptionsMock.rowDetailView!.preloadViewModel = ExamplePreload; gridOptionsMock.rowDetailView!.viewModel = ExampleLoader; columnsMock = [{ id: 'field1', field: 'field1', width: 100, cssClass: 'red' }]; - jest.spyOn(SharedService.prototype, 'slickGrid', 'get').mockReturnValue(gridStub); jest.spyOn(gridStub, 'getOptions').mockReturnValue(gridOptionsMock); jest.clearAllMocks(); gridStub.onColumnsReordered = new SlickEvent(); diff --git a/packages/demo/package.json b/packages/demo/package.json index 8ca7f3992..8d9796419 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -43,15 +43,15 @@ "@fnando/sparkline": "^0.3.10", "@formkit/tempo": "^0.1.2", "@popperjs/core": "^2.11.8", - "@slickgrid-universal/common": "^5.7.0", - "@slickgrid-universal/composite-editor-component": "^5.7.0", - "@slickgrid-universal/custom-tooltip-plugin": "^5.7.0", - "@slickgrid-universal/excel-export": "^5.7.0", - "@slickgrid-universal/graphql": "^5.7.0", - "@slickgrid-universal/odata": "^5.7.0", - "@slickgrid-universal/row-detail-view-plugin": "^5.7.0", - "@slickgrid-universal/rxjs-observable": "^5.7.0", - "@slickgrid-universal/text-export": "^5.7.0", + "@slickgrid-universal/common": "^5.8.0", + "@slickgrid-universal/composite-editor-component": "^5.8.0", + "@slickgrid-universal/custom-tooltip-plugin": "^5.8.0", + "@slickgrid-universal/excel-export": "^5.8.0", + "@slickgrid-universal/graphql": "^5.8.0", + "@slickgrid-universal/odata": "^5.8.0", + "@slickgrid-universal/row-detail-view-plugin": "^5.8.0", + "@slickgrid-universal/rxjs-observable": "^5.8.0", + "@slickgrid-universal/text-export": "^5.8.0", "aurelia": "^2.0.0-beta.21", "aurelia-slickgrid": "workspace:*", "bootstrap": "^5.3.3", diff --git a/packages/demo/src/examples/slickgrid/example4.html b/packages/demo/src/examples/slickgrid/example4.html index fd05bce16..9f80a68f3 100644 --- a/packages/demo/src/examples/slickgrid/example4.html +++ b/packages/demo/src/examples/slickgrid/example4.html @@ -42,6 +42,9 @@

click.trigger="setSortingDynamically()"> Set Sorting Dynamically + =20.0.0} dependencies: - '@slickgrid-universal/binding': 5.7.0 - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@excel-builder-vanilla/types': 3.0.7 + '@formkit/tempo': 0.1.2 + '@slickgrid-universal/binding': 5.8.0 + '@slickgrid-universal/event-pub-sub': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 + '@types/sortablejs': 1.15.8 + '@types/trusted-types': 2.0.7 + autocompleter: 9.3.2 + dequal: 2.0.3 + multiple-select-vanilla: 3.3.4 + sortablejs: 1.15.3 + un-flatten-tree: 2.0.12 + vanilla-calendar-pro: 2.9.10 + dev: false + + /@slickgrid-universal/composite-editor-component@5.8.0: + resolution: {integrity: sha512-teJ6Z/qVnYVIUN/0Q/h/7OFdySAatrZVACOXc7EBLFgyrnD80FIYxLMui2P1xkZYLsHHOmJiTueQe/8l/agYxw==} + dependencies: + '@slickgrid-universal/binding': 5.8.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 dev: false - /@slickgrid-universal/custom-footer-component@5.7.0: - resolution: {integrity: sha512-jlIrcqAH2YPoRcknH/TQuqCEHFj175QW6BB/PbXXC6GQhrJTtdiLD926+1Im/OIEcB0xjukKUG788E5qXVtLCA==} + /@slickgrid-universal/custom-footer-component@5.8.0: + resolution: {integrity: sha512-jyKIx/9wemcT1CCIHBv7HbemBPqfOK8izEQv+yd2CiwtdlhXVpnzD1qWO25Q1RpEWCN67sEdzXUVnQGmzHX5VQ==} dependencies: '@formkit/tempo': 0.1.2 - '@slickgrid-universal/binding': 5.7.0 - '@slickgrid-universal/common': 5.7.0 + '@slickgrid-universal/binding': 5.8.0 + '@slickgrid-universal/common': 5.8.0 dev: false - /@slickgrid-universal/custom-tooltip-plugin@5.7.0: - resolution: {integrity: sha512-9F7WMIuZucSd6GUfTBqLy9R0bdIMQTozhthZHUgYk9fyQm79pxKNpMsght60iJriXxWmBAh9//+lqrbBH8l1KQ==} + /@slickgrid-universal/custom-tooltip-plugin@5.8.0: + resolution: {integrity: sha512-A5ff/R+S/zK6PHBWiyoyj3gvBEnhhiE1/nsyPkXwmR9lDJresnPkS3e/LVvvlcEe2kOkiNDC//XEyNIgsiOQEQ==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 dev: false - /@slickgrid-universal/empty-warning-component@5.7.0: - resolution: {integrity: sha512-i76kMb7ShK5cj2vztYoH+kDL/CwCDd9UVZPlAKvM26TuRHguhN5ZTuNO4z1K5GyX4/zPnqcOSp00L3Zofoey2w==} + /@slickgrid-universal/empty-warning-component@5.8.0: + resolution: {integrity: sha512-fNhT1gJH45PcNISrE73220s7OqdPBHN9c6117Cc3mpu2uXj84iLUTgd66MkotglEnINketLCskolsdUCQ/zepA==} dependencies: - '@slickgrid-universal/common': 5.7.0 + '@slickgrid-universal/common': 5.8.0 dev: false /@slickgrid-universal/event-pub-sub@5.7.0: resolution: {integrity: sha512-D1M8D63zIiINCHrpBSa99uQstzqvWYCfy5lU9NIREOHB6pfD0uQcxq8z+s6hIVOnLI7Q3KsTsN7SqDdfjfXCcw==} dependencies: '@slickgrid-universal/utils': 5.7.0 + dev: true - /@slickgrid-universal/excel-export@5.7.0: - resolution: {integrity: sha512-FfC8Sb9Y9pzJFX+uUQIcTubRjlFxb1hgUq66bpAZW3blsI68JLWQ/S5JEjgJPoWM6J6Lsidzp2Tooa05CtVmwg==} + /@slickgrid-universal/event-pub-sub@5.8.0: + resolution: {integrity: sha512-77yuw4yDjRJ7zJJ8GMaTL4R1+9iMvIogT4rd7Hjc5sEH5aVLHNRK95Cgj/OaWa7SB+mlU0v0bTs22omgKbMAFg==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/utils': 5.8.0 + dev: false + + /@slickgrid-universal/excel-export@5.8.0: + resolution: {integrity: sha512-sMWOOcdjmW9HnNVqY7/YIXceX6sGVJN1XDP2qHBOvZe7aOAd3d5/AUZyl6y3GVfy9dBgxQovsxsjQEDzCf3ZqA==} + dependencies: + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 excel-builder-vanilla: 3.0.6 dev: false - /@slickgrid-universal/graphql@5.7.0: - resolution: {integrity: sha512-JHHAc7EpfzcyHPf5sgZTe0T49AKYvfwps5PguWFMF57tK2W5W/ZzBqBm9Nv3TPmegzkVnUew754CeOMitWbbOQ==} + /@slickgrid-universal/graphql@5.8.0: + resolution: {integrity: sha512-OAu4KHdL9JZtwJ0l/47UTTh9VRcNdUF7/U5j4l1oWqxBXtuUonM3qDfVL1sL+3zO85EO8SgY8RWR3NMNV/0CQA==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 dev: false - /@slickgrid-universal/odata@5.7.0: - resolution: {integrity: sha512-2/gdZABgjqMUuJzaBavEn2lhmLaXK/ZwwxU6hCAI6D9ZQXw4uHoK5ZUKriumg1+jSU+uI8pPi7HD86y7yNPTAQ==} + /@slickgrid-universal/odata@5.8.0: + resolution: {integrity: sha512-KMyoc4EJB5x+rFelVrTcCrIx6BzmKCm57NQQ3B4uXkE6fQTpCOrT5jNQ79afle6/x5WLoWcKMMlaWFpcULYgkg==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 dev: false - /@slickgrid-universal/pagination-component@5.7.0: - resolution: {integrity: sha512-U1iOld+Yju7kk6HGJumTxwcqy7kiiy4zOkfTECLw5KpTFX3n4bKZj+jpwm05uP8NdnY8Sb1KhEw+8ULK0QoLag==} + /@slickgrid-universal/pagination-component@5.8.0: + resolution: {integrity: sha512-2qwdEk+AHzq1yn9ZwPQwG6u8ljzaTSVjiYJxCXlfN6/+43IdlK6fhDkANcvAGEbFDHYDFoquT3/B971nUVerXw==} dependencies: - '@slickgrid-universal/binding': 5.7.0 - '@slickgrid-universal/common': 5.7.0 + '@slickgrid-universal/binding': 5.8.0 + '@slickgrid-universal/common': 5.8.0 dev: false - /@slickgrid-universal/row-detail-view-plugin@5.7.0: - resolution: {integrity: sha512-TR/w9wIkLk+USEYEnl41WEnJZbMUIMOzNoN7F3fvEMEUafdEGs3IX6udACphdMOIEvQcugdDT0o/98XxA7LKZA==} + /@slickgrid-universal/row-detail-view-plugin@5.8.0: + resolution: {integrity: sha512-tyEb/uJh5eg6AhUMEftp8qnzkpRPOLt8R5E7bOMAaR5Zr3Gd0Je0yioHGYEHYxeFizSqvgEzjvbp60jK1fsKUA==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 dev: false - /@slickgrid-universal/rxjs-observable@5.7.0: - resolution: {integrity: sha512-G7N92fBMb7oV/9DWct2L4Plx/h8viufkXn8mS/815FamzRpPlc5nB7e2sAkKxadDTty/NsQDW9lR9UdkyE2/Aw==} + /@slickgrid-universal/rxjs-observable@5.8.0: + resolution: {integrity: sha512-o7EK9wxoZ3WlI9cdAH3NGWQ4kl6YLR2g1fty1lX+iNq2/pBn0zapQURQoQu5rn0LCdpVmt6AgYVLjUbFjST5CQ==} dependencies: - '@slickgrid-universal/common': 5.7.0 + '@slickgrid-universal/common': 5.8.0 rxjs: 7.8.1 dev: false - /@slickgrid-universal/text-export@5.7.0: - resolution: {integrity: sha512-2EjPQheUKLTzOpazcZQhFe/i+pHq2Qiy2T+s6jPxDFo5JZ3MlEqLyBhiktb5pVDLYvVbuYLubG3KBnKKJ/3Yfw==} + /@slickgrid-universal/text-export@5.8.0: + resolution: {integrity: sha512-Z6JUIMmkEdZRLxXsSr5Bv7IFq3HNckwbVEtk9fQbWZ1Eey2ClcpHe1IL/UJEXF+csRHGfaEmX8f2gfSEdwmqhQ==} dependencies: - '@slickgrid-universal/common': 5.7.0 - '@slickgrid-universal/utils': 5.7.0 + '@slickgrid-universal/common': 5.8.0 + '@slickgrid-universal/utils': 5.8.0 text-encoding-utf-8: 1.0.2 dev: false /@slickgrid-universal/utils@5.7.0: resolution: {integrity: sha512-48+YCh9Rzs8641ZUtrBrfZarfaa50xIxni15Pd5sHURcGiXcHWfzz4t8l1r2TJFZ9JgSO3BYu7+LSrVyJzsrfw==} + dev: true + + /@slickgrid-universal/utils@5.8.0: + resolution: {integrity: sha512-fUDKcI9hsqWKeXQlQbinSYgCIFtDVwK2d3BP9mGvP7NmaWDIKkmCQzrBkPV3fHWV875pXvYHDHOyvsj13FnaXg==} + dev: false /@tootallnate/once@2.0.0: resolution: {integrity: sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==} @@ -7035,6 +7072,13 @@ packages: resolution: {integrity: sha512-SOcWuYEB3ISR3M3YohaDJgRH7Fe6nupcgp1UpefVTSvbLluzlyRaQxwQqMXFI3ePMkrX9ERY1uU3NZ9pmW//7A==} dependencies: '@types/trusted-types': 2.0.7 + dev: true + + /multiple-select-vanilla@3.3.4: + resolution: {integrity: sha512-NQuuoJqj+LY9JAhg94qvGIXPELKQpVlocuegxi1vhADvUnZSFbbgflcryO3CgcHII77zkWl82U0sFs8tLpBmlg==} + dependencies: + '@types/trusted-types': 2.0.7 + dev: false /mute-stream@1.0.0: resolution: {integrity: sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==} diff --git a/test/cypress/e2e/example04.cy.ts b/test/cypress/e2e/example04.cy.ts index e9af5759e..3f0e9227e 100644 --- a/test/cypress/e2e/example04.cy.ts +++ b/test/cypress/e2e/example04.cy.ts @@ -56,13 +56,13 @@ describe('Example 4 - Client Side Sort/Filter Grid', () => { }); }); - it('should have some metrics shown in the grid footer well below 1500 items', () => { + it('should have some metrics shown in the grid footer well below 5500 items', () => { cy.get('#slickGridContainer-grid4') .find('.slick-custom-footer') .find('.right-footer') .should($span => { const text = removeExtraSpaces($span.text()); // remove all white spaces - expect(text).not.to.eq('1500 of 1500 items'); + expect(text).not.to.eq('5500 of 5500 items'); }); }); @@ -171,7 +171,7 @@ describe('Example 4 - Client Side Sort/Filter Grid', () => { .find('.right-footer') .should($span => { const text = removeExtraSpaces($span.text()); // remove all white spaces - expect(text).to.eq('1500 of 1500 items'); + expect(text).to.eq('5500 of 5500 items'); }); });