Skip to content

Commit

Permalink
Leverage DOMInsertPoint, remove posContainer/offset (#2538)
Browse files Browse the repository at this point in the history
  • Loading branch information
@JiuqingSong
JiuqingSong authored Mar 28, 2024
1 parent 9fde045 commit ee44e54
Show file tree
Hide file tree
Showing 12 changed files with 132 additions and 128 deletions.
12 changes: 8 additions & 4 deletions packages/roosterjs-content-model-core/lib/coreApi/formatContentModel/formatContentModel.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,8 +71,10 @@ export const formatContentModel: FormatContentModel = (core, formatter, options)
core.api.triggerEvent(core, eventData, true /*broadcast*/);

if (canUndoByBackspace && selection?.type == 'range') {
core.undo.posContainer = selection.range.startContainer;
core.undo.posOffset = selection.range.startOffset;
core.undo.autoCompleteInsertPoint = {
node: selection.range.startContainer,
offset: selection.range.startOffset,
};
}

if (shouldAddSnapshot) {
Expand Down Expand Up @@ -123,8 +125,10 @@ function handlePendingFormat(
if (pendingFormat && selection?.type == 'range' && selection.range.collapsed) {
core.format.pendingFormat = {
format: { ...pendingFormat },
posContainer: selection.range.startContainer,
posOffset: selection.range.startOffset,
insertPoint: {
node: selection.range.startContainer,
offset: selection.range.startOffset,
},
};
}
}
Expand Down
4 changes: 2 additions & 2 deletions packages/roosterjs-content-model-core/lib/corePlugin/format/FormatPlugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,9 +163,9 @@ class FormatPlugin implements PluginWithState<FormatPluginState> {
const selection = this.editor.getDOMSelection();
const range =
selection?.type == 'range' && selection.range.collapsed ? selection.range : null;
const { posContainer, posOffset } = this.state.pendingFormat;
const { node, offset } = this.state.pendingFormat.insertPoint;

if (range && range.startContainer == posContainer && range.startOffset == posOffset) {
if (range && range.startContainer == node && range.startOffset == offset) {
result = true;
}
}
Expand Down
13 changes: 5 additions & 8 deletions packages/roosterjs-content-model-core/lib/corePlugin/undo/UndoPlugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,7 @@ class UndoPlugin implements PluginWithState<UndoPluginState> {
snapshotsManager: createSnapshotsManager(options.snapshots),
isRestoring: false,
isNested: false,
posContainer: null,
posOffset: null,
autoCompleteInsertPoint: null,
lastKeyPress: null,
};
}
Expand Down Expand Up @@ -129,8 +128,7 @@ class UndoPlugin implements PluginWithState<UndoPluginState> {
if (evt.key == Backspace && !evt.ctrlKey && this.canUndoAutoComplete(editor)) {
evt.preventDefault();
undo(editor);
this.state.posContainer = null;
this.state.posOffset = null;
this.state.autoCompleteInsertPoint = null;
this.state.lastKeyPress = evt.key;
} else if (!evt.defaultPrevented) {
const selection = editor.getDOMSelection();
Expand Down Expand Up @@ -232,15 +230,14 @@ class UndoPlugin implements PluginWithState<UndoPluginState> {
this.state.snapshotsManager.canUndoAutoComplete() &&
selection?.type == 'range' &&
selection.range.collapsed &&
selection.range.startContainer == this.state.posContainer &&
selection.range.startOffset == this.state.posOffset
selection.range.startContainer == this.state.autoCompleteInsertPoint?.node &&
selection.range.startOffset == this.state.autoCompleteInsertPoint.offset
);
}

private addUndoSnapshot() {
this.editor?.takeSnapshot();
this.state.posContainer = null;
this.state.posOffset = null;
this.state.autoCompleteInsertPoint = null;
}

private isCtrlOrMetaPressed(editor: IEditor, event: KeyboardEvent) {
Expand Down
78 changes: 52 additions & 26 deletions ...es/roosterjs-content-model-core/test/coreApi/formatContentModel/formatContentModelTest.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -583,8 +583,10 @@ describe('formatContentModel', () => {
it('Has pending format, callback returns true, preserve pending format', () => {
core.format.pendingFormat = {
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
};

formatContentModel(core, (model, context) => {
Expand All @@ -594,16 +596,20 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat1,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
} as any);
});

it('Has pending format, callback returns false, preserve pending format', () => {
core.format.pendingFormat = {
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
};

formatContentModel(core, (model, context) => {
Expand All @@ -613,8 +619,10 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat1,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
} as any);
});

Expand All @@ -626,8 +634,10 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat2,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
});
});

Expand All @@ -639,16 +649,20 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat2,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
});
});

it('Has pending format, callback returns true, new format', () => {
core.format.pendingFormat = {
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
};

formatContentModel(core, (model, context) => {
Expand All @@ -658,16 +672,20 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat2,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
});
});

it('Has pending format, callback returns false, new format', () => {
core.format.pendingFormat = {
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
};

formatContentModel(core, (model, context) => {
Expand All @@ -677,16 +695,20 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat2,
posContainer: mockedStartContainer2,
posOffset: mockedStartOffset2,
insertPoint: {
node: mockedStartContainer2,
offset: mockedStartOffset2,
},
});
});

it('Has pending format, callback returns false, preserve format, selection is not collapsed', () => {
core.format.pendingFormat = {
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
};

core.api.getDOMSelection = () =>
Expand All @@ -706,8 +728,10 @@ describe('formatContentModel', () => {

expect(core.format.pendingFormat).toEqual({
format: mockedFormat1,
posContainer: mockedStartContainer1,
posOffset: mockedStartOffset1,
insertPoint: {
node: mockedStartContainer1,
offset: mockedStartOffset1,
},
});
});
});
Expand Down Expand Up @@ -809,8 +833,10 @@ describe('formatContentModel', () => {
expect(core.undo).toEqual({
isNested: false,
snapshotsManager: {},
posContainer: mockedContainer,
posOffset: mockedOffset,
autoCompleteInsertPoint: {
node: mockedContainer,
offset: mockedOffset,
},
} as any);
});

Expand Down
Loading

0 comments on commit ee44e54

Please sign in to comment.