fix: critical bug with not working default query client options - (enabled option); fix: enableOnDemand more predictable (it enabled the disabled query when result is requested)

Author: js2me

src/mobx-inifinite-query.ts

@@ -59,7 +59,12 @@ export class MobxInfiniteQuery<
 
   private isEnabledOnResultDemand: boolean;
 
-  private _originEnabled: MobxInfiniteQueryOptions<
+  private isEnabledHolded = false;
+  /**
+   * This parameter is responsible for holding the enabled value,
+   * in cases where the "enableOnDemand" option is enabled
+   */
+  private holdedEnabledOption: MobxInfiniteQueryOptions<
     TData,
     TError,
     TQueryKey,
@@ -212,7 +217,7 @@ export class MobxInfiniteQuery<
       return false;
     }
 
-    return this._originEnabled;
+    return this.holdedEnabledOption;
   }
 
   fetchNextPage(options?: FetchNextPageOptions | undefined) {
@@ -233,11 +238,28 @@ export class MobxInfiniteQuery<
       ...this.options,
       ...optionsUpdate,
     } as any) as MobxInfiniteQueryOptions<TData, TError, TQueryKey, TPageParam>;
-    if ('enabled' in optionsUpdate) {
-      this._originEnabled = options.enabled;
+
+    // If the on-demand query mode is enabled (when using the result property)
+    // then, if the user does not request the result, the queries should not be executed
+    // to do this, we hold the original value of the enabled option
+    // and set enabled to false until the user requests the result (this.isResultRequsted)
+    if (this.isEnabledOnResultDemand) {
+      if (options.enabled !== false) {
+        this.holdedEnabledOption = options.enabled;
+      }
+
+      if (this.isResultRequsted) {
+        if (this.isEnabledHolded) {
+          options.enabled = this.holdedEnabledOption;
+          this.isEnabledHolded = false;
+        }
+      } else {
+        options.enabled = false;
+        this.isEnabledHolded = true;
+      }
     }
+
     options.structuralSharing = options.structuralSharing ?? false;
-    options.enabled = this.checkIsEnabled();
     options.queryHash = this.createQueryHash(options.queryKey, options);
 
     return options;

src/mobx-query.test.ts

@@ -197,7 +197,7 @@ describe('MobxQuery', () => {
   });
 
   describe('"enabled" reactive parameter', () => {
-    it.skip('should work', async () => {
+    it('should be DISABLED from default query options (from query client)', async () => {
       const queryClient = new MobxQueryClient({
         defaultOptions: {
           queries: {
@@ -494,7 +494,7 @@ describe('MobxQuery', () => {
         mobxQuery.dispose();
       });
 
-      it('should not call query event if result is requested (reason: "enabled": false)', async () => {
+      it('should call query event if result is requested (reason: "enableOnDemand": true)', async () => {
         const mobxQuery = new MobxQueryMock({
           queryFn: () => 10,
           enableOnDemand: true,
@@ -505,7 +505,7 @@ describe('MobxQuery', () => {
 
         await when(() => !mobxQuery._rawResult.isLoading);
 
-        expect(mobxQuery.spies.queryFn).toBeCalledTimes(0);
+        expect(mobxQuery.spies.queryFn).toBeCalledTimes(1);
 
         mobxQuery.dispose();
       });
@@ -555,6 +555,30 @@ describe('MobxQuery', () => {
 
         expect(mobxQuery.spies.queryFn).toBeCalledTimes(1);
 
+        mobxQuery.dispose();
+      });
+      it('should call query if result is requested (with "enabled" false from default query client options)', async () => {
+        const queryClient = new MobxQueryClient({
+          defaultOptions: {
+            queries: {
+              enabled: false,
+            },
+          },
+        });
+        const mobxQuery = new MobxQueryMock(
+          {
+            queryKey: ['test', 0 as number] as const,
+            queryFn: () => 100,
+            enableOnDemand: true,
+          },
+          queryClient,
+        );
+
+        mobxQuery.result.data;
+        mobxQuery.result.isLoading;
+
+        expect(mobxQuery.spies.queryFn).toBeCalledTimes(1);
+
         mobxQuery.dispose();
       });
     });

src/mobx-query.ts

@@ -47,7 +47,16 @@ export class MobxQuery<
 
   private isEnabledOnResultDemand: boolean;
 
-  private _originEnabled: MobxQueryOptions<TData, TError, TQueryKey>['enabled'];
+  private isEnabledHolded = false;
+  /**
+   * This parameter is responsible for holding the enabled value,
+   * in cases where the "enableOnDemand" option is enabled
+   */
+  private holdedEnabledOption: MobxQueryOptions<
+    TData,
+    TError,
+    TQueryKey
+  >['enabled'];
   private _observerSubscription?: VoidFunction;
   private hooks?: MobxQueryClientHooks;
 
@@ -184,14 +193,6 @@ export class MobxQuery<
     );
   }
 
-  private checkIsEnabled() {
-    if (this.isEnabledOnResultDemand && !this.isResultRequsted) {
-      return false;
-    }
-
-    return this._originEnabled;
-  }
-
   private createOptions(
     optionsUpdate:
       | Partial<MobxQueryOptions<TData, TError, TQueryKey>>
@@ -202,11 +203,28 @@ export class MobxQuery<
       ...this.options,
       ...optionsUpdate,
     } as any) as MobxQueryOptions<TData, TError, TQueryKey>;
-    if ('enabled' in optionsUpdate) {
-      this._originEnabled = options.enabled;
+
+    // If the on-demand query mode is enabled (when using the result property)
+    // then, if the user does not request the result, the queries should not be executed
+    // to do this, we hold the original value of the enabled option
+    // and set enabled to false until the user requests the result (this.isResultRequsted)
+    if (this.isEnabledOnResultDemand) {
+      if (options.enabled !== false) {
+        this.holdedEnabledOption = options.enabled;
+      }
+
+      if (this.isResultRequsted) {
+        if (this.isEnabledHolded) {
+          options.enabled = this.holdedEnabledOption;
+          this.isEnabledHolded = false;
+        }
+      } else {
+        options.enabled = false;
+        this.isEnabledHolded = true;
+      }
     }
+
     options.structuralSharing = options.structuralSharing ?? false;
-    options.enabled = this.checkIsEnabled();
     options.queryHash = this.createQueryHash(options.queryKey, options);
 
     return options;