From 9b2fc3ab118ef75fdce7240e463772bc50193cf9 Mon Sep 17 00:00:00 2001 From: marcindz88 Date: Thu, 17 Oct 2024 19:51:57 +0200 Subject: [PATCH] feat: withDevTools disabled in prod docs --- README.md | 12 +++++++----- libs/ngrx-toolkit/src/index.ts | 1 + libs/ngrx-toolkit/src/lib/with-devtools.spec.ts | 17 ----------------- libs/ngrx-toolkit/src/lib/with-devtools.ts | 9 +++++++-- 4 files changed, 15 insertions(+), 24 deletions(-) diff --git a/README.md b/README.md index 68fe8f5..2329c18 100644 --- a/README.md +++ b/README.md @@ -76,7 +76,7 @@ patchState(this.store, {loading: false}); updateState(this.store 'update loading', {loading: false}); ``` -`withDevtools()` is by default disabled in production mode, however if you want to tree-shake it from the application bundle you need to abstract it in your environment file. +`withDevtools()` is by default enabled in production mode, if you want to tree-shake it from the application bundle you need to abstract it in your environment file.
@@ -87,23 +87,25 @@ updateState(this.store 'update loading', {loading: false}); import { withDevtools } from '@angular-architects/ngrx-toolkit'; export const environment = { -storeDevToolsFeature: withDevtools + storeWithDevTools: withDevtools } ``` environment.prod.ts ```typescript +import { withDevtoolsStub } from '@angular-architects/ngrx-toolkit'; + export const environment = { - storeDevToolsFeature: (_: string): SignalStoreFeature => store => store + storeWithDevTools: withDevToolsStub } ``` -Then all you need to do is replace `withDevTools` everywhere in your app with `environment.storeDevToolsFeature` +Then all you need to do is replace `withDevTools` everywhere in your app with `environment.storeWithDevTools` e.g.: ```typescript export const SomeStore = signalStore( withState({strings: [] as string[] }), - environment.storeDevToolsFeature('some') + environment.storeWithDevTools('featureName') ); ``` diff --git a/libs/ngrx-toolkit/src/index.ts b/libs/ngrx-toolkit/src/index.ts index fe69e84..e9138d8 100644 --- a/libs/ngrx-toolkit/src/index.ts +++ b/libs/ngrx-toolkit/src/index.ts @@ -1,4 +1,5 @@ export { + withDevToolsStub, withDevtools, patchState, updateState, diff --git a/libs/ngrx-toolkit/src/lib/with-devtools.spec.ts b/libs/ngrx-toolkit/src/lib/with-devtools.spec.ts index 869095b..57a5e5d 100644 --- a/libs/ngrx-toolkit/src/lib/with-devtools.spec.ts +++ b/libs/ngrx-toolkit/src/lib/with-devtools.spec.ts @@ -1,6 +1,3 @@ -let isDevMode = true; -jest.mock('@angular/core', () => ({ ...jest.requireActual('@angular/core'), isDevMode: () => isDevMode })) - import { signalStore } from '@ngrx/signals'; import { withEntities } from '@ngrx/signals/entities'; import { Action, withDevtools } from './with-devtools'; @@ -34,7 +31,6 @@ const createFlight = (flight: Partial = {}) => ({ interface SetupOptions { extensionsAvailable: boolean; inSsr: boolean; - isDevMode: boolean } interface TestData { @@ -52,12 +48,9 @@ function run( const defaultOptions: SetupOptions = { inSsr: false, extensionsAvailable: true, - isDevMode: true, }; const realOptions = { ...defaultOptions, ...options }; - isDevMode = realOptions.isDevMode; - const sendSpy = jest.fn]>(); const connection = { send: sendSpy, @@ -123,16 +116,6 @@ describe('Devtools', () => { ) ); - it( - 'should not connect if it runs in production', - run( - ({ connectSpy }) => { - expect(connectSpy).toHaveBeenCalledTimes(0); - }, - { isDevMode: false } - ) - ); - it( 'should dispatch todo state', run(({ sendSpy, runEffects }) => { diff --git a/libs/ngrx-toolkit/src/lib/with-devtools.ts b/libs/ngrx-toolkit/src/lib/with-devtools.ts index 34df2c6..7f5c56d 100644 --- a/libs/ngrx-toolkit/src/lib/with-devtools.ts +++ b/libs/ngrx-toolkit/src/lib/with-devtools.ts @@ -5,7 +5,7 @@ import { SignalStoreFeature, WritableStateSource, } from '@ngrx/signals'; -import { effect, inject, isDevMode, PLATFORM_ID, signal, Signal } from '@angular/core'; +import { effect, inject, PLATFORM_ID, signal, Signal } from '@angular/core'; import { isPlatformServer } from '@angular/common'; import { Prettify } from './shared/prettify'; @@ -79,6 +79,11 @@ export function reset() { storeRegistry.set({}); } +/** + * Stub for DevTools integration. Can be used to disable DevTools in production. + */ +export const withDevToolsStub: typeof withDevtools = () => store => store; + /** * @param name store's name as it should appear in the DevTools */ @@ -87,7 +92,7 @@ export function withDevtools( ): SignalStoreFeature { return (store) => { const isServer = isPlatformServer(inject(PLATFORM_ID)); - if (isServer || !isDevMode()) { + if (isServer) { return store; }