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

fix: remove drop-down layer of editor #1545

Merged
merged 9 commits into from
Jan 7, 2022
Merged

fix: remove drop-down layer of editor #1545

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
eceace5
fix: editors with drop-down layer to follow scrolling
jajugoguma Dec 29, 2021
4a592b9
test: add tests for editors with drop-down layer to follow scrolling
jajugoguma Jan 3, 2022
9526681
chore: apply code reviews
jajugoguma Jan 4, 2022
f609a3f
chore: fix lint error
jajugoguma Jan 4, 2022
860475d
test: add tests for remove drop-down layer of editor
jajugoguma Jan 5, 2022
e8da849
fix: remove drop-down layer of editor
jajugoguma Jan 5, 2022
d67c4cc
chore: remove destructuring
jajugoguma Jan 6, 2022
44af5c7
chore: apply code reviews
jajugoguma Jan 7, 2022
61f83d1
Merge branch 'master' into fix/remove-drop-down-layer-of-editor
jajugoguma Jan 7, 2022
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
26 changes: 23 additions & 3 deletions packages/toast-ui.grid/cypress/integration/editor.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -345,8 +345,8 @@ it('should do synchronous rendering of the editing cell', () => {
});

describe('select, checkbox, radio editor', () => {
const dataForGridWithType = [{ name: '1' }, { name: '2' }, { name: '3' }, { name: '4' }];
function createGridWithType(type: string) {
const data = [{ name: '1' }, { name: '2' }, { name: '3' }, { name: '4' }];
const columns = [
{
name: 'name',
Expand All @@ -364,7 +364,7 @@ describe('select, checkbox, radio editor', () => {
},
];

cy.createGrid({ data, columns });
cy.createGrid({ data: dataForGridWithType, columns });
}

context('UI', () => {
Expand Down Expand Up @@ -452,6 +452,26 @@ describe('select, checkbox, radio editor', () => {
assertOptionHighlighted(3);
});
});

describe('remove drop-down layer', () => {
['radio', 'select', 'checkbox'].forEach((type) => {
it(`should remove drop-down layer when calling cancelEditing() API (${type})`, () => {
createGridWithType(type);

cy.gridInstance().invoke('cancelEditing');

cy.getByCls('editor-select-box-layer').should('be.not.visible');
});

it(`should remove drop-down layer when calling resetData() API (${type})`, () => {
createGridWithType(type);

cy.gridInstance().invoke('resetData', dataForGridWithType);

cy.getByCls('editor-select-box-layer').should('be.not.visible');
});
});
});
});

// @TODO: should rewrite test case after modifying casting editing value
Expand Down Expand Up @@ -586,7 +606,7 @@ describe('original cell value should be kept', () => {
});
});

describe.only('Scroll with editor that has drop-down layer', () => {
describe('Scroll with editor that has drop-down layer', () => {
function scrollTo(position: Cypress.PositionType) {
cy.getByCls('rside-area', 'body-area').wait(0).scrollTo(position);
}
Expand Down
12 changes: 5 additions & 7 deletions packages/toast-ui.grid/src/view/editingLayer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,9 +88,6 @@ export class EditingLayerComp extends Component<Props> {
private cancelEditing() {
const { rowKey, columnName, value } = this.getEditingCellInfo();

// eslint-disable-next-line no-unused-expressions
this.editor?.beforeDestroy?.();

this.props.dispatch('finishEditing', rowKey, columnName, value, {
save: false,
triggeredByKey: true,
Expand All @@ -104,10 +101,6 @@ export class EditingLayerComp extends Component<Props> {
const { rowKey, columnName, value } = this.getEditingCellInfo();

dispatch('setValue', rowKey, columnName, value);

// eslint-disable-next-line no-unused-expressions
this.editor?.beforeDestroy?.();

dispatch('finishEditing', rowKey, columnName, value, { save: true, triggeredByKey });
}
}
Expand Down Expand Up @@ -195,6 +188,11 @@ export class EditingLayerComp extends Component<Props> {
} = this.props;
const { focusedColumnName, focusedRowKey, active, forcedDestroyEditing } = nextProps;

if (prevActive && !active) {
// eslint-disable-next-line no-unused-expressions
this.editor?.beforeDestroy?.();
}

if (
(prevActive && !active && forcedDestroyEditing) ||
(prevActive &&
Expand Down