Просмотр исходного кода

test(commands): add coverage for when commands shouldn't run

main
Tais Massaro 3 лет назад
Родитель
Сommit
367f2c5cd0

+ 51
- 47
packages/tldraw/src/state/command/align/align.command.spec.ts Просмотреть файл

@@ -5,69 +5,73 @@ import { AlignType } from '~types'
5 5
 describe('Align command', () => {
6 6
   const tlstate = new TLDrawState()
7 7
 
8
-  it('does, undoes and redoes command', () => {
9
-    tlstate.loadDocument(mockDocument)
10
-    tlstate.selectAll()
11
-    tlstate.align(AlignType.Top)
8
+  describe('when less than two shapes are selected', () => {
9
+    it('does nothing', () => {
10
+      tlstate.loadDocument(mockDocument).select('rect2')
11
+      const initialState = tlstate.state
12
+      tlstate.align(AlignType.Top)
13
+      const currentState = tlstate.state
14
+
15
+      expect(currentState).toEqual(initialState)
16
+    })
17
+  })
12 18
 
13
-    expect(tlstate.getShape('rect2').point).toEqual([100, 0])
19
+  describe('when multiple shapes are selected', () => {
20
+    beforeEach(() => {
21
+      tlstate.loadDocument(mockDocument)
22
+      tlstate.selectAll()
23
+    })
14 24
 
15
-    tlstate.undo()
25
+    it('does, undoes and redoes command', () => {
26
+      tlstate.align(AlignType.Top)
16 27
 
17
-    expect(tlstate.getShape('rect2').point).toEqual([100, 100])
28
+      expect(tlstate.getShape('rect2').point).toEqual([100, 0])
18 29
 
19
-    tlstate.redo()
30
+      tlstate.undo()
20 31
 
21
-    expect(tlstate.getShape('rect2').point).toEqual([100, 0])
22
-  })
32
+      expect(tlstate.getShape('rect2').point).toEqual([100, 100])
23 33
 
24
-  it('aligns top', () => {
25
-    tlstate.loadDocument(mockDocument)
26
-    tlstate.selectAll()
27
-    tlstate.align(AlignType.Top)
34
+      tlstate.redo()
28 35
 
29
-    expect(tlstate.getShape('rect2').point).toEqual([100, 0])
30
-  })
36
+      expect(tlstate.getShape('rect2').point).toEqual([100, 0])
37
+    })
31 38
 
32
-  it('aligns right', () => {
33
-    tlstate.loadDocument(mockDocument)
34
-    tlstate.selectAll()
35
-    tlstate.align(AlignType.Right)
39
+    it('aligns top', () => {
40
+      tlstate.align(AlignType.Top)
36 41
 
37
-    expect(tlstate.getShape('rect1').point).toEqual([100, 0])
38
-  })
42
+      expect(tlstate.getShape('rect2').point).toEqual([100, 0])
43
+    })
39 44
 
40
-  it('aligns bottom', () => {
41
-    tlstate.loadDocument(mockDocument)
42
-    tlstate.selectAll()
43
-    tlstate.align(AlignType.Bottom)
45
+    it('aligns right', () => {
46
+      tlstate.align(AlignType.Right)
44 47
 
45
-    expect(tlstate.getShape('rect1').point).toEqual([0, 100])
46
-  })
48
+      expect(tlstate.getShape('rect1').point).toEqual([100, 0])
49
+    })
47 50
 
48
-  it('aligns left', () => {
49
-    tlstate.loadDocument(mockDocument)
50
-    tlstate.selectAll()
51
-    tlstate.align(AlignType.Left)
51
+    it('aligns bottom', () => {
52
+      tlstate.align(AlignType.Bottom)
52 53
 
53
-    expect(tlstate.getShape('rect2').point).toEqual([0, 100])
54
-  })
54
+      expect(tlstate.getShape('rect1').point).toEqual([0, 100])
55
+    })
55 56
 
56
-  it('aligns center horizontal', () => {
57
-    tlstate.loadDocument(mockDocument)
58
-    tlstate.selectAll()
59
-    tlstate.align(AlignType.CenterHorizontal)
57
+    it('aligns left', () => {
58
+      tlstate.align(AlignType.Left)
60 59
 
61
-    expect(tlstate.getShape('rect1').point).toEqual([50, 0])
62
-    expect(tlstate.getShape('rect2').point).toEqual([50, 100])
63
-  })
60
+      expect(tlstate.getShape('rect2').point).toEqual([0, 100])
61
+    })
62
+
63
+    it('aligns center horizontal', () => {
64
+      tlstate.align(AlignType.CenterHorizontal)
65
+
66
+      expect(tlstate.getShape('rect1').point).toEqual([50, 0])
67
+      expect(tlstate.getShape('rect2').point).toEqual([50, 100])
68
+    })
64 69
 
65
-  it('aligns center vertical', () => {
66
-    tlstate.loadDocument(mockDocument)
67
-    tlstate.selectAll()
68
-    tlstate.align(AlignType.CenterVertical)
70
+    it('aligns center vertical', () => {
71
+      tlstate.align(AlignType.CenterVertical)
69 72
 
70
-    expect(tlstate.getShape('rect1').point).toEqual([0, 50])
71
-    expect(tlstate.getShape('rect2').point).toEqual([100, 50])
73
+      expect(tlstate.getShape('rect1').point).toEqual([0, 50])
74
+      expect(tlstate.getShape('rect2').point).toEqual([100, 50])
75
+    })
72 76
   })
73 77
 })

+ 15
- 1
packages/tldraw/src/state/command/create/create.command.spec.ts Просмотреть файл

@@ -4,8 +4,22 @@ import { mockDocument } from '~test'
4 4
 describe('Create command', () => {
5 5
   const tlstate = new TLDrawState()
6 6
 
7
-  it('does, undoes and redoes command', () => {
7
+  beforeEach(() => {
8 8
     tlstate.loadDocument(mockDocument)
9
+  })
10
+
11
+  describe('when no shape is provided', () => {
12
+    it('does nothing', () => {
13
+      const initialState = tlstate.state
14
+      tlstate.create()
15
+
16
+      const currentState = tlstate.state
17
+
18
+      expect(currentState).toEqual(initialState)
19
+    })
20
+  })
21
+
22
+  it('does, undoes and redoes command', () => {
9 23
     const shape = { ...tlstate.getShape('rect1'), id: 'rect4' }
10 24
     tlstate.create(shape)
11 25
 

+ 14
- 1
packages/tldraw/src/state/command/delete-page/delete-page.command.spec.ts Просмотреть файл

@@ -4,9 +4,22 @@ import { mockDocument } from '~test'
4 4
 describe('Delete page', () => {
5 5
   const tlstate = new TLDrawState()
6 6
 
7
-  it('does, undoes and redoes command', () => {
7
+  beforeEach(() => {
8 8
     tlstate.loadDocument(mockDocument)
9
+  })
10
+
11
+  describe('when there are no pages in the current document', () => {
12
+    it('does nothing', () => {
13
+      tlstate.resetDocument()
14
+      const initialState = tlstate.state
15
+      tlstate.deletePage('page1')
16
+      const currentState = tlstate.state
9 17
 
18
+      expect(currentState).toEqual(initialState)
19
+    })
20
+  })
21
+
22
+  it('does, undoes and redoes command', () => {
10 23
     const initialId = tlstate.currentPageId
11 24
 
12 25
     tlstate.createPage()

+ 19
- 17
packages/tldraw/src/state/command/delete/delete.command.spec.ts Просмотреть файл

@@ -6,8 +6,21 @@ import type { TLDrawShape } from '~types'
6 6
 describe('Delete command', () => {
7 7
   const tlstate = new TLDrawState()
8 8
 
9
-  it('does, undoes and redoes command', () => {
9
+  beforeEach(() => {
10 10
     tlstate.loadDocument(mockDocument)
11
+  })
12
+
13
+  describe('when no shape is selected', () => {
14
+    it('does nothing', () => {
15
+      const initialState = tlstate.state
16
+      tlstate.delete()
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
22
+
23
+  it('does, undoes and redoes command', () => {
11 24
     tlstate.select('rect2')
12 25
     tlstate.delete()
13 26
 
@@ -26,7 +39,6 @@ describe('Delete command', () => {
26 39
   })
27 40
 
28 41
   it('deletes two shapes', () => {
29
-    tlstate.loadDocument(mockDocument)
30 42
     tlstate.selectAll()
31 43
     tlstate.delete()
32 44
 
@@ -45,8 +57,6 @@ describe('Delete command', () => {
45 57
   })
46 58
 
47 59
   it('deletes bound shapes', () => {
48
-    tlstate.loadDocument(mockDocument)
49
-
50 60
     expect(Object.values(tlstate.page.bindings)[0]).toBe(undefined)
51 61
 
52 62
     tlstate
@@ -86,26 +96,18 @@ describe('Delete command', () => {
86 96
     expect(tlstate.getShape('arrow1').handles?.start.bindingId).toBe(undefined)
87 97
   })
88 98
 
89
-  describe('when deleting grouped shapes', () => {
99
+  describe('when deleting shapes in a group', () => {
90 100
     it('updates the group', () => {
91
-      tlstate
92
-        .loadDocument(mockDocument)
93
-        .group(['rect1', 'rect2', 'rect3'], 'newGroup')
94
-        .select('rect1')
95
-        .delete()
101
+      tlstate.group(['rect1', 'rect2', 'rect3'], 'newGroup').select('rect1').delete()
96 102
 
97 103
       expect(tlstate.getShape('rect1')).toBeUndefined()
98 104
       expect(tlstate.getShape('newGroup').children).toStrictEqual(['rect2', 'rect3'])
99 105
     })
100 106
   })
101 107
 
102
-  describe('when deleting shapes with children', () => {
103
-    it('also deletes the children', () => {
104
-      tlstate
105
-        .loadDocument(mockDocument)
106
-        .group(['rect1', 'rect2'], 'newGroup')
107
-        .select('newGroup')
108
-        .delete()
108
+  describe('when deleting a group', () => {
109
+    it('deletes all grouped shapes', () => {
110
+      tlstate.group(['rect1', 'rect2'], 'newGroup').select('newGroup').delete()
109 111
 
110 112
       expect(tlstate.getShape('rect1')).toBeUndefined()
111 113
       expect(tlstate.getShape('rect2')).toBeUndefined()

+ 18
- 3
packages/tldraw/src/state/command/distribute/distribute.command.spec.ts Просмотреть файл

@@ -4,11 +4,26 @@ import { DistributeType } from '~types'
4 4
 
5 5
 describe('Distribute command', () => {
6 6
   const tlstate = new TLDrawState()
7
-  tlstate.loadDocument(mockDocument)
8
-  tlstate.selectAll()
7
+
8
+  beforeEach(() => {
9
+    tlstate.loadDocument(mockDocument)
10
+  })
11
+
12
+  describe('when less than three shapes are selected', () => {
13
+    it('does nothing', () => {
14
+      tlstate.select('rect1', 'rect2')
15
+      const initialState = tlstate.state
16
+      tlstate.distribute(DistributeType.Horizontal)
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
9 22
 
10 23
   it('does, undoes and redoes command', () => {
24
+    tlstate.selectAll()
11 25
     tlstate.distribute(DistributeType.Horizontal)
26
+
12 27
     expect(tlstate.getShape('rect3').point).toEqual([50, 20])
13 28
     tlstate.undo()
14 29
     expect(tlstate.getShape('rect3').point).toEqual([20, 20])
@@ -17,9 +32,9 @@ describe('Distribute command', () => {
17 32
   })
18 33
 
19 34
   it('distributes vertically', () => {
20
-    tlstate.loadDocument(mockDocument)
21 35
     tlstate.selectAll()
22 36
     tlstate.distribute(DistributeType.Vertical)
37
+
23 38
     expect(tlstate.getShape('rect3').point).toEqual([20, 50])
24 39
   })
25 40
 })

+ 17
- 5
packages/tldraw/src/state/command/duplicate/duplicate.command.spec.ts Просмотреть файл

@@ -1,14 +1,28 @@
1 1
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
2 2
 import { TLDrawState } from '~state'
3 3
 import { mockDocument } from '~test'
4
-import { ArrowShape, GroupShape, TLDrawShapeType } from '~types'
4
+import { ArrowShape, TLDrawShapeType } from '~types'
5 5
 
6 6
 describe('Duplicate command', () => {
7 7
   const tlstate = new TLDrawState()
8
-  tlstate.loadDocument(mockDocument)
9
-  tlstate.select('rect1')
8
+
9
+  beforeEach(() => {
10
+    tlstate.loadDocument(mockDocument)
11
+  })
12
+
13
+  describe('when no shape is selected', () => {
14
+    it('does nothing', () => {
15
+      const initialState = tlstate.state
16
+      tlstate.duplicate()
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
10 22
 
11 23
   it('does, undoes and redoes command', () => {
24
+    tlstate.select('rect1')
25
+
12 26
     expect(Object.keys(tlstate.getPage().shapes).length).toBe(3)
13 27
 
14 28
     tlstate.duplicate()
@@ -121,7 +135,6 @@ describe('Duplicate command', () => {
121 135
     })
122 136
 
123 137
     it('duplicates groups', () => {
124
-      tlstate.loadDocument(mockDocument)
125 138
       tlstate.group(['rect1', 'rect2'], 'newGroup').select('newGroup')
126 139
 
127 140
       const beforeShapeIds = Object.keys(tlstate.page.shapes)
@@ -140,7 +153,6 @@ describe('Duplicate command', () => {
140 153
     })
141 154
 
142 155
     it('duplicates grouped shapes', () => {
143
-      tlstate.loadDocument(mockDocument)
144 156
       tlstate.group(['rect1', 'rect2'], 'newGroup').select('rect1')
145 157
 
146 158
       const beforeShapeIds = Object.keys(tlstate.page.shapes)

+ 14
- 3
packages/tldraw/src/state/command/flip/flip.command.spec.ts Просмотреть файл

@@ -5,8 +5,21 @@ import type { RectangleShape } from '~types'
5 5
 describe('Flip command', () => {
6 6
   const tlstate = new TLDrawState()
7 7
 
8
-  it('does, undoes and redoes command', () => {
8
+  beforeEach(() => {
9 9
     tlstate.loadDocument(mockDocument)
10
+  })
11
+
12
+  describe('when no shape is selected', () => {
13
+    it('does nothing', () => {
14
+      const initialState = tlstate.state
15
+      tlstate.flipHorizontal()
16
+      const currentState = tlstate.state
17
+
18
+      expect(currentState).toEqual(initialState)
19
+    })
20
+  })
21
+
22
+  it('does, undoes and redoes command', () => {
10 23
     tlstate.select('rect1', 'rect2')
11 24
     tlstate.flipHorizontal()
12 25
 
@@ -22,7 +35,6 @@ describe('Flip command', () => {
22 35
   })
23 36
 
24 37
   it('flips horizontally', () => {
25
-    tlstate.loadDocument(mockDocument)
26 38
     tlstate.select('rect1', 'rect2')
27 39
     tlstate.flipHorizontal()
28 40
 
@@ -30,7 +42,6 @@ describe('Flip command', () => {
30 42
   })
31 43
 
32 44
   it('flips vertically', () => {
33
-    tlstate.loadDocument(mockDocument)
34 45
     tlstate.select('rect1', 'rect2')
35 46
     tlstate.flipVertical()
36 47
 

+ 10
- 11
packages/tldraw/src/state/command/group/group.command.spec.ts Просмотреть файл

@@ -6,8 +6,11 @@ import { GroupShape, TLDrawShape, TLDrawShapeType } from '~types'
6 6
 describe('Group command', () => {
7 7
   const tlstate = new TLDrawState()
8 8
 
9
-  it('does, undoes and redoes command', () => {
9
+  beforeEach(() => {
10 10
     tlstate.loadDocument(mockDocument)
11
+  })
12
+
13
+  it('does, undoes and redoes command', () => {
11 14
     tlstate.group(['rect1', 'rect2'], 'newGroup')
12 15
 
13 16
     expect(tlstate.getShape<GroupShape>('newGroup')).toBeTruthy()
@@ -23,7 +26,6 @@ describe('Group command', () => {
23 26
 
24 27
   describe('when less than two shapes are selected', () => {
25 28
     it('does nothing', () => {
26
-      tlstate.loadDocument(mockDocument)
27 29
       tlstate.deselectAll()
28 30
 
29 31
       // @ts-ignore
@@ -49,8 +51,6 @@ describe('Group command', () => {
49 51
     */
50 52
 
51 53
     it('creates a group with the correct props', () => {
52
-      tlstate.loadDocument(mockDocument)
53
-
54 54
       tlstate.updateShapes(
55 55
         {
56 56
           id: 'rect1',
@@ -74,8 +74,6 @@ describe('Group command', () => {
74 74
     })
75 75
 
76 76
     it('reparents the grouped shapes', () => {
77
-      tlstate.loadDocument(mockDocument)
78
-
79 77
       tlstate.updateShapes(
80 78
         {
81 79
           id: 'rect1',
@@ -114,9 +112,9 @@ describe('Group command', () => {
114 112
     })
115 113
   })
116 114
 
117
-  describe('when grouping shapes that are the child of another group', () => {
115
+  describe('when grouping shapes that already belong to a group', () => {
118 116
     /*
119
-    Do not allow groups to nest. All groups should be the parent of
117
+    Do not allow groups to nest. All groups should be children of
120 118
     the page: a group should never be the child of a different group.
121 119
     This is a UX decision as much as a technical one.
122 120
     */
@@ -125,7 +123,8 @@ describe('Group command', () => {
125 123
       /*
126 124
       When the selected shapes are the children of another group, and so
127 125
       long as the children do not represent ALL of the group's children,
128
-      then a new group should be created that is a child of the parent group.
126
+      then a new group should be created from the selected shapes and the
127
+      original group be updated to only contain the remaining ones.
129 128
       */
130 129
 
131 130
       tlstate.resetDocument().createShapes(
@@ -206,7 +205,7 @@ describe('Group command', () => {
206 205
       expect(tlstate.getShape<GroupShape>('newGroupB').children).toStrictEqual(['rect1', 'rect3'])
207 206
     })
208 207
 
209
-    it('does not group shapes if shapes are all the groups children', () => {
208
+    it('does nothing if all shapes in the group are selected', () => {
210 209
       /*
211 210
       If the selected shapes represent ALL of the children of the a
212 211
       group, then no effect should occur.
@@ -269,7 +268,7 @@ describe('Group command', () => {
269 268
       ])
270 269
     })
271 270
 
272
-    it('marges selected groups that no longer have children', () => {
271
+    it('merges selected groups that no longer have children', () => {
273 272
       /*
274 273
       If the user is creating a group while having selected other
275 274
       groups, then the selected groups should be destroyed and a new

+ 22
- 33
packages/tldraw/src/state/command/move-to-page/move-to-page.command.spec.ts Просмотреть файл

@@ -5,9 +5,23 @@ import { ArrowShape, TLDrawShapeType } from '~types'
5 5
 describe('Move to page command', () => {
6 6
   const tlstate = new TLDrawState()
7 7
 
8
+  beforeEach(() => {
9
+    tlstate.loadDocument(mockDocument).createPage('page2').changePage('page1')
10
+  })
11
+
12
+  describe('when no shape is selected', () => {
13
+    it('does nothing', () => {
14
+      const initialState = tlstate.state
15
+      tlstate.moveToPage('page2')
16
+      const currentState = tlstate.state
17
+
18
+      expect(currentState).toEqual(initialState)
19
+    })
20
+  })
21
+
8 22
   /*
9 23
   Moving shapes to a new page should remove those shapes from the
10
-  current page and add them to the specifed page. If bindings exist
24
+  current page and add them to the specified page. If bindings exist
11 25
   that effect the moved shapes, then the bindings should be destroyed
12 26
   on the old page and created on the new page only if both the "to"
13 27
   and "from" shapes were moved. The app should then change pages to
@@ -15,12 +29,7 @@ describe('Move to page command', () => {
15 29
   */
16 30
 
17 31
   it('does, undoes and redoes command', () => {
18
-    tlstate
19
-      .loadDocument(mockDocument)
20
-      .createPage('page2')
21
-      .changePage('page1')
22
-      .select('rect1', 'rect2')
23
-      .moveToPage('page2')
32
+    tlstate.select('rect1', 'rect2').moveToPage('page2')
24 33
 
25 34
     expect(tlstate.currentPageId).toBe('page2')
26 35
     expect(tlstate.getShape('rect1', 'page1')).toBeUndefined()
@@ -51,7 +60,6 @@ describe('Move to page command', () => {
51 60
   describe('when moving shapes with bindings', () => {
52 61
     it('deletes bindings when only the bound-to shape is moved', () => {
53 62
       tlstate
54
-        .loadDocument(mockDocument)
55 63
         .selectAll()
56 64
         .delete()
57 65
         .createShapes(
@@ -66,7 +74,7 @@ describe('Move to page command', () => {
66 74
       const bindingId = tlstate.bindings[0].id
67 75
       expect(tlstate.getShape<ArrowShape>('arrow1').handles.start.bindingId).toBe(bindingId)
68 76
 
69
-      tlstate.createPage('page2').changePage('page1').select('target1').moveToPage('page2')
77
+      tlstate.select('target1').moveToPage('page2')
70 78
 
71 79
       expect(
72 80
         tlstate.getShape<ArrowShape>('arrow1', 'page1').handles.start.bindingId
@@ -93,7 +101,6 @@ describe('Move to page command', () => {
93 101
 
94 102
     it('deletes bindings when only the bound-from shape is moved', () => {
95 103
       tlstate
96
-        .loadDocument(mockDocument)
97 104
         .selectAll()
98 105
         .delete()
99 106
         .createShapes(
@@ -108,7 +115,7 @@ describe('Move to page command', () => {
108 115
       const bindingId = tlstate.bindings[0].id
109 116
       expect(tlstate.getShape<ArrowShape>('arrow1').handles.start.bindingId).toBe(bindingId)
110 117
 
111
-      tlstate.createPage('page2').changePage('page1').select('arrow1').moveToPage('page2')
118
+      tlstate.select('arrow1').moveToPage('page2')
112 119
 
113 120
       expect(
114 121
         tlstate.getShape<ArrowShape>('arrow1', 'page2').handles.start.bindingId
@@ -135,7 +142,6 @@ describe('Move to page command', () => {
135 142
 
136 143
     it('moves bindings when both shapes are moved', () => {
137 144
       tlstate
138
-        .loadDocument(mockDocument)
139 145
         .selectAll()
140 146
         .delete()
141 147
         .createShapes(
@@ -150,11 +156,7 @@ describe('Move to page command', () => {
150 156
       const bindingId = tlstate.bindings[0].id
151 157
       expect(tlstate.getShape<ArrowShape>('arrow1').handles.start.bindingId).toBe(bindingId)
152 158
 
153
-      tlstate
154
-        .createPage('page2')
155
-        .changePage('page1')
156
-        .select('arrow1', 'target1')
157
-        .moveToPage('page2')
159
+      tlstate.select('arrow1', 'target1').moveToPage('page2')
158 160
 
159 161
       expect(tlstate.getShape<ArrowShape>('arrow1', 'page2').handles.start.bindingId).toBe(
160 162
         bindingId
@@ -182,12 +184,7 @@ describe('Move to page command', () => {
182 184
 
183 185
   describe('when moving grouped shapes', () => {
184 186
     it('moves groups and their children', () => {
185
-      tlstate
186
-        .loadDocument(mockDocument)
187
-        .createPage('page2')
188
-        .changePage('page1')
189
-        .group(['rect1', 'rect2'], 'groupA')
190
-        .moveToPage('page2')
187
+      tlstate.group(['rect1', 'rect2'], 'groupA').moveToPage('page2')
191 188
 
192 189
       expect(tlstate.getShape('rect1', 'page1')).toBeUndefined()
193 190
       expect(tlstate.getShape('rect2', 'page1')).toBeUndefined()
@@ -218,18 +215,10 @@ describe('Move to page command', () => {
218 215
       expect(tlstate.getShape('groupA', 'page2')).toBeDefined()
219 216
     })
220 217
 
221
-    it('deletes groups shapes if the groups children were all moved', () => {
222
-      // ...
223
-    })
218
+    it.todo('deletes groups shapes if the groups children were all moved')
224 219
 
225 220
     it('reparents grouped shapes if the group is not moved', () => {
226
-      tlstate
227
-        .loadDocument(mockDocument)
228
-        .createPage('page2')
229
-        .changePage('page1')
230
-        .group(['rect1', 'rect2', 'rect3'], 'groupA')
231
-        .select('rect1')
232
-        .moveToPage('page2')
221
+      tlstate.group(['rect1', 'rect2', 'rect3'], 'groupA').select('rect1').moveToPage('page2')
233 222
 
234 223
       expect(tlstate.getShape('rect1', 'page1')).toBeUndefined()
235 224
       expect(tlstate.getShape('rect1', 'page2')).toBeDefined()

+ 15
- 18
packages/tldraw/src/state/command/move/move.command.spec.ts Просмотреть файл

@@ -42,8 +42,22 @@ function getSortedShapeIds(data: Data) {
42 42
 describe('Move command', () => {
43 43
   const tlstate = new TLDrawState()
44 44
 
45
-  it('does, undoes and redoes command', () => {
45
+  beforeEach(() => {
46 46
     tlstate.loadDocument(doc)
47
+  })
48
+
49
+  describe('when no shape is selected', () => {
50
+    it('does nothing', () => {
51
+      const initialState = tlstate.state
52
+      tlstate.moveToBack()
53
+
54
+      const currentState = tlstate.state
55
+
56
+      expect(currentState).toEqual(initialState)
57
+    })
58
+  })
59
+
60
+  it('does, undoes and redoes command', () => {
47 61
     tlstate.select('b')
48 62
     tlstate.moveToBack()
49 63
     expect(getSortedShapeIds(tlstate.state)).toBe('bacd')
@@ -55,21 +69,18 @@ describe('Move command', () => {
55 69
 
56 70
   describe('to back', () => {
57 71
     it('moves a shape to back', () => {
58
-      tlstate.loadDocument(doc)
59 72
       tlstate.select('b')
60 73
       tlstate.moveToBack()
61 74
       expect(getSortedShapeIds(tlstate.state)).toBe('bacd')
62 75
     })
63 76
 
64 77
     it('moves two adjacent siblings to back', () => {
65
-      tlstate.loadDocument(doc)
66 78
       tlstate.select('b', 'c')
67 79
       tlstate.moveToBack()
68 80
       expect(getSortedShapeIds(tlstate.state)).toBe('bcad')
69 81
     })
70 82
 
71 83
     it('moves two non-adjacent siblings to back', () => {
72
-      tlstate.loadDocument(doc)
73 84
       tlstate.select('b', 'd')
74 85
       tlstate.moveToBack()
75 86
       expect(getSortedShapeIds(tlstate.state)).toBe('bdac')
@@ -78,35 +89,30 @@ describe('Move command', () => {
78 89
 
79 90
   describe('backward', () => {
80 91
     it('moves a shape backward', () => {
81
-      tlstate.loadDocument(doc)
82 92
       tlstate.select('c')
83 93
       tlstate.moveBackward()
84 94
       expect(getSortedShapeIds(tlstate.state)).toBe('acbd')
85 95
     })
86 96
 
87 97
     it('moves a shape at first index backward', () => {
88
-      tlstate.loadDocument(doc)
89 98
       tlstate.select('a')
90 99
       tlstate.moveBackward()
91 100
       expect(getSortedShapeIds(tlstate.state)).toBe('abcd')
92 101
     })
93 102
 
94 103
     it('moves two adjacent siblings backward', () => {
95
-      tlstate.loadDocument(doc)
96 104
       tlstate.select('c', 'd')
97 105
       tlstate.moveBackward()
98 106
       expect(getSortedShapeIds(tlstate.state)).toBe('acdb')
99 107
     })
100 108
 
101 109
     it('moves two non-adjacent siblings backward', () => {
102
-      tlstate.loadDocument(doc)
103 110
       tlstate.select('b', 'd')
104 111
       tlstate.moveBackward()
105 112
       expect(getSortedShapeIds(tlstate.state)).toBe('badc')
106 113
     })
107 114
 
108 115
     it('moves two adjacent siblings backward at zero index', () => {
109
-      tlstate.loadDocument(doc)
110 116
       tlstate.select('a', 'b')
111 117
       tlstate.moveBackward()
112 118
       expect(getSortedShapeIds(tlstate.state)).toBe('abcd')
@@ -115,14 +121,12 @@ describe('Move command', () => {
115 121
 
116 122
   describe('forward', () => {
117 123
     it('moves a shape forward', () => {
118
-      tlstate.loadDocument(doc)
119 124
       tlstate.select('c')
120 125
       tlstate.moveForward()
121 126
       expect(getSortedShapeIds(tlstate.state)).toBe('abdc')
122 127
     })
123 128
 
124 129
     it('moves a shape forward at the top index', () => {
125
-      tlstate.loadDocument(doc)
126 130
       tlstate.select('b')
127 131
       tlstate.moveForward()
128 132
       tlstate.moveForward()
@@ -131,21 +135,18 @@ describe('Move command', () => {
131 135
     })
132 136
 
133 137
     it('moves two adjacent siblings forward', () => {
134
-      tlstate.loadDocument(doc)
135 138
       tlstate.select('a', 'b')
136 139
       tlstate.moveForward()
137 140
       expect(getSortedShapeIds(tlstate.state)).toBe('cabd')
138 141
     })
139 142
 
140 143
     it('moves two non-adjacent siblings forward', () => {
141
-      tlstate.loadDocument(doc)
142 144
       tlstate.select('a', 'c')
143 145
       tlstate.moveForward()
144 146
       expect(getSortedShapeIds(tlstate.state)).toBe('badc')
145 147
     })
146 148
 
147 149
     it('moves two adjacent siblings forward at top index', () => {
148
-      tlstate.loadDocument(doc)
149 150
       tlstate.select('c', 'd')
150 151
       tlstate.moveForward()
151 152
       expect(getSortedShapeIds(tlstate.state)).toBe('abcd')
@@ -154,28 +155,24 @@ describe('Move command', () => {
154 155
 
155 156
   describe('to front', () => {
156 157
     it('moves a shape to front', () => {
157
-      tlstate.loadDocument(doc)
158 158
       tlstate.select('b')
159 159
       tlstate.moveToFront()
160 160
       expect(getSortedShapeIds(tlstate.state)).toBe('acdb')
161 161
     })
162 162
 
163 163
     it('moves two adjacent siblings to front', () => {
164
-      tlstate.loadDocument(doc)
165 164
       tlstate.select('a', 'b')
166 165
       tlstate.moveToFront()
167 166
       expect(getSortedShapeIds(tlstate.state)).toBe('cdab')
168 167
     })
169 168
 
170 169
     it('moves two non-adjacent siblings to front', () => {
171
-      tlstate.loadDocument(doc)
172 170
       tlstate.select('a', 'c')
173 171
       tlstate.moveToFront()
174 172
       expect(getSortedShapeIds(tlstate.state)).toBe('bdac')
175 173
     })
176 174
 
177 175
     it('moves siblings already at front to front', () => {
178
-      tlstate.loadDocument(doc)
179 176
       tlstate.select('c', 'd')
180 177
       tlstate.moveToFront()
181 178
       expect(getSortedShapeIds(tlstate.state)).toBe('abcd')

+ 16
- 2
packages/tldraw/src/state/command/rotate/rotate.command.spec.ts Просмотреть файл

@@ -3,10 +3,24 @@ import { mockDocument } from '~test'
3 3
 
4 4
 describe('Rotate command', () => {
5 5
   const tlstate = new TLDrawState()
6
-  tlstate.loadDocument(mockDocument)
7
-  tlstate.select('rect1')
6
+
7
+  beforeEach(() => {
8
+    tlstate.loadDocument(mockDocument)
9
+  })
10
+
11
+  describe('when no shape is selected', () => {
12
+    it('does nothing', () => {
13
+      const initialState = tlstate.state
14
+      tlstate.rotate()
15
+      const currentState = tlstate.state
16
+
17
+      expect(currentState).toEqual(initialState)
18
+    })
19
+  })
8 20
 
9 21
   it('does, undoes and redoes command', () => {
22
+    tlstate.select('rect1')
23
+
10 24
     expect(tlstate.getShape('rect1').rotation).toBe(undefined)
11 25
 
12 26
     tlstate.rotate()

+ 15
- 3
packages/tldraw/src/state/command/stretch/stretch.command.spec.ts Просмотреть файл

@@ -5,8 +5,22 @@ import { mockDocument } from '~test'
5 5
 describe('Stretch command', () => {
6 6
   const tlstate = new TLDrawState()
7 7
 
8
-  it('does, undoes and redoes command', () => {
8
+  beforeEach(() => {
9 9
     tlstate.loadDocument(mockDocument)
10
+  })
11
+
12
+  describe('when less than two shapes are selected', () => {
13
+    it('does nothing', () => {
14
+      tlstate.select('rect2')
15
+      const initialState = tlstate.state
16
+      tlstate.stretch(StretchType.Horizontal)
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
22
+
23
+  it('does, undoes and redoes command', () => {
10 24
     tlstate.select('rect1', 'rect2')
11 25
     tlstate.stretch(StretchType.Horizontal)
12 26
 
@@ -31,7 +45,6 @@ describe('Stretch command', () => {
31 45
   })
32 46
 
33 47
   it('stretches horizontally', () => {
34
-    tlstate.loadDocument(mockDocument)
35 48
     tlstate.select('rect1', 'rect2')
36 49
     tlstate.stretch(StretchType.Horizontal)
37 50
 
@@ -42,7 +55,6 @@ describe('Stretch command', () => {
42 55
   })
43 56
 
44 57
   it('stretches vertically', () => {
45
-    tlstate.loadDocument(mockDocument)
46 58
     tlstate.select('rect1', 'rect2')
47 59
     tlstate.stretch(StretchType.Vertical)
48 60
 

+ 24
- 1
packages/tldraw/src/state/command/toggle-decoration/toggle-decoration.command.spec.ts Просмотреть файл

@@ -6,9 +6,32 @@ import { ArrowShape, Decoration, TLDrawShape } from '~types'
6 6
 describe('Toggle decoration command', () => {
7 7
   const tlstate = new TLDrawState()
8 8
 
9
+  beforeEach(() => {
10
+    tlstate.loadDocument(mockDocument)
11
+  })
12
+
13
+  describe('when no shape is selected', () => {
14
+    it('does nothing', () => {
15
+      const initialState = tlstate.state
16
+      tlstate.toggleDecoration('start')
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
22
+
23
+  describe('when handle id is invalid', () => {
24
+    it('does nothing', () => {
25
+      const initialState = tlstate.state
26
+      tlstate.toggleDecoration('invalid')
27
+      const currentState = tlstate.state
28
+
29
+      expect(currentState).toEqual(initialState)
30
+    })
31
+  })
32
+
9 33
   it('does, undoes and redoes command', () => {
10 34
     tlstate
11
-      .loadDocument(mockDocument)
12 35
       .create(
13 36
         TLDR.getShapeUtils({ type: 'arrow' } as TLDrawShape).create({
14 37
           id: 'arrow1',

+ 26
- 7
packages/tldraw/src/state/command/toggle/toggle.command.spec.ts Просмотреть файл

@@ -5,38 +5,57 @@ import { mockDocument } from '~test'
5 5
 describe('Toggle command', () => {
6 6
   const tlstate = new TLDrawState()
7 7
 
8
-  it('does, undoes and redoes command', () => {
8
+  beforeEach(() => {
9 9
     tlstate.loadDocument(mockDocument)
10
+  })
11
+
12
+  describe('when no shape is selected', () => {
13
+    it('does nothing', () => {
14
+      const initialState = tlstate.state
15
+      tlstate.toggleHidden()
16
+      const currentState = tlstate.state
17
+
18
+      expect(currentState).toEqual(initialState)
19
+    })
20
+  })
21
+
22
+  it('does, undoes and redoes command', () => {
10 23
     tlstate.selectAll()
11 24
 
12
-    expect(tlstate.getShape('rect2').isAspectRatioLocked).toBe(undefined)
25
+    expect(tlstate.getShape('rect2').isLocked).toBe(undefined)
13 26
 
14
-    tlstate.toggleAspectRatioLocked()
27
+    tlstate.toggleLocked()
15 28
 
16
-    expect(tlstate.getShape('rect2').isAspectRatioLocked).toBe(true)
29
+    expect(tlstate.getShape('rect2').isLocked).toBe(true)
17 30
 
18 31
     tlstate.undo()
19 32
 
20
-    expect(tlstate.getShape('rect2').isAspectRatioLocked).toBe(undefined)
33
+    expect(tlstate.getShape('rect2').isLocked).toBe(undefined)
21 34
 
22 35
     tlstate.redo()
23 36
 
24
-    expect(tlstate.getShape('rect2').isAspectRatioLocked).toBe(true)
37
+    expect(tlstate.getShape('rect2').isLocked).toBe(true)
25 38
   })
26 39
 
27 40
   it('toggles on before off when mixed values', () => {
28
-    tlstate.loadDocument(mockDocument)
29 41
     tlstate.select('rect2')
42
+
30 43
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(undefined)
31 44
     expect(tlstate.getShape<RectangleShape>('rect2').isAspectRatioLocked).toBe(undefined)
45
+
32 46
     tlstate.toggleAspectRatioLocked()
47
+
33 48
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(undefined)
34 49
     expect(tlstate.getShape<RectangleShape>('rect2').isAspectRatioLocked).toBe(true)
50
+
35 51
     tlstate.selectAll()
36 52
     tlstate.toggleAspectRatioLocked()
53
+
37 54
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(true)
38 55
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(true)
56
+
39 57
     tlstate.toggleAspectRatioLocked()
58
+
40 59
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(false)
41 60
     expect(tlstate.getShape<RectangleShape>('rect1').isAspectRatioLocked).toBe(false)
42 61
   })

+ 14
- 2
packages/tldraw/src/state/command/translate/translate.command.spec.ts Просмотреть файл

@@ -6,8 +6,21 @@ import { ArrowShape, TLDrawShapeType } from '~types'
6 6
 describe('Translate command', () => {
7 7
   const tlstate = new TLDrawState()
8 8
 
9
-  it('does, undoes and redoes command', () => {
9
+  beforeEach(() => {
10 10
     tlstate.loadDocument(mockDocument)
11
+  })
12
+
13
+  describe('when no shape is selected', () => {
14
+    it('does nothing', () => {
15
+      const initialState = tlstate.state
16
+      tlstate.nudge([1, 2])
17
+      const currentState = tlstate.state
18
+
19
+      expect(currentState).toEqual(initialState)
20
+    })
21
+  })
22
+
23
+  it('does, undoes and redoes command', () => {
11 24
     tlstate.selectAll()
12 25
     tlstate.nudge([1, 2])
13 26
 
@@ -23,7 +36,6 @@ describe('Translate command', () => {
23 36
   })
24 37
 
25 38
   it('major nudges', () => {
26
-    tlstate.loadDocument(mockDocument)
27 39
     tlstate.selectAll()
28 40
     tlstate.nudge([1, 2], true)
29 41
     expect(tlstate.getShape('rect2').point).toEqual([110, 120])

+ 19
- 4
packages/tldraw/src/state/command/update/update.command.spec.ts Просмотреть файл

@@ -1,19 +1,34 @@
1 1
 import { TLDrawState } from '~state'
2 2
 import { mockDocument } from '~test'
3
-import { Utils } from '@tldraw/core'
4
-
5
-const doc = Utils.deepClone(mockDocument)
6 3
 
7 4
 describe('Update command', () => {
8 5
   const tlstate = new TLDrawState()
9 6
 
7
+  beforeEach(() => {
8
+    tlstate.loadDocument(mockDocument)
9
+  })
10
+
11
+  describe('when no shape is selected', () => {
12
+    it('does nothing', () => {
13
+      const initialState = tlstate.state
14
+      tlstate.updateShapes()
15
+      const currentState = tlstate.state
16
+
17
+      expect(currentState).toEqual(initialState)
18
+    })
19
+  })
20
+
10 21
   it('does, undoes and redoes command', () => {
11
-    tlstate.loadDocument(doc)
12 22
     tlstate.updateShapes({ id: 'rect1', point: [100, 100] })
23
+
13 24
     expect(tlstate.getShape('rect1').point).toStrictEqual([100, 100])
25
+
14 26
     tlstate.undo()
27
+
15 28
     expect(tlstate.getShape('rect1').point).toStrictEqual([0, 0])
29
+
16 30
     tlstate.redo()
31
+
17 32
     expect(tlstate.getShape('rect1').point).toStrictEqual([100, 100])
18 33
   })
19 34
 })

Загрузка…
Отмена
Сохранить