fix(ssr): skipped actions should always be retried on client

Author: LongYinan

packages/core/src/module.ts

@@ -43,8 +43,8 @@ export abstract class EffectModule<S> {
   private readonly actionStreams: any = {}
   private readonly retryActionsCreator: any = {}
   private readonly actionNames: string[] = []
-  private actionsToRetry: Set<string> = new Set()
-  private actionsToSkip!: string[]
+  private actionsToRetry!: Set<string>
+  private actionsToSkip!: Set<string>
   private restoredFromSSR = false
 
   get state$() {
@@ -119,10 +119,12 @@ export abstract class EffectModule<S> {
                 if (!context.store.ready) {
                   context.store.setup(context.getDefaultState())
                   context.actionsToRetry = new Set(_globalThis[RETRY_KEY_SYMBOL]?.[this.moduleName] || [])
-                  context.actionsToSkip = context.restoredFromSSR
-                    ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-                      getActionsToSkip(context.constructor.prototype) || []
-                    : []
+                  context.actionsToSkip = new Set(
+                    context.restoredFromSSR
+                      ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+                        getActionsToSkip(context.constructor.prototype) || []
+                      : [],
+                  )
                 }
                 return rawSetter.call(this, value)
               }
@@ -131,10 +133,12 @@ export abstract class EffectModule<S> {
               if (!context.store.ready) {
                 context.store.setup(context.getDefaultState())
                 context.actionsToRetry = new Set(_globalThis[RETRY_KEY_SYMBOL]?.[context.moduleName] || [])
-                context.actionsToSkip = context.restoredFromSSR
-                  ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-                    getActionsToSkip(context.constructor.prototype) || []
-                  : []
+                context.actionsToSkip = new Set(
+                  context.restoredFromSSR
+                    ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+                      getActionsToSkip(context.constructor.prototype) || []
+                    : [],
+                )
               }
             }
           }
@@ -146,10 +150,12 @@ export abstract class EffectModule<S> {
             if (!context.store.ready) {
               context.store.setup(context.getDefaultState())
               context.actionsToRetry = new Set(_globalThis[RETRY_KEY_SYMBOL]?.[context.moduleName] || [])
-              context.actionsToSkip = context.restoredFromSSR
-                ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-                  getActionsToSkip(context.constructor.prototype) || []
-                : []
+              context.actionsToSkip = new Set(
+                context.restoredFromSSR
+                  ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+                    getActionsToSkip(context.constructor.prototype) || []
+                  : [],
+              )
             }
           }
           return Reflect.set(target, p, value, receiver)
@@ -163,7 +169,7 @@ export abstract class EffectModule<S> {
             this.store.setup(this.getDefaultState())
             this.actionsToRetry = new Set(_globalThis[RETRY_KEY_SYMBOL]?.[this.moduleName] || [])
             // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-            this.actionsToSkip = this.restoredFromSSR ? getActionsToSkip(this.constructor.prototype) || [] : []
+            this.actionsToSkip = new Set(this.restoredFromSSR ? getActionsToSkip(this.constructor.prototype) || [] : [])
           }
         },
         get: () => {
@@ -281,7 +287,7 @@ export abstract class EffectModule<S> {
           const effect: Effect<unknown> = (this as any)[name]
           const payload$ = action$.pipe(
             filter(({ type }, index) => {
-              const skipCount = !this.actionsToRetry.has(name) && this.actionsToSkip?.includes(name) ? 1 : 0
+              const skipCount = !this.actionsToRetry.has(name) && this.actionsToSkip?.has(name) ? 1 : 0
               return type === name && skipCount <= index
             }),
             map(({ payload }) => payload),

packages/react/src/__tests__/ssr.spec.tsx

@@ -645,7 +645,7 @@ describe('SSR specs:', () => {
     expect(state['actionsToRetry']).toEqual({ ServiceModule: ['setNameWithFailure'] })
   })
 
-  it('should be able to persist actions to retry on the other module', async () => {
+  it('should be able to persist actions to retry on the other module, and the skipped actions', async () => {
     @Module('InnerServiceModule')
     // eslint-disable-next-line @typescript-eslint/ban-types
     class InnerServiceModule extends EffectModule<CountState> {
@@ -680,12 +680,24 @@ describe('SSR specs:', () => {
       setName(payload$: Observable<void>): Observable<Action> {
         return payload$.pipe(mergeMap(() => of(this.serviceModule.getActions().setNameWithFailure(1))))
       }
+
+      @Effect({
+        payloadGetter(_: any, skipAction) {
+          return skipAction
+        },
+      })
+      skippedSetName(payload$: Observable<void>): Observable<Action> {
+        return payload$.pipe(map(() => this.serviceModule.getActions().setName('skipped')))
+      }
     }
 
     const req = {}
     const state = await emitSSREffects(req, [InnerServiceModule, InnerCountModule2], { providers: MODULES })
       .pendingState
 
-    expect(state['actionsToRetry']).toEqual({ InnerServiceModule: ['setNameWithFailure'] })
+    expect(state['actionsToRetry']).toEqual({
+      InnerCountModel2: ['skippedSetName'],
+      InnerServiceModule: ['setNameWithFailure'],
+    })
   })
 })

packages/ssr/src/run.ts

@@ -1,6 +1,6 @@
 import { EffectModule, TERMINATE_ACTION_TYPE_SYMBOL, getSSREffectMeta, RETRY_ACTION_TYPE_SYMBOL } from '@sigi/core'
 import { rootInjector, Injector, Provider } from '@sigi/di'
-import { ConstructorOf } from '@sigi/types'
+import { ConstructorOf, Action } from '@sigi/types'
 
 import { StateToPersist } from './state-to-persist'
 
@@ -60,11 +60,11 @@ export const runSSREffects = <Context, Returned = any>(
       const subscription = store.action$.subscribe({
         next: ({ type, payload }) => {
           if (type === RETRY_ACTION_TYPE_SYMBOL) {
-            const { module, name } = payload as any
-            if (!actionsToRetry[module.moduleName]) {
-              actionsToRetry[module.moduleName] = [name] as string[]
+            const { name } = payload as Action<{ name: string }>['payload']
+            if (!actionsToRetry[moduleName]) {
+              actionsToRetry[moduleName] = [name] as string[]
             } else {
-              actionsToRetry[module.moduleName].push(name as string)
+              actionsToRetry[moduleName].push(name as string)
             }
           }
           if (type === TERMINATE_ACTION_TYPE_SYMBOL) {
@@ -96,6 +96,11 @@ export const runSSREffects = <Context, Returned = any>(
                   store,
                 })
               } else {
+                if (!actionsToRetry[moduleName]) {
+                  actionsToRetry[moduleName] = [ssrActionMeta.action]
+                } else {
+                  actionsToRetry[moduleName].push(ssrActionMeta.action)
+                }
                 effectsCount--
                 if (terminatedCount === effectsCount) {
                   resolve()