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.

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

fix(editors): add option to skip missing composite editor #232

Merged
merged 2 commits into from
Jan 8, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
Original file line number Diff line number Diff line change
Expand Up @@ -807,11 +807,29 @@ describe('CompositeEditorService', () => {
try {
component.changeFormInputValue('field4', 'Field 4 different text');
} catch (e) {
expect(e.toString()).toContain(`Editor with column id "field4" not found`);
expect(e.toString()).toContain(`Composite Editor with column id "field4" not found`);
done();
}
});

it('should make sure Slick-Composite-Editor is being created and then call "changeFormInputValue" on an invalid Editor BUT not throw an error when user want to skip the error', () => {
const mockEditor = {
changeEditorOption: jest.fn(),
disable: jest.fn(),
setValue: jest.fn(),
} as unknown as Editor;
const mockProduct = { id: 222, address: { zip: 123456 }, product: { name: 'Product ABC', price: 12.55 } };
jest.spyOn(gridStub, 'getDataItem').mockReturnValue(mockProduct);

component = new SlickCompositeEditorComponent();
component.init(gridStub, container);
component.editors = { field3: mockEditor };
component.openDetails({ headerTitle: 'Details' });
component.changeFormInputValue('field4', 'Field 4 different text', true);

expect(component.formValues).toEqual({ field4: 'Field 4 different text' });
});

it('should make sure Slick-Composite-Editor is being created and then call "disableFormInput" to disable the field', () => {
const mockEditor = { setValue: jest.fn(), disable: jest.fn(), } as unknown as Editor;
const mockProduct = { id: 222, address: { zip: 123456 }, product: { name: 'Product ABC', price: 12.55 } };
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -119,17 +119,23 @@ export class SlickCompositeEditorComponent implements ExternalResource {
}

/**
* Dynamically change value of an input from the Composite Editor form
* Dynamically change value of an input from the Composite Editor form.
*
* NOTE: user might get an error thrown when trying to apply a value on a Composite Editor that was not found in the form,
* but in some cases the user might still want the value to be applied to the formValues so that it will be sent to the save in final item data context
* and when that happens, you can just skip that error so it won't throw.
* @param {String} columnId - column id
* @param {*} newValue - the new value
* @param {Boolean} skipMissingEditorError - skipping the error when the Composite Editor was not found will allow to still apply the value into the formValues object
*/
changeFormInputValue(columnId: string, newValue: any) {
changeFormInputValue(columnId: string, newValue: any, skipMissingEditorError = false) {
const editor = this._editors?.[columnId];
let outputValue = newValue;

if (!editor) {
throw new Error(`Editor with column id "${columnId}" not found.`);
if (!editor && !skipMissingEditorError) {
throw new Error(`Composite Editor with column id "${columnId}" not found.`);
}

if (editor && editor.setValue && Array.isArray(this._editorContainers)) {
editor.setValue(newValue, true);
const editorContainerElm = this._editorContainers.find((editorElm: HTMLElement) => editorElm.dataset.editorid === columnId);
Expand All @@ -139,8 +145,10 @@ export class SlickCompositeEditorComponent implements ExternalResource {
outputValue = '';
editorContainerElm?.classList?.remove('modified');
}
this._formValues = { ...this._formValues, [columnId]: outputValue };
}

// apply the value in the formValues object and we do it even when the editor is not found (so it also works when using skip error)
this._formValues = { ...this._formValues, [columnId]: outputValue };
}

/**
Expand Down
Binary file not shown.