@@ -66,16 +66,27 @@ const mountComponent = (options: { captureError?: boolean } = {}) => {
66
66
legacy : false ,
67
67
locale : 'en' ,
68
68
messages : {
69
- en : { }
69
+ en : {
70
+ g : {
71
+ progressCountOf : 'of'
72
+ } ,
73
+ manager : {
74
+ clickToFinishSetup : 'Click' ,
75
+ applyChanges : 'Apply Changes' ,
76
+ toFinishSetup : 'to finish setup' ,
77
+ restartingBackend : 'Restarting backend to apply changes...' ,
78
+ extensionsSuccessfullyInstalled :
79
+ 'Extension(s) successfully installed and are ready to use!' ,
80
+ restartToApplyChanges : 'To apply changes, please restart ComfyUI' ,
81
+ installingDependencies : 'Installing dependencies...'
82
+ }
83
+ }
70
84
}
71
85
} )
72
86
73
87
const config : any = {
74
88
global : {
75
- plugins : [ pinia , PrimeVue , i18n ] ,
76
- mocks : {
77
- $t : ( key : string ) => key // Mock i18n translation
78
- }
89
+ plugins : [ pinia , PrimeVue , i18n ]
79
90
}
80
91
}
81
92
@@ -95,9 +106,14 @@ describe('ManagerProgressFooter', () => {
95
106
const mockTaskLogs : TaskLog [ ] = [ ]
96
107
97
108
const mockComfyManagerStore = {
98
- uncompletedCount : 0 ,
99
109
taskLogs : mockTaskLogs ,
100
110
allTasksDone : true ,
111
+ isProcessingTasks : false ,
112
+ succeededTasksIds : [ ] as string [ ] ,
113
+ failedTasksIds : [ ] as string [ ] ,
114
+ taskHistory : { } as Record < string , any > ,
115
+ taskQueue : null ,
116
+ resetTaskState : vi . fn ( ) ,
101
117
clearLogs : vi . fn ( ) ,
102
118
setStale : vi . fn ( ) ,
103
119
// Add other required properties
@@ -195,7 +211,14 @@ describe('ManagerProgressFooter', () => {
195
211
describe ( 'State 1: Queue Running' , ( ) => {
196
212
it ( 'should display loading spinner and progress counter when queue is running' , async ( ) => {
197
213
// Setup queue running state
198
- mockComfyManagerStore . uncompletedCount = 3
214
+ mockComfyManagerStore . isProcessingTasks = true
215
+ mockComfyManagerStore . succeededTasksIds = [ '1' , '2' ]
216
+ mockComfyManagerStore . failedTasksIds = [ ]
217
+ mockComfyManagerStore . taskHistory = {
218
+ '1' : { taskName : 'Installing pack1' } ,
219
+ '2' : { taskName : 'Installing pack2' } ,
220
+ '3' : { taskName : 'Installing pack3' }
221
+ }
199
222
mockTaskLogs . push (
200
223
{ taskName : 'Installing pack1' , taskId : '1' , logs : [ ] } ,
201
224
{ taskName : 'Installing pack2' , taskId : '2' , logs : [ ] } ,
@@ -211,18 +234,18 @@ describe('ManagerProgressFooter', () => {
211
234
expect ( wrapper . text ( ) ) . toContain ( 'Installing pack3' )
212
235
213
236
// Check progress counter (completed: 2 of 3)
214
- expect ( wrapper . text ( ) ) . toMatch ( / 2 .* 3 / )
237
+ expect ( wrapper . text ( ) ) . toMatch ( / 2 .* o f . * 3 / )
215
238
216
239
// Check expand/collapse button exists
217
240
const expandButton = wrapper . find ( '[aria-label="Expand"]' )
218
241
expect ( expandButton . exists ( ) ) . toBe ( true )
219
242
220
243
// Check Apply Changes button is NOT shown
221
- expect ( wrapper . text ( ) ) . not . toContain ( 'manager.applyChanges ' )
244
+ expect ( wrapper . text ( ) ) . not . toContain ( 'Apply Changes ' )
222
245
} )
223
246
224
247
it ( 'should toggle expansion when expand button is clicked' , async ( ) => {
225
- mockComfyManagerStore . uncompletedCount = 1
248
+ mockComfyManagerStore . isProcessingTasks = true
226
249
mockTaskLogs . push ( { taskName : 'Installing' , taskId : '1' , logs : [ ] } )
227
250
228
251
const wrapper = mountComponent ( )
@@ -237,7 +260,7 @@ describe('ManagerProgressFooter', () => {
237
260
describe ( 'State 2: Tasks Completed (Waiting for Restart)' , ( ) => {
238
261
it ( 'should display check mark and Apply Changes button when all tasks are done' , async ( ) => {
239
262
// Setup tasks completed state
240
- mockComfyManagerStore . uncompletedCount = 0
263
+ mockComfyManagerStore . isProcessingTasks = false
241
264
mockTaskLogs . push (
242
265
{ taskName : 'Installed pack1' , taskId : '1' , logs : [ ] } ,
243
266
{ taskName : 'Installed pack2' , taskId : '2' , logs : [ ] }
@@ -249,15 +272,16 @@ describe('ManagerProgressFooter', () => {
249
272
// Check check mark emoji
250
273
expect ( wrapper . text ( ) ) . toContain ( '✅' )
251
274
252
- // Check restart message (split into 3 parts)
253
- expect ( wrapper . text ( ) ) . toContain ( 'manager.clickToFinishSetup' )
254
- expect ( wrapper . text ( ) ) . toContain ( 'manager.applyChanges' )
255
- expect ( wrapper . text ( ) ) . toContain ( 'manager.toFinishSetup' )
275
+ // Check restart message
276
+ expect ( wrapper . text ( ) ) . toContain (
277
+ 'To apply changes, please restart ComfyUI'
278
+ )
279
+ expect ( wrapper . text ( ) ) . toContain ( 'Apply Changes' )
256
280
257
281
// Check Apply Changes button exists
258
282
const applyButton = wrapper
259
283
. findAll ( 'button' )
260
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
284
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
261
285
expect ( applyButton ) . toBeTruthy ( )
262
286
263
287
// Check no progress counter
@@ -268,28 +292,28 @@ describe('ManagerProgressFooter', () => {
268
292
describe ( 'State 3: Restarting' , ( ) => {
269
293
it ( 'should display restarting message and spinner during restart' , async ( ) => {
270
294
// Setup completed state first
271
- mockComfyManagerStore . uncompletedCount = 0
295
+ mockComfyManagerStore . isProcessingTasks = false
272
296
mockComfyManagerStore . allTasksDone = true
273
297
274
298
const wrapper = mountComponent ( )
275
299
276
300
// Click Apply Changes to trigger restart
277
301
const applyButton = wrapper
278
302
. findAll ( 'button' )
279
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
303
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
280
304
await applyButton ?. trigger ( 'click' )
281
305
282
306
// Wait for state update
283
307
await nextTick ( )
284
308
285
309
// Check restarting message
286
- expect ( wrapper . text ( ) ) . toContain ( 'manager.restartingBackend ' )
310
+ expect ( wrapper . text ( ) ) . toContain ( 'Restarting backend to apply changes... ' )
287
311
288
312
// Check loading spinner during restart
289
313
expect ( wrapper . find ( '.inline-flex' ) . exists ( ) ) . toBe ( true )
290
314
291
315
// Check Apply Changes button is hidden
292
- expect ( wrapper . text ( ) ) . not . toContain ( 'manager.applyChanges ' )
316
+ expect ( wrapper . text ( ) ) . not . toContain ( 'Apply Changes ' )
293
317
} )
294
318
} )
295
319
@@ -298,15 +322,15 @@ describe('ManagerProgressFooter', () => {
298
322
vi . useFakeTimers ( )
299
323
300
324
// Setup completed state
301
- mockComfyManagerStore . uncompletedCount = 0
325
+ mockComfyManagerStore . isProcessingTasks = false
302
326
mockComfyManagerStore . allTasksDone = true
303
327
304
328
const wrapper = mountComponent ( )
305
329
306
330
// Trigger restart
307
331
const applyButton = wrapper
308
332
. findAll ( 'button' )
309
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
333
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
310
334
await applyButton ?. trigger ( 'click' )
311
335
312
336
// Wait for event listener to be set up
@@ -323,7 +347,7 @@ describe('ManagerProgressFooter', () => {
323
347
// Check success message
324
348
expect ( wrapper . text ( ) ) . toContain ( '🎉' )
325
349
expect ( wrapper . text ( ) ) . toContain (
326
- 'manager.extensionsSuccessfullyInstalled '
350
+ 'Extension(s) successfully installed and are ready to use! '
327
351
)
328
352
329
353
// Check dialog closes after 3 seconds
@@ -334,7 +358,7 @@ describe('ManagerProgressFooter', () => {
334
358
expect ( mockDialogStore . closeDialog ) . toHaveBeenCalledWith ( {
335
359
key : 'global-manager-progress-dialog'
336
360
} )
337
- expect ( mockComfyManagerStore . clearLogs ) . toHaveBeenCalled ( )
361
+ expect ( mockComfyManagerStore . resetTaskState ) . toHaveBeenCalled ( )
338
362
339
363
vi . useRealTimers ( )
340
364
} )
@@ -362,7 +386,7 @@ describe('ManagerProgressFooter', () => {
362
386
363
387
describe ( 'Toast Management' , ( ) => {
364
388
it ( 'should suppress reconnection toasts during restart' , async ( ) => {
365
- mockComfyManagerStore . uncompletedCount = 0
389
+ mockComfyManagerStore . isProcessingTasks = false
366
390
mockComfyManagerStore . allTasksDone = true
367
391
mockSettingStore . get . mockReturnValue ( false ) // Original setting
368
392
@@ -371,7 +395,7 @@ describe('ManagerProgressFooter', () => {
371
395
// Click Apply Changes
372
396
const applyButton = wrapper
373
397
. findAll ( 'button' )
374
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
398
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
375
399
await applyButton ?. trigger ( 'click' )
376
400
377
401
// Check toast setting was disabled
@@ -382,7 +406,7 @@ describe('ManagerProgressFooter', () => {
382
406
} )
383
407
384
408
it ( 'should restore toast settings after restart completes' , async ( ) => {
385
- mockComfyManagerStore . uncompletedCount = 0
409
+ mockComfyManagerStore . isProcessingTasks = false
386
410
mockComfyManagerStore . allTasksDone = true
387
411
mockSettingStore . get . mockReturnValue ( false ) // Original setting
388
412
@@ -391,7 +415,7 @@ describe('ManagerProgressFooter', () => {
391
415
// Click Apply Changes
392
416
const applyButton = wrapper
393
417
. findAll ( 'button' )
394
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
418
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
395
419
await applyButton ?. trigger ( 'click' )
396
420
397
421
// Wait for event listener to be set up
@@ -414,7 +438,7 @@ describe('ManagerProgressFooter', () => {
414
438
415
439
describe ( 'Error Handling' , ( ) => {
416
440
it ( 'should restore state and close dialog on restart error' , async ( ) => {
417
- mockComfyManagerStore . uncompletedCount = 0
441
+ mockComfyManagerStore . isProcessingTasks = false
418
442
mockComfyManagerStore . allTasksDone = true
419
443
420
444
// Mock restart to throw error
@@ -427,7 +451,7 @@ describe('ManagerProgressFooter', () => {
427
451
// Click Apply Changes
428
452
const applyButton = wrapper
429
453
. findAll ( 'button' )
430
- . find ( ( btn ) => btn . text ( ) . includes ( 'manager.applyChanges ' ) )
454
+ . find ( ( btn ) => btn . text ( ) . includes ( 'Apply Changes ' ) )
431
455
432
456
expect ( applyButton ) . toBeTruthy ( )
433
457
0 commit comments