如何利用 AI 工具优化开发流程和时间分配

import { TestBed } from '@angular/core/testing';
import { Observable, of, throwError } from 'rxjs';
import { hot, cold } from 'jasmine-marbles';
import { provideMockActions } from '@ngrx/effects/testing';

import { PageEffects } from './page.effects';
import { CmsActions } from '../actions/index';
import { AuthActions } from '../../../auth/user-auth/store/actions/index';
import { SiteContextActions } from '../../../site-context/store/actions/index';
import { CmsPageConnector } from '../../connectors/page/cms-page.connector';
import { RoutingService } from '../../../routing/index';
import { LoggerService } from '../../../logger';
import { CmsStructureModel } from '../../model/page.model';

// 如果没有导入 serializePageContext，则可以在测试环境中模拟（或确保其稳定性）
import { serializePageContext } from '../../utils/cms-utils';

describe('PageEffects', () => {
  let actions$: Observable<any>;
  let effects: PageEffects;
  let cmsPageConnector: jasmine.SpyObj<CmsPageConnector>;
  let routingService: jasmine.SpyObj<RoutingService>;
  let logger: jasmine.SpyObj<LoggerService>;

  beforeEach(() => {
    const cmsPageConnectorSpy = jasmine.createSpyObj('CmsPageConnector', ['get']);
    const routingServiceSpy = jasmine.createSpyObj('RoutingService', ['getRouterState']);
    const loggerSpy = jasmine.createSpyObj('LoggerService', ['log', 'error']);

    TestBed.configureTestingModule({
      providers: [
        PageEffects,
        provideMockActions(() => actions$),
        { provide: CmsPageConnector, useValue: cmsPageConnectorSpy },
        { provide: RoutingService, useValue: routingServiceSpy },
        { provide: LoggerService, useValue: loggerSpy },
      ],
    });

    effects = TestBed.inject(PageEffects);
    cmsPageConnector = TestBed.inject(CmsPageConnector) as jasmine.SpyObj<CmsPageConnector>;
    routingService = TestBed.inject(RoutingService) as jasmine.SpyObj<RoutingService>;
    logger = TestBed.inject(LoggerService) as jasmine.SpyObj<LoggerService>;
  });

  describe('refreshPage$', () => {
    it('should dispatch LoadCmsPageData action when router state meets criteria', () => {
      // 定义一个 page context 对象
      const pageContext = { id: 'home', type: 'ContentPage' };

      // 模拟路由状态，满足条件：cmsRequired 为 true 且 nextState 为 falsy
      const routerState = {
        state: {
          cmsRequired: true,
          context: pageContext,
        },
        nextState: null,
      };

      // 触发的 action 选择其中一个（这里以 LANGUAGE_CHANGE 为例）
      actions$ = hot('-a-', { a: SiteContextActions.LANGUAGE_CHANGE() });
      // routingService.getRouterState 返回一个冷 observable
      routingService.getRouterState.and.returnValue(cold('-b|', { b: routerState }));

      const expected = cold('--c', {
        c: new CmsActions.LoadCmsPageData(pageContext),
      });

      expect(effects.refreshPage$).toBeObservable(expected);
    });
  });

  describe('loadPageData$', () => {
    it('should dispatch success actions when cmsPageConnector returns data and page label differs from context id', () => {
      const pageContext = { id: 'home', type: 'ContentPage' };
      const components = ['comp1', 'comp2'];
      const cmsStructure: CmsStructureModel = {
        components: components,
        page: { label: 'homepage', otherProp: 'value' },
      };

      actions$ = hot('-a-', { a: new CmsActions.LoadCmsPageData(pageContext) });
      cmsPageConnector.get.and.returnValue(cold('-b|', { b: cmsStructure }));

      // 根据 effect 逻辑：
      // 1. 如果 page.label 不等于 context.id，则先 dispatch CmsSetPageSuccessIndex，
      // 2. 然后 dispatch CmsGetComponentFromPage，
      // 3. 最后 dispatch LoadCmsPageDataSuccess。
      const expectedActions = {
        c: new CmsActions.CmsSetPageSuccessIndex(
          { id: cmsStructure.page!.label, type: pageContext.type },
          cmsStructure.page!
        ),
        d: new CmsActions.CmsGetComponentFromPage(
          (cmsStructure.components || []).map(component => ({ component, pageContext }))
        ),
        e: new CmsActions.LoadCmsPageDataSuccess(pageContext, cmsStructure.page!)
      };

      // 合并后依次发出三个 action
      const expected = cold('---(cde)', expectedActions);
      expect(effects.loadPageData$).toBeObservable(expected);
    });

    it('should dispatch success actions when cmsPageConnector returns data and page label equals context id', () => {
      const pageContext = { id: 'home', type: 'ContentPage' };
      const components = ['comp1'];
      const cmsStructure: CmsStructureModel = {
        components: components,
        page: { label: 'home', otherProp: 'value' },
      };

      actions$ = hot('-a-', { a: new CmsActions.LoadCmsPageData(pageContext) });
      cmsPageConnector.get.and.returnValue(cold('-b|', { b: cmsStructure }));

      // 此时 page.label === context.id，只需要发出两个 action：
      // CmsGetComponentFromPage 与 LoadCmsPageDataSuccess
      const expectedActions = {
        d: new CmsActions.CmsGetComponentFromPage(
          (cmsStructure.components || []).map(component => ({ component, pageContext }))
        ),
        e: new CmsActions.LoadCmsPageDataSuccess(pageContext, cmsStructure.page!)
      };

      const expected = cold('---(de)', expectedActions);
      expect(effects.loadPageData$).toBeObservable(expected);
    });

    it('should dispatch fail action when cmsPageConnector returns an error', () => {
      const pageContext = { id: 'home', type: 'ContentPage' };
      const error = new Error('Test error');

      actions$ = hot('-a-', { a: new CmsActions.LoadCmsPageData(pageContext) });
      cmsPageConnector.get.and.returnValue(cold('-#', {}, error));

      // 在 catchError 中将错误通过 tryNormalizeHttpError 包装，这里为测试简单起见直接传递 error 对象
      const expected = cold('---(b)', {
        b: new CmsActions.LoadCmsPageDataFail(pageContext, error),
      });
      expect(effects.loadPageData$).toBeObservable(expected);
    });
  });
});