Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore: remove any reference to internalColumnEditor #1486

Merged
merged 1 commit into from
Apr 27, 2024
Merged

chore: remove any reference to internalColumnEditor #1486

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 0 additions & 7 deletions packages/common/src/interfaces/column.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -205,13 +205,6 @@ export interface Column<T = any> {
/** ID of the column, each column definition ID must be unique or else SlickGrid will throw an error. */
id: number | string;

/**
* @deprecated @use `editor` for the editor definition or use `editorClass` for the SlickGrid editor class.
* This is a RESERVED property and is used internally by the library to copy over the Column Editor Options.
* You can read this property if you wish, but DO NOT override it (unless you know what you're doing) since could cause serious problems with your editors.
*/
internalColumnEditor?: ColumnEditor;

/** Label key, for example this could be used as a property key for complex object label display (e.g. labelKey: 'name') */
labelKey?: string;

Expand Down
46 changes: 20 additions & 26 deletions packages/vanilla-bundle/src/components/__tests__/slick-vanilla-grid.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -508,7 +508,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
component.gridOptions = { autoAddCustomEditorFormatter: customEditableInputFormatter };
component.initialization(divContainer, slickEventHandler);

expect(autoAddEditorFormatterToColumnsWithEditor).toHaveBeenCalledWith([{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }], customEditableInputFormatter);
expect(autoAddEditorFormatterToColumnsWithEditor).toHaveBeenCalledWith([{ id: 'name', field: 'name', editor: undefined }], customEditableInputFormatter);
});
});

Expand All @@ -519,7 +519,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
const updateSpy = jest.spyOn(component, 'updateColumnDefinitionsList');
const eventSpy = jest.spyOn(eventPubSubService, 'publish');
const addPubSubSpy = jest.spyOn(component.translaterService as TranslaterService, 'addPubSubMessaging');
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }];
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined }];

component.columnDefinitions = mockColDefs;
component.gridOptions = { enableTranslate: true };
Expand All @@ -540,7 +540,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
const renderSpy = jest.spyOn(extensionServiceStub, 'renderColumnHeaders');
const eventSpy = jest.spyOn(eventPubSubService, 'publish');
const addPubSubSpy = jest.spyOn(component.translaterService as TranslaterService, 'addPubSubMessaging');
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }];
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined }];

component.gridOptions = { enableTranslate: false, autoAddCustomEditorFormatter: customEditableInputFormatter };
component.columnDefinitions = mockColDefs;
Expand All @@ -552,7 +552,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
expect(eventSpy).toHaveBeenCalledTimes(4);
expect(updateSpy).toHaveBeenCalledWith(mockColDefs);
expect(renderSpy).toHaveBeenCalledWith(mockColDefs, true);
expect(autoAddEditorFormatterToColumnsWithEditor).toHaveBeenCalledWith([{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }], customEditableInputFormatter);
expect(autoAddEditorFormatterToColumnsWithEditor).toHaveBeenCalledWith([{ id: 'name', field: 'name', editor: undefined }], customEditableInputFormatter);
});
});

Expand Down Expand Up @@ -739,10 +739,8 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
component.columnDefinitions = mockColDefs;

setTimeout(() => {
expect(component.columnDefinitions[0].editor).toBeTruthy();
expect(component.columnDefinitions[0].editor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editor!.model).toEqual(Editors.text);
done();
});
});
Expand All @@ -764,10 +762,8 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
component.columnDefinitions = mockColDefs;

setTimeout(() => {
expect(component.columnDefinitions[0].editor).toBeTruthy();
expect(component.columnDefinitions[0].editor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editor!.model).toEqual(Editors.text);
expect(disableSpy).toHaveBeenCalledWith(false);
expect(destroySpy).toHaveBeenCalled();
expect(renderSpy).toHaveBeenCalledWith(mockCollection);
Expand All @@ -784,8 +780,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()

setTimeout(() => {
expect(component.columnDefinitions[0].editor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editor!.model).toEqual(Editors.text);
done();
});
});
Expand All @@ -804,8 +799,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()

setTimeout(() => {
expect(component.columnDefinitions[0].editor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editor!.model).toEqual(Editors.text);
done();
});
});
Expand All @@ -817,13 +811,13 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
const rxjsMock = new RxJsResourceStub();
component.gridOptions = { externalResources: [rxjsMock] } as unknown as GridOption;
component.registerExternalResources([rxjsMock], true);
component.initialization(divContainer, slickEventHandler);
component.columnDefinitions = mockColDefs;
component.initialization(divContainer, slickEventHandler);

setTimeout(() => {
expect(component.columnDefinitions[0].editor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.collection).toEqual(mockCollection);
expect(component.columnDefinitions[0].internalColumnEditor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editor!.model).toEqual(Editors.text);
expect(component.columnDefinitions[0].editorClass).toEqual(Editors.text);
done();
});
});
Expand Down Expand Up @@ -1473,7 +1467,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
it('should reflect columns with an extra checkbox selection column in the grid when "enableCheckboxSelector" is set', () => {
const mockColsPresets = [{ columnId: 'firstName', width: 100 }];
const mockCol = { id: 'firstName', field: 'firstName' };
const mockCols = [{ id: '_checkbox_selector', field: '_checkbox_selector', editor: undefined, internalColumnEditor: {} }, mockCol];
const mockCols = [{ id: '_checkbox_selector', field: '_checkbox_selector', editor: undefined }, mockCol];
const getAssocColSpy = jest.spyOn(gridStateServiceStub, 'getAssociatedGridColumns').mockReturnValue([mockCol]);
const setColSpy = jest.spyOn(mockGrid, 'setColumns');

Expand All @@ -1488,7 +1482,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
it('should reflect columns with an extra row detail column in the grid when "enableRowDetailView" is set', () => {
const mockColsPresets = [{ columnId: 'firstName', width: 100 }];
const mockCol = { id: 'firstName', field: 'firstName' };
const mockCols = [{ id: '_detail_selector', field: '_detail_selector', editor: undefined, internalColumnEditor: {} }, mockCol];
const mockCols = [{ id: '_detail_selector', field: '_detail_selector', editor: undefined }, mockCol];
const getAssocColSpy = jest.spyOn(gridStateServiceStub, 'getAssociatedGridColumns').mockReturnValue([mockCol]);
const setColSpy = jest.spyOn(mockGrid, 'setColumns');

Expand All @@ -1503,7 +1497,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
it('should reflect columns with an extra row move column in the grid when "enableRowMoveManager" is set', () => {
const mockColsPresets = [{ columnId: 'firstName', width: 100 }];
const mockCol = { id: 'firstName', field: 'firstName' };
const mockCols = [{ id: '_move', field: '_move', editor: undefined, internalColumnEditor: {} }, mockCol];
const mockCols = [{ id: '_move', field: '_move', editor: undefined }, mockCol];
const getAssocColSpy = jest.spyOn(gridStateServiceStub, 'getAssociatedGridColumns').mockReturnValue([mockCol]);
const setColSpy = jest.spyOn(mockGrid, 'setColumns');

Expand All @@ -1519,9 +1513,9 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
const mockColsPresets = [{ columnId: 'firstName', width: 100 }];
const mockCol = { id: 'firstName', field: 'firstName' };
const mockCols = [
{ id: '_move', field: '_move', editor: undefined, internalColumnEditor: {} },
{ id: '_checkbox_selector', field: '_checkbox_selector', editor: undefined, internalColumnEditor: {} },
{ id: '_detail_selector', field: '_detail_selector', editor: undefined, internalColumnEditor: {} },
{ id: '_move', field: '_move', editor: undefined },
{ id: '_checkbox_selector', field: '_checkbox_selector', editor: undefined },
{ id: '_detail_selector', field: '_detail_selector', editor: undefined },
mockCol
];
const getAssocColSpy = jest.spyOn(gridStateServiceStub, 'getAssociatedGridColumns').mockReturnValue([mockCol]);
Expand Down Expand Up @@ -1804,7 +1798,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()

describe('Empty Warning Message', () => {
it('should display an Empty Warning Message when "enableEmptyDataWarningMessage" is enabled and the dataset is empty', (done) => {
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }];
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined }];
const mockGridOptions = { enableTranslate: true, enableEmptyDataWarningMessage: true, };
jest.spyOn(mockGrid, 'getOptions').mockReturnValue(mockGridOptions);
jest.spyOn(mockGrid, 'getGridPosition').mockReturnValue({ top: 10, left: 20 } as any);
Expand Down Expand Up @@ -1852,7 +1846,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()

describe('Custom Footer', () => {
it('should have a Custom Footer when "showCustomFooter" is enabled and there are no Pagination used', (done) => {
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }];
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined }];
const mockGridOptions = { enableTranslate: true, showCustomFooter: true, customFooterOptions: { hideRowSelectionCount: false, } } as GridOption;
jest.spyOn(mockGrid, 'getOptions').mockReturnValue(mockGridOptions);

Expand Down Expand Up @@ -1887,7 +1881,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
});

it('should NOT have a Custom Footer when "showCustomFooter" is enabled WITH Pagination in use', (done) => {
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined, internalColumnEditor: {} }];
const mockColDefs = [{ id: 'name', field: 'name', editor: undefined }];

component.gridOptions.enablePagination = true;
component.gridOptions.showCustomFooter = true;
Expand Down
37 changes: 8 additions & 29 deletions packages/vanilla-bundle/src/components/slick-vanilla-grid-bundle.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -517,11 +517,8 @@ export class SlickVanillaGridBundle<TData = any> {
// RxJS Resource is in this lot because it has to be registered before anything else and doesn't require SlickGrid to be initialized
this.preRegisterResources();

// for convenience to the user, we provide the property "editor" as an Slickgrid-Universal editor complex object
// however "editor" is used internally by SlickGrid for it's own Editor Factory
// so in our lib we will swap "editor" and copy it into a new property called "internalColumnEditor"
// then take back "editor.model" and make it the new "editor" so that SlickGrid Editor Factory still works
this._columnDefinitions = this.swapInternalEditorToSlickGridFactoryEditor(this._columnDefinitions || []);
// prepare and load all SlickGrid editors, if an async editor is found then we'll also execute it.
this._columnDefinitions = this.loadSlickGridEditors(this._columnDefinitions || []);

// if the user wants to automatically add a Custom Editor Formatter, we need to call the auto add function again
if (this._gridOptions?.autoAddCustomEditorFormatter) {
Expand Down Expand Up @@ -1050,8 +1047,8 @@ export class SlickVanillaGridBundle<TData = any> {
*/
updateColumnDefinitionsList(newColumnDefinitions: Column<TData>[]) {
if (this.slickGrid && this._gridOptions && Array.isArray(newColumnDefinitions)) {
// map/swap the internal library Editor to the SlickGrid Editor factory
newColumnDefinitions = this.swapInternalEditorToSlickGridFactoryEditor(newColumnDefinitions);
// map the Editor model to editorClass and load editor collectionAsync
newColumnDefinitions = this.loadSlickGridEditors(newColumnDefinitions);

// if the user wants to automatically add a Custom Editor Formatter, we need to call the auto add function again
if (this._gridOptions.autoAddCustomEditorFormatter) {
Expand Down Expand Up @@ -1452,13 +1449,8 @@ export class SlickVanillaGridBundle<TData = any> {
return flatDatasetOutput;
}

/**
* For convenience to the user, we provide the property "editor" as an Slickgrid-Universal editor complex object
* however "editor" is used internally by SlickGrid for it's own Editor Factory
* so in our lib we will swap "editor" and copy it into a new property called "internalColumnEditor"
* then take back "editor.model" and make it the new "editor" so that SlickGrid Editor Factory still works
*/
protected swapInternalEditorToSlickGridFactoryEditor(columnDefinitions: Column<TData>[]): Column<TData>[] {
/** Prepare and load all SlickGrid editors, if an async editor is found then we'll also execute it. */
protected loadSlickGridEditors(columnDefinitions: Column<TData>[]): Column<TData>[] {
const columns = Array.isArray(columnDefinitions) ? columnDefinitions : [];

if (columns.some(col => `${col.id}`.includes('.'))) {
Expand All @@ -1470,32 +1462,19 @@ export class SlickVanillaGridBundle<TData = any> {
if (column.editor?.collectionAsync) {
this.loadEditorCollectionAsync(column);
}

// @deprecated `internalColumnEditor`, if there's already an internalColumnEditor we'll use it, else it would be inside the editor
const columnEditor = column.internalColumnEditor || column.editor;

return { ...column, editorClass: columnEditor?.model, internalColumnEditor: { ...columnEditor } };
return { ...column, editorClass: column.editor?.model };
});
}

/**
* Update the "internalColumnEditor.collection" property.
* 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.
* Once we found the new pointer, we will reassign the "editor" and "collection" to the "internalColumnEditor" so it has newest collection
*/
protected updateEditorCollection<U extends TData = any>(column: Column<U>, newCollection: U[]) {
if (this.slickGrid && column.editor) {
column.editor.collection = newCollection;
column.editor.disabled = false;

// find the new column reference pointer & re-assign the new editor to the internalColumnEditor
if (Array.isArray(this.columnDefinitions)) {
const columnRef = this.columnDefinitions.find((col: Column) => col.id === column.id);
if (columnRef) {
columnRef.internalColumnEditor = column.editor;
}
}

// get current Editor, remove it from the DOm then re-enable it and re-render it with the new collection.
const currentEditor = this.slickGrid.getCellEditor() as AutocompleterEditor | SelectEditor;
if (currentEditor?.disable && currentEditor?.renderDomElement) {
Expand Down
Loading