Adds setter for history, tests
This commit is contained in:
parent
04b6353e41
commit
16ba3f9b98
3 changed files with 132 additions and 7 deletions
|
@ -64,5 +64,65 @@ Array [
|
||||||
},
|
},
|
||||||
"id": "create",
|
"id": "create",
|
||||||
},
|
},
|
||||||
|
Object {
|
||||||
|
"after": Object {
|
||||||
|
"document": Object {
|
||||||
|
"pageStates": Object {
|
||||||
|
"page1": Object {
|
||||||
|
"selectedIds": Array [
|
||||||
|
"rect2",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"pages": Object {
|
||||||
|
"page1": Object {
|
||||||
|
"shapes": Object {
|
||||||
|
"rect2": Object {
|
||||||
|
"childIndex": 1,
|
||||||
|
"id": "rect2",
|
||||||
|
"name": "Rectangle",
|
||||||
|
"parentId": "page1",
|
||||||
|
"point": Array [
|
||||||
|
0,
|
||||||
|
0,
|
||||||
|
],
|
||||||
|
"rotation": 0,
|
||||||
|
"size": Array [
|
||||||
|
100,
|
||||||
|
200,
|
||||||
|
],
|
||||||
|
"style": Object {
|
||||||
|
"color": "Black",
|
||||||
|
"dash": "Draw",
|
||||||
|
"isFilled": false,
|
||||||
|
"size": "Medium",
|
||||||
|
},
|
||||||
|
"type": "rectangle",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"before": Object {
|
||||||
|
"document": Object {
|
||||||
|
"pageStates": Object {
|
||||||
|
"page1": Object {
|
||||||
|
"selectedIds": Array [
|
||||||
|
"rect1",
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"pages": Object {
|
||||||
|
"page1": Object {
|
||||||
|
"shapes": Object {
|
||||||
|
"rect2": undefined,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"id": "create",
|
||||||
|
},
|
||||||
]
|
]
|
||||||
`;
|
`;
|
||||||
|
|
|
@ -361,12 +361,22 @@ describe('TLDrawState', () => {
|
||||||
})
|
})
|
||||||
|
|
||||||
it('Exposes undo/redo stack', () => {
|
it('Exposes undo/redo stack', () => {
|
||||||
const tlstate = new TLDrawState().loadDocument(mockDocument).createShapes({
|
const tlstate = new TLDrawState()
|
||||||
id: 'rect1',
|
.loadDocument(mockDocument)
|
||||||
type: TLDrawShapeType.Rectangle,
|
.createShapes({
|
||||||
point: [0, 0],
|
id: 'rect1',
|
||||||
size: [100, 200],
|
type: TLDrawShapeType.Rectangle,
|
||||||
})
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
.createShapes({
|
||||||
|
id: 'rect2',
|
||||||
|
type: TLDrawShapeType.Rectangle,
|
||||||
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
|
||||||
|
expect(tlstate.history.length).toBe(2)
|
||||||
|
|
||||||
expect(tlstate.history).toBeDefined()
|
expect(tlstate.history).toBeDefined()
|
||||||
expect(tlstate.history).toMatchSnapshot('history')
|
expect(tlstate.history).toMatchSnapshot('history')
|
||||||
|
@ -380,4 +390,59 @@ describe('TLDrawState', () => {
|
||||||
|
|
||||||
expect(before).toBe(after)
|
expect(before).toBe(after)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it('Exposes undo/redo stack up to the current pointer', () => {
|
||||||
|
const tlstate = new TLDrawState()
|
||||||
|
.loadDocument(mockDocument)
|
||||||
|
.createShapes({
|
||||||
|
id: 'rect1',
|
||||||
|
type: TLDrawShapeType.Rectangle,
|
||||||
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
.createShapes({
|
||||||
|
id: 'rect2',
|
||||||
|
type: TLDrawShapeType.Rectangle,
|
||||||
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
.undo()
|
||||||
|
|
||||||
|
expect(tlstate.history.length).toBe(1)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('Sets the undo/redo history', () => {
|
||||||
|
const tlstate = new TLDrawState('some_state_a')
|
||||||
|
.createShapes({
|
||||||
|
id: 'rect1',
|
||||||
|
type: TLDrawShapeType.Rectangle,
|
||||||
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
.createShapes({
|
||||||
|
id: 'rect2',
|
||||||
|
type: TLDrawShapeType.Rectangle,
|
||||||
|
point: [0, 0],
|
||||||
|
size: [100, 200],
|
||||||
|
})
|
||||||
|
|
||||||
|
// Save the history and document from the first state
|
||||||
|
const doc = tlstate.document
|
||||||
|
const history = tlstate.history
|
||||||
|
|
||||||
|
// Create a new state
|
||||||
|
const tlstate2 = new TLDrawState('some_state_b')
|
||||||
|
|
||||||
|
// Load the document and set the history
|
||||||
|
tlstate2.loadDocument(doc)
|
||||||
|
tlstate2.history = history
|
||||||
|
|
||||||
|
expect(tlstate2.shapes.length).toBe(2)
|
||||||
|
|
||||||
|
// We should be able to undo the change that was made on the first
|
||||||
|
// state, now that we've brought in its undo / redo stack
|
||||||
|
tlstate2.undo()
|
||||||
|
|
||||||
|
expect(tlstate2.shapes.length).toBe(1)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
|
@ -651,7 +651,7 @@ export class TLDrawState extends StateManager<Data> {
|
||||||
* Get the current undo/redo stack.
|
* Get the current undo/redo stack.
|
||||||
*/
|
*/
|
||||||
get history() {
|
get history() {
|
||||||
return this.stack
|
return this.stack.slice(0, this.pointer + 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in a new issue