feat: CXSPA-7197 Create toggle for strict NgRx and HTTP error handling

[pawelfras]

This |PR contains an implementation of a toggle for strict HTTP and NgRx error handling in SSR.

QA steps (examples):

• strict HTTP error handling in storefrontapp

  • go to default-occ-product-config.ts and modify the default productSearch endpoint
  • run npm run dev:ssr
  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log is visible in the server console and not present in the browser's console
  • kill the SSR app and run npm run start
  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log from logger.service.ts is not present in the browser's console

• strict HTTP error handling in fresh SPA app

  • build and deploy Spartacus packages locally: npx ts-node ./tools/schematics/testing.ts in the SPA root folder`
  • create new app npx @angular/cli@17 new my-app --standalone=false --style=scss --routing=false
  • go to the project's directory and install Spartacus from local packages: npx @angular/cli@17 add @spartacus/schematics@latest --baseUrl="https://40.76.109.9:9002"
  • adjust spartacus config in spartacus-configuration.module.ts

    providers: [
    provideConfig(<OccConfig>{
    backend: {
    occ: {
      baseUrl: 'https://40.76.109.9:9002',
      endpoints: {
        productSearch: 'products/search2',
      },
    },
    },
    }),
    / * * /
    provideFeatureToggles({
    strictHttpAndNgrxErrorHandling: true,
    }),
    ]

  • adjust server.ts file:

    export function app(): express.Express {
    const server = express();
    const serverDistFolder = dirname(fileURLToPath(import.meta.url));
    const browserDistFolder = resolve(serverDistFolder, '../browser');
    const indexHtml = join(browserDistFolder, 'index.html');
    const indexHtmlContent = readFileSync(indexHtml, 'utf-8');
    
    / * * /
    
    server.use(defaultServerErrorResponseHandlers(indexHtmlContent));
    
    return server;
    }

  • run npm run build && NODE_TLS_REJECT_UNAUTHORIZED=0 run serve:ssr:my-app
  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log is visible in the server console and not present in the browser's console

• strict NgRx error handling in storefrontapp

  • go to product-search.effect.ts and modify searchProducts$ effect:

    map(() => {
    // return new ProductActions.SearchProductsSuccess(
    //   data,
    //   action.auxiliary
    // );
    throw new Error('Test Error');
    }),

  • run npm run dev:ssr

  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log is visible in the server console and not present in the browser's console

    

  • kill the SSR app and run npm run start

  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log with Test Error message from logger.service.ts is not present in the browser's console

• strict NgRx error handling in fresh SPA app

  • build and deploy Spartacus packages locally keeping adjustments in product-search.effect.ts: npx ts-node ./tools/schematics/testing.ts in the SPA root folder`
  • create new app npx @angular/cli@17 new my-app --standalone=false --style=scss --routing=false
  • go to the project's directory and install Spartacus from local packages: npx @angular/cli@17 add @spartacus/schematics@latest --baseUrl="https://40.76.109.9:9002"
  • adjust spartacus config in spartacus-configuration.module.ts

    providers: [
    / * * /
    provideFeatureToggles({
    strictHttpAndNgrxErrorHandling: true,
    }),
    ]

  • adjust server.ts file:

    export function app(): express.Express {
    const server = express();
    const serverDistFolder = dirname(fileURLToPath(import.meta.url));
    const browserDistFolder = resolve(serverDistFolder, '../browser');
    const indexHtml = join(browserDistFolder, 'index.html');
    const indexHtmlContent = readFileSync(indexHtml, 'utf-8');
    
    / *** /
    
    server.use(defaultServerErrorResponseHandlers(indexHtmlContent));
    
    return server;
    }

  • run npm run build && NODE_TLS_REJECT_UNAUTHORIZED=0 run serve:ssr:my-app
  • go to http://localhost:4200/electronics-spa/en/USD/Brands/all/c/brands and verify if the error log is visible in the server console and not present in the browser's console

closes CXSPA-7197