Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-09-07 09:21:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): add edgeless crud extension (#9335)

Browse Source
This commit is contained in:
Saul-Mirone
2024-12-26 08:58:06 +00:00
parent 0de4f7abbb
commit 6afa1d542f
48 changed files with 629 additions and 423 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blocksuite/presets/src/__tests__/edgeless/group.spec.ts
+27 -17
View File
@@ -5,6 +5,7 @@ import {
LayoutType,
NoteDisplayMode,
} from '@blocksuite/blocks';
import { assertExists } from '@blocksuite/global/utils';
import { DocCollection } from '@blocksuite/store';
import { beforeEach, describe, expect, test } from 'vitest';
@@ -26,9 +27,9 @@ describe('group', () => {
const map = new DocCollection.Y.Map<boolean>();
const ids = Array.from({ length: 2 })
.map(() => {
const id = service.addElement('shape', {
const id = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
map.set(id, true);
return id;
@@ -40,7 +41,7 @@ describe('group', () => {
return id;
})
);
service.addElement('group', { children: map });
service.crud.addElement('group', { children: map });
doc.captureSync();
expect(service.elements.length).toBe(3);
@@ -64,14 +65,15 @@ describe('group', () => {
const map = new DocCollection.Y.Map<boolean>();
const doc = service.doc;
const noteId = addNote(doc);
const shapeId = service.addElement('shape', {
const shapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
assertExists(shapeId);
map.set(noteId, true);
map.set(shapeId, true);
const groupId = service.addElement('group', { children: map });
const groupId = service.crud.addElement('group', { children: map });
assertExists(groupId);
expect(service.elements.length).toBe(2);
expect(doc.getBlock(noteId)).toBeDefined();
doc.captureSync();
@@ -86,14 +88,16 @@ describe('group', () => {
});
test("group's xywh should update automatically when children change", async () => {
const shape1 = service.addElement('shape', {
const shape1 = service.crud.addElement('shape', {
shapeType: 'rect',
xywh: '[0,0,100,100]',
});
const shape2 = service.addElement('shape', {
assertExists(shape1);
const shape2 = service.crud.addElement('shape', {
shapeType: 'rect',
xywh: '[100,100,100,100]',
});
assertExists(shape2);
const note1 = addNote(doc, {
displayMode: NoteDisplayMode.DocAndEdgeless,
xywh: '[200,200,800,100]',
@@ -114,7 +118,9 @@ describe('group', () => {
children.set(shape2, true);
children.set(note1, true);
const groupId = service.addElement('group', { children });
const groupId = service.crud.addElement('group', { children });
assertExists(groupId);
const group = service.getElementById(groupId) as GroupElementModel;
const assertInitial = () => {
expect(group.x).toBe(0);
@@ -139,7 +145,7 @@ describe('group', () => {
await wait();
assertInitial();
service.updateElement(note1, {
service.crud.updateElement(note1, {
xywh: '[300,300,800,100]',
});
await wait();
@@ -165,7 +171,7 @@ describe('group', () => {
await wait();
assertInitial();
service.updateElement(shape1, {
service.crud.updateElement(shape1, {
xywh: '[100,100,100,100]',
});
await wait();
@@ -182,7 +188,8 @@ describe('group', () => {
test('empty group should have all zero xywh', () => {
const map = new DocCollection.Y.Map<boolean>();
const groupId = service.addElement('group', { children: map });
const groupId = service.crud.addElement('group', { children: map });
assertExists(groupId);
const group = service.getElementById(groupId) as GroupElementModel;
expect(group.x).toBe(0);
@@ -193,9 +200,9 @@ describe('group', () => {
test('descendant of group should not contain itself', () => {
const groupIds = [1, 2, 3].map(_ => {
return service.addElement('group', {
return service.crud.addElement('group', {
children: new DocCollection.Y.Map<boolean>(),
});
}) as string;
});
const groups = groupIds.map(
id => service.getElementById(id) as GroupElementModel
@@ -245,7 +252,8 @@ describe('mindmap', () => {
},
],
};
const mindmapId = service.addElement('mindmap', { children: tree });
const mindmapId = service.crud.addElement('mindmap', { children: tree });
assertExists(mindmapId);
const mindmap = () =>
service.getElementById(mindmapId) as MindmapElementModel;
@@ -292,10 +300,11 @@ describe('mindmap', () => {
},
],
};
const mindmapId = service.addElement('mindmap', {
const mindmapId = service.crud.addElement('mindmap', {
type: LayoutType.RIGHT,
children: tree,
});
assertExists(mindmapId);
const mindmap = () =>
service.getElementById(mindmapId) as MindmapElementModel;
@@ -336,10 +345,11 @@ describe('mindmap', () => {
},
],
};
const mindmapId = service.addElement('mindmap', {
const mindmapId = service.crud.addElement('mindmap', {
type: LayoutType.RIGHT,
children: tree,
});
assertExists(mindmapId);
const mindmap = () =>
service.getElementById(mindmapId) as MindmapElementModel;
blocksuite/presets/src/__tests__/edgeless/last-props.spec.ts
+62 -36
View File
@@ -24,6 +24,7 @@ import {
ShapeType,
type TextElementModel,
} from '@blocksuite/blocks';
import { assertExists } from '@blocksuite/global/utils';
import { beforeEach, describe, expect, test } from 'vitest';
import { getDocRootBlock } from '../utils/edgeless.js';
@@ -45,10 +46,13 @@ describe('apply last props', () => {
test('shapes', () => {
// rect shape
const rectId = service.addElement('shape', { shapeType: ShapeType.Rect });
const rectId = service.crud.addElement('shape', {
shapeType: ShapeType.Rect,
});
assertExists(rectId);
const rectShape = service.getElementById(rectId) as ShapeElementModel;
expect(rectShape.fillColor).toBe(ShapeFillColor.Yellow);
service.updateElement(rectId, {
service.crud.updateElement(rectId, {
fillColor: ShapeFillColor.Orange,
});
expect(
@@ -57,12 +61,13 @@ describe('apply last props', () => {
).toBe(ShapeFillColor.Orange);
// diamond shape
const diamondId = service.addElement('shape', {
const diamondId = service.crud.addElement('shape', {
shapeType: ShapeType.Diamond,
});
assertExists(diamondId);
const diamondShape = service.getElementById(diamondId) as ShapeElementModel;
expect(diamondShape.fillColor).toBe(ShapeFillColor.Yellow);
service.updateElement(diamondId, {
service.crud.updateElement(diamondId, {
fillColor: ShapeFillColor.Blue,
});
expect(
@@ -71,15 +76,16 @@ describe('apply last props', () => {
).toBe(ShapeFillColor.Blue);
// rounded rect shape
const roundedRectId = service.addElement('shape', {
const roundedRectId = service.crud.addElement('shape', {
shapeType: ShapeType.Rect,
radius: 0.1,
});
assertExists(roundedRectId);
const roundedRectShape = service.getElementById(
roundedRectId
) as ShapeElementModel;
expect(roundedRectShape.fillColor).toBe(ShapeFillColor.Yellow);
service.updateElement(roundedRectId, {
service.crud.updateElement(roundedRectId, {
fillColor: ShapeFillColor.Green,
});
expect(
@@ -87,22 +93,27 @@ describe('apply last props', () => {
).toBe(ShapeFillColor.Green);
// apply last props
const rectId2 = service.addElement('shape', { shapeType: ShapeType.Rect });
const rectId2 = service.crud.addElement('shape', {
shapeType: ShapeType.Rect,
});
assertExists(rectId2);
const rectShape2 = service.getElementById(rectId2) as ShapeElementModel;
expect(rectShape2.fillColor).toBe(ShapeFillColor.Orange);
const diamondId2 = service.addElement('shape', {
const diamondId2 = service.crud.addElement('shape', {
shapeType: ShapeType.Diamond,
});
assertExists(diamondId2);
const diamondShape2 = service.getElementById(
diamondId2
) as ShapeElementModel;
expect(diamondShape2.fillColor).toBe(ShapeFillColor.Blue);
const roundedRectId2 = service.addElement('shape', {
const roundedRectId2 = service.crud.addElement('shape', {
shapeType: ShapeType.Rect,
radius: 0.1,
});
assertExists(roundedRectId2);
const roundedRectShape2 = service.getElementById(
roundedRectId2
) as ShapeElementModel;
@@ -110,26 +121,29 @@ describe('apply last props', () => {
});
test('connector', () => {
const id = service.addElement('connector', { mode: 0 });
const id = service.crud.addElement('connector', { mode: 0 });
assertExists(id);
const connector = service.getElementById(id) as ConnectorElementModel;
expect(connector.stroke).toBe(LineColor.Grey);
expect(connector.strokeWidth).toBe(2);
expect(connector.strokeStyle).toBe('solid');
expect(connector.frontEndpointStyle).toBe('None');
expect(connector.rearEndpointStyle).toBe('Arrow');
service.updateElement(id, { strokeWidth: 10 });
service.crud.updateElement(id, { strokeWidth: 10 });
const id2 = service.addElement('connector', { mode: 1 });
const id2 = service.crud.addElement('connector', { mode: 1 });
assertExists(id2);
const connector2 = service.getElementById(id2) as ConnectorElementModel;
expect(connector2.strokeWidth).toBe(10);
service.updateElement(id2, {
service.crud.updateElement(id2, {
labelStyle: {
color: LineColor.Magenta,
fontFamily: FontFamily.Kalam,
},
});
const id3 = service.addElement('connector', { mode: 1 });
const id3 = service.crud.addElement('connector', { mode: 1 });
assertExists(id3);
const connector3 = service.getElementById(id3) as ConnectorElementModel;
expect(connector3.strokeWidth).toBe(10);
expect(connector3.labelStyle.color).toBe(LineColor.Magenta);
@@ -137,42 +151,46 @@ describe('apply last props', () => {
});
test('brush', () => {
const id = service.addElement('brush', {});
const id = service.crud.addElement('brush', {});
assertExists(id);
const brush = service.getElementById(id) as BrushElementModel;
expect(brush.color).toEqual({
dark: LineColor.White,
light: LineColor.Black,
});
expect(brush.lineWidth).toBe(4);
service.updateElement(id, { lineWidth: 10 });
service.crud.updateElement(id, { lineWidth: 10 });
const secondBrush = service.getElementById(
service.addElement('brush', {})
service.crud.addElement('brush', {}) as string
) as BrushElementModel;
expect(secondBrush.lineWidth).toBe(10);
});
test('text', () => {
const id = service.addElement('text', {});
const id = service.crud.addElement('text', {});
assertExists(id);
const text = service.getElementById(id) as TextElementModel;
expect(text.fontSize).toBe(24);
service.updateElement(id, { fontSize: 36 });
service.crud.updateElement(id, { fontSize: 36 });
const secondText = service.getElementById(
service.addElement('text', {})
service.crud.addElement('text', {}) as string
) as TextElementModel;
expect(secondText.fontSize).toBe(36);
});
test('mindmap', () => {
const id = service.addElement('mindmap', {});
const id = service.crud.addElement('mindmap', {});
assertExists(id);
const mindmap = service.getElementById(id) as MindmapElementModel;
expect(mindmap.layoutType).toBe(LayoutType.RIGHT);
expect(mindmap.style).toBe(MindmapStyle.ONE);
service.updateElement(id, {
service.crud.updateElement(id, {
layoutType: LayoutType.BALANCE,
style: MindmapStyle.THREE,
});
const id2 = service.addElement('mindmap', {});
const id2 = service.crud.addElement('mindmap', {});
assertExists(id2);
const mindmap2 = service.getElementById(id2) as MindmapElementModel;
expect(mindmap2.layoutType).toBe(LayoutType.BALANCE);
expect(mindmap2.style).toBe(MindmapStyle.THREE);
@@ -180,27 +198,30 @@ describe('apply last props', () => {
test('edgeless-text', () => {
const surface = getSurfaceBlock(doc);
const id = service.addBlock('affine:edgeless-text', {}, surface!.id);
const id = service.crud.addBlock('affine:edgeless-text', {}, surface!.id);
assertExists(id);
const text = service.getElementById(id) as EdgelessTextBlockModel;
expect(text.color).toBe(DEFAULT_TEXT_COLOR);
expect(text.fontFamily).toBe(FontFamily.Inter);
service.updateElement(id, {
service.crud.updateElement(id, {
color: LineColor.Green,
fontFamily: FontFamily.OrelegaOne,
});
const id2 = service.addBlock('affine:edgeless-text', {}, surface!.id);
const id2 = service.crud.addBlock('affine:edgeless-text', {}, surface!.id);
assertExists(id2);
const text2 = service.getElementById(id2) as EdgelessTextBlockModel;
expect(text2.color).toBe(LineColor.Green);
expect(text2.fontFamily).toBe(FontFamily.OrelegaOne);
});
test('note', () => {
const id = service.addBlock('affine:note', {}, doc.root!.id);
const id = service.crud.addBlock('affine:note', {}, doc.root!.id);
assertExists(id);
const note = service.getElementById(id) as NoteBlockModel;
expect(note.background).toBe(DEFAULT_NOTE_BACKGROUND_COLOR);
expect(note.edgeless.style.shadowType).toBe(DEFAULT_NOTE_SHADOW);
service.updateElement(id, {
service.crud.updateElement(id, {
background: NoteBackgroundColor.Purple,
edgeless: {
style: {
@@ -209,7 +230,8 @@ describe('apply last props', () => {
},
});
const id2 = service.addBlock('affine:note', {}, doc.root!.id);
const id2 = service.crud.addBlock('affine:note', {}, doc.root!.id);
assertExists(id2);
const note2 = service.getElementById(id2) as NoteBlockModel;
expect(note2.background).toBe(NoteBackgroundColor.Purple);
expect(note2.edgeless.style.shadowType).toBe(NoteShadow.Film);
@@ -217,28 +239,32 @@ describe('apply last props', () => {
test('frame', () => {
const surface = getSurfaceBlock(doc);
const id = service.addBlock('affine:frame', {}, surface!.id);
const id = service.crud.addBlock('affine:frame', {}, surface!.id);
assertExists(id);
const note = service.getElementById(id) as FrameBlockModel;
expect(note.background).toBe('--affine-palette-transparent');
service.updateElement(id, {
service.crud.updateElement(id, {
background: FrameBackgroundColor.Purple,
});
const id2 = service.addBlock('affine:frame', {}, surface!.id);
const id2 = service.crud.addBlock('affine:frame', {}, surface!.id);
assertExists(id2);
const frame2 = service.getElementById(id2) as FrameBlockModel;
expect(frame2.background).toBe(FrameBackgroundColor.Purple);
service.updateElement(id, {
service.crud.updateElement(id2, {
background: { normal: '#def4e740' },
});
const id3 = service.addBlock('affine:frame', {}, surface!.id);
const id3 = service.crud.addBlock('affine:frame', {}, surface!.id);
assertExists(id3);
const frame3 = service.getElementById(id3) as FrameBlockModel;
expect(frame3.background).toEqual({ normal: '#def4e740' });
service.updateElement(id, {
service.crud.updateElement(id3, {
background: { light: '#a381aa23', dark: '#6e907452' },
});
const id4 = service.addBlock('affine:frame', {}, surface!.id);
const id4 = service.crud.addBlock('affine:frame', {}, surface!.id);
assertExists(id4);
const frame4 = service.getElementById(id4) as FrameBlockModel;
expect(frame4.background).toEqual({
light: '#a381aa23',
blocksuite/presets/src/__tests__/edgeless/layer.spec.ts
+83 -83
View File
@@ -45,7 +45,7 @@ describe('add new edgeless blocks or canvas elements should update layer automat
test('add note, note, shape sequentially', async () => {
addNote(doc);
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
@@ -56,7 +56,7 @@ describe('add new edgeless blocks or canvas elements should update layer automat
test('add note, shape, note sequentially', async () => {
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
addNote(doc);
@@ -68,7 +68,7 @@ describe('add new edgeless blocks or canvas elements should update layer automat
test('delete element should update layer automatically', () => {
const id = addNote(doc);
const canvasElId = service.addElement('shape', {
const canvasElId = service.crud.addElement('shape', {
shapeType: 'rect',
});
@@ -76,20 +76,20 @@ test('delete element should update layer automatically', () => {
expect(service.layer.layers.length).toBe(1);
service.removeElement(canvasElId);
service.removeElement(canvasElId!);
expect(service.layer.layers.length).toBe(0);
});
test('change element should update layer automatically', async () => {
const id = addNote(doc);
const canvasElId = service.addElement('shape', {
const canvasElId = service.crud.addElement('shape', {
shapeType: 'rect',
});
await wait();
service.updateElement(id, {
service.crud.updateElement(id, {
index: service.layer.getReorderedIndex(
service.getElementById(id)!,
'forward'
@@ -99,9 +99,9 @@ test('change element should update layer automatically', async () => {
'block'
);
service.updateElement(canvasElId, {
service.crud.updateElement(canvasElId!, {
index: service.layer.getReorderedIndex(
service.getElementById(canvasElId)!,
service.getElementById(canvasElId!)!,
'forward'
),
});
@@ -112,7 +112,7 @@ test('change element should update layer automatically', async () => {
test('new added canvas elements should be placed in the topmost canvas layer', async () => {
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
@@ -130,11 +130,11 @@ test("there should be at lease one layer in canvasLayers property even there's n
test('if the topmost layer is canvas layer, the length of canvasLayers array should equal to the counts of canvas layers', () => {
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
@@ -145,11 +145,11 @@ test('if the topmost layer is canvas layer, the length of canvasLayers array sho
});
test('a new layer should be created in canvasLayers prop when the topmost layer is not canvas layer', () => {
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
addNote(doc);
@@ -162,13 +162,13 @@ test('layer zindex should update correctly when elements changed', async () => {
const noteId = addNote(doc);
const note = service.getElementById(noteId);
addNote(doc);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
const topShapeId = service.addElement('shape', {
const topShapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
const topShape = service.getElementById(topShapeId);
const topShape = service.getElementById(topShapeId!)!;
await wait();
@@ -183,7 +183,7 @@ test('layer zindex should update correctly when elements changed', async () => {
service.doc.captureSync();
service.updateElement(noteId, {
service.crud.updateElement(noteId, {
index: service.layer.getReorderedIndex(note!, 'front'),
});
await wait();
@@ -198,7 +198,7 @@ test('layer zindex should update correctly when elements changed', async () => {
};
assert2StepState();
service.updateElement(topShapeId, {
service.crud.updateElement(topShapeId!, {
index: service.layer.getReorderedIndex(topShape!, 'front'),
});
await wait();
@@ -235,7 +235,7 @@ test('blocks should rerender when their z-index changed', async () => {
await wait();
assertBlocksContent();
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
index: CommonUtils.generateKeyBetween(
service.getElementById(blocks[1])!.index,
@@ -252,19 +252,19 @@ describe('layer reorder functionality', () => {
beforeEach(() => {
ids = [
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
];
});
test('forward', async () => {
service.updateElement(ids[0], {
service.crud.updateElement(ids[0], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[0])!,
'forward'
@@ -284,7 +284,7 @@ describe('layer reorder functionality', () => {
await wait();
service.updateElement(ids[1], {
service.crud.updateElement(ids[1], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[1])!,
'forward'
@@ -304,7 +304,7 @@ describe('layer reorder functionality', () => {
});
test('front', async () => {
service.updateElement(ids[0], {
service.crud.updateElement(ids[0], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[0])!,
'front'
@@ -319,7 +319,7 @@ describe('layer reorder functionality', () => {
)
).toBe(3);
service.updateElement(ids[1], {
service.crud.updateElement(ids[1], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[1])!,
'front'
@@ -334,7 +334,7 @@ describe('layer reorder functionality', () => {
});
test('backward', async () => {
service.updateElement(ids[3], {
service.crud.updateElement(ids[3], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[3])!,
'backward'
@@ -354,7 +354,7 @@ describe('layer reorder functionality', () => {
await wait();
service.updateElement(ids[2], {
service.crud.updateElement(ids[2], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[2])!,
'backward'
@@ -374,7 +374,7 @@ describe('layer reorder functionality', () => {
});
test('back', async () => {
service.updateElement(ids[3], {
service.crud.updateElement(ids[3], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[3])!,
'back'
@@ -389,7 +389,7 @@ describe('layer reorder functionality', () => {
await wait();
service.updateElement(ids[2], {
service.crud.updateElement(ids[2], {
index: service.layer.getReorderedIndex(
service.getElementById(ids[2])!,
'back'
@@ -412,7 +412,7 @@ describe('group related functionality', () => {
const children = new DocCollection.Y.Map<boolean>();
childIds.forEach(id => children.set(id, true));
return service.addElement('group', {
return service.crud.addElement('group', {
children,
});
};
@@ -420,17 +420,17 @@ describe('group related functionality', () => {
test("new added group should effect it children's layer", async () => {
const edgeless = getDocRootBlock(doc, editor, 'edgeless');
const elements = [
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
];
await wait(0);
@@ -490,23 +490,23 @@ describe('group related functionality', () => {
test("change group index should update its children's layer", () => {
const elements = [
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
];
const groupId = createGroup(
service,
elements.filter((_, idx) => idx !== 1 && idx !== 3)
);
)!;
const group = service.getElementById(groupId)!;
expect(service.layer.layers.length).toBe(2);
@@ -525,17 +525,17 @@ describe('group related functionality', () => {
test('should keep relative index order of elements after group, ungroup, undo, redo', () => {
const edgeless = getDocRootBlock(doc, editor, 'edgeless');
const elementIds = [
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
addNote(doc),
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
}),
})!,
];
service.doc.captureSync();
const elements = elementIds.map(id => service.getElementById(id)!);
@@ -549,7 +549,7 @@ describe('group related functionality', () => {
expect(isKeptRelativeOrder()).toBeTruthy();
const groupId = createGroup(edgeless.service, elementIds);
const groupId = createGroup(edgeless.service, elementIds)!;
expect(isKeptRelativeOrder()).toBeTruthy();
service.ungroup(service.getElementById(groupId) as GroupElementModel);
@@ -577,19 +577,19 @@ describe('compare function', () => {
const children = new DocCollection.Y.Map<boolean>();
childIds.forEach(id => children.set(id, true));
return service.addElement('group', {
return service.crud.addElement('group', {
children,
});
};
test('compare same element', () => {
const shapeId = service.addElement('shape', {
const shapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const shapeEl = service.getElementById(shapeId)!;
expect(service.layer.compare(shapeEl, shapeEl)).toBe(SORT_ORDER.SAME);
const groupId = createGroup(service, [shapeId]);
const groupId = createGroup(service, [shapeId])!;
const groupEl = service.getElementById(groupId)!;
expect(service.layer.compare(groupEl, groupEl)).toBe(SORT_ORDER.SAME);
@@ -599,13 +599,13 @@ describe('compare function', () => {
});
test('compare a group and its child', () => {
const shapeId = service.addElement('shape', {
const shapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const shapeEl = service.getElementById(shapeId)!;
const noteId = addNote(doc);
const note = service.getElementById(noteId)! as NoteBlockModel;
const groupId = createGroup(service, [shapeId, noteId]);
const groupId = createGroup(service, [shapeId, noteId])!;
const groupEl = service.getElementById(groupId)!;
expect(service.layer.compare(groupEl, shapeEl)).toBe(SORT_ORDER.BEFORE);
@@ -615,13 +615,13 @@ describe('compare function', () => {
});
test('compare two different elements', () => {
const shape1Id = service.addElement('shape', {
const shape1Id = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const shape1 = service.getElementById(shape1Id)!;
const shape2Id = service.addElement('shape', {
const shape2Id = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const shape2 = service.getElementById(shape2Id)!;
const note1Id = addNote(doc);
@@ -643,12 +643,12 @@ describe('compare function', () => {
});
test('compare nested elements', () => {
const shape1Id = service.addElement('shape', {
const shape1Id = service.crud.addElement('shape', {
shapeType: 'rect',
});
const shape2Id = service.addElement('shape', {
})!;
const shape2Id = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const note1Id = addNote(doc);
const note2Id = addNote(doc);
const group1Id = createGroup(service, [
@@ -656,8 +656,8 @@ describe('compare function', () => {
shape2Id,
note1Id,
note2Id,
]);
const group2Id = createGroup(service, [group1Id]);
])!;
const group2Id = createGroup(service, [group1Id])!;
const shape1 = service.getElementById(shape1Id)!;
const shape2 = service.getElementById(shape2Id)!;
@@ -688,24 +688,24 @@ describe('compare function', () => {
});
test('compare two nested elements', () => {
const groupAShapeId = service.addElement('shape', {
const groupAShapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const groupANoteId = addNote(doc);
const groupAId = createGroup(service, [
createGroup(service, [groupAShapeId, groupANoteId]),
]);
createGroup(service, [groupAShapeId, groupANoteId])!,
])!;
const groupAShape = service.getElementById(groupAShapeId)!;
const groupANote = service.getElementById(groupANoteId)!;
const groupA = service.getElementById(groupAId)!;
const groupBShapeId = service.addElement('shape', {
const groupBShapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const groupBNoteId = addNote(doc);
const groupBId = createGroup(service, [
createGroup(service, [groupBShapeId, groupBNoteId]),
]);
createGroup(service, [groupBShapeId, groupBNoteId])!,
])!;
const groupBShape = service.getElementById(groupBShapeId)!;
const groupBNote = service.getElementById(groupBNoteId)!;
const groupB = service.getElementById(groupBId)!;
@@ -759,17 +759,17 @@ describe('compare function', () => {
test('indexed canvas should be inserted into edgeless portal when switch to edgeless mode', async () => {
let surface = getSurface(doc, editor);
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
addNote(doc);
await wait();
service.addElement('shape', {
service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
editor.mode = 'page';
await wait();
@@ -855,9 +855,9 @@ describe('index generator', () => {
let preinsertedNote: NoteBlockModel;
beforeEach(() => {
const shapeId = service.addElement('shape', {
const shapeId = service.crud.addElement('shape', {
shapeType: 'rect',
});
})!;
const noteId = addNote(doc);
preinsertedShape = service.getElementById(
blocksuite/presets/src/__tests__/edgeless/surface-ref.spec.ts
+9 -9
View File
@@ -29,20 +29,20 @@ describe('basic', () => {
noteAId = addNote(doc, {
index: service.generateIndex(),
});
shapeAId = service.addElement('shape', {
shapeAId = service.crud.addElement('shape', {
type: 'rect',
xywh: '[0, 0, 100, 100]',
index: service.generateIndex(),
});
})!;
noteBId = addNote(doc, {
index: service.generateIndex(),
});
shapeBId = service.addElement('shape', {
shapeBId = service.crud.addElement('shape', {
type: 'rect',
xywh: '[100, 0, 100, 100]',
index: service.generateIndex(),
});
frameId = service.addBlock(
})!;
frameId = service.crud.addBlock(
'affine:frame',
{
xywh: '[0, 0, 800, 200]',
@@ -122,7 +122,7 @@ describe('basic', () => {
});
test('content in group should be rendered in the correct order', async () => {
const groupId = service.addElement('group', {
const groupId = service.crud.addElement('group', {
children: {
[shapeAId]: true,
[shapeBId]: true,
@@ -186,14 +186,14 @@ describe('basic', () => {
});
test('group should be rendered in surface-ref viewport', async () => {
const groupId = service.addElement('group', {
const groupId = service.crud.addElement('group', {
children: {
[shapeAId]: true,
[shapeBId]: true,
[noteAId]: true,
[noteBId]: true,
},
});
})!;
const surfaceRefId = doc.addBlock(
'affine:surface-ref',
{
@@ -247,7 +247,7 @@ describe('basic', () => {
});
test('view in edgeless mode button', async () => {
const groupId = service.addElement('group', {
const groupId = service.crud.addElement('group', {
children: {
[shapeAId]: true,
[shapeBId]: true,
blocksuite/presets/src/__tests__/edgeless/tools.spec.ts
+3 -3
View File
@@ -26,7 +26,7 @@ describe('default tool', () => {
});
test('element click selection', async () => {
const id = service.addElement('shape', {
const id = service.crud.addElement('shape', {
shapeType: 'rect',
xywh: '[0,0,100,100]',
fillColor: 'red',
@@ -47,7 +47,7 @@ describe('default tool', () => {
});
test('element drag moving', async () => {
const id = edgeless.service.addElement('shape', {
const id = edgeless.service.crud.addElement('shape', {
shapeType: 'rect',
xywh: '[0,0,100,100]',
fillColor: 'red',
@@ -64,7 +64,7 @@ describe('default tool', () => {
drag(edgeless.host, { x: 0, y: 50 }, { x: 0, y: 150 });
await wait();
const element = service.getElementById(id)!;
const element = service.getElementById(id!)!;
expect(element.xywh).toEqual(`[0,100,100,100]`);
});