Merge pull request #3438 from obsidian-tasks-group/do-not-render-on-inactive-tabs

feat: Stop tasks searches from running on inactive tabs

Author: claremacrae

src/IQuery.ts

@@ -85,4 +85,14 @@ export interface IQuery {
      * @param objects
      */
     debug(message: string, objects?: any): void;
+
+    /**
+     * Write a warn log message.
+     *
+     * This is provided to allow the query rendering code to log progress on the rendering,
+     * including meaningful information about the query being rendered.
+     * @param message
+     * @param objects
+     */
+    warn(message: string, objects?: any): void;
 }

src/Query/Query.ts

@@ -458,4 +458,8 @@ ${statement.explainStatement('    ')}
     public debug(message: string, objects?: any): void {
         this.logger.debugWithId(this._queryId, `"${this.filePath}": ${message}`, objects);
     }
+
+    public warn(message: string, objects?: any): void {
+        this.logger.warnWithId(this._queryId, `"${this.filePath}": ${message}`, objects);
+    }
 }

src/Renderer/QueryRenderer.ts

@@ -92,6 +92,9 @@ class QueryRenderChild extends MarkdownRenderChild {
     private renderEventRef: EventRef | undefined;
     private queryReloadTimeout: NodeJS.Timeout | undefined;
 
+    private isCacheChangedSinceLastRedraw = false;
+    private observer: IntersectionObserver | null = null;
+
     private readonly queryResultsRenderer: QueryResultsRenderer;
 
     constructor({
@@ -162,6 +165,38 @@ class QueryRenderChild extends MarkdownRenderChild {
                 this.handleMetadataOrFilePathChange(tFile.path, fileCache);
             }),
         );
+
+        this.setupVisibilityObserver();
+    }
+
+    private setupVisibilityObserver() {
+        if (this.observer) {
+            return;
+        }
+
+        this.observer = new IntersectionObserver(([entry]) => {
+            if (!this.containerEl.isShown()) {
+                return;
+            }
+
+            // entry describes a single visibility change for the specific element we are observing.
+            // It is safe to assume `entry.target === this.containerEl` here.
+            if (!entry.isIntersecting) {
+                return;
+            }
+
+            this.queryResultsRenderer.query.debug(
+                `[render][observer] Became visible, isCacheChangedSinceLastRedraw:${this.isCacheChangedSinceLastRedraw}`,
+            );
+            if (this.isCacheChangedSinceLastRedraw) {
+                this.queryResultsRenderer.query.debug('[render][observer] ... updating search results');
+                this.render({ tasks: this.plugin.getTasks(), state: this.plugin.getState() })
+                    .then()
+                    .catch((e) => console.error(e));
+            }
+        });
+
+        this.observer.observe(this.containerEl);
     }
 
     private handleMetadataOrFilePathChange(filePath: string, fileCache: CachedMetadata | null) {
@@ -189,6 +224,9 @@ class QueryRenderChild extends MarkdownRenderChild {
         if (this.queryReloadTimeout !== undefined) {
             clearTimeout(this.queryReloadTimeout);
         }
+
+        this.observer?.disconnect();
+        this.observer = null;
     }
 
     /**
@@ -219,6 +257,42 @@ class QueryRenderChild extends MarkdownRenderChild {
     }
 
     private async render({ tasks, state }: { tasks: Task[]; state: State }) {
+        // We got here because the Cache reported a change in at least one task in the vault.
+        // So note that any results we have already drawn are now out-of-date:
+        this.isCacheChangedSinceLastRedraw = true;
+
+        requestAnimationFrame(async () => {
+            // We have to wrap the rendering inside requestAnimationFrame() to ensure
+            // that we get correct values for isConnected and isShown().
+            if (!this.containerEl.isConnected) {
+                // Example reasons why we might not be "connected":
+                // - This Tasks query block is contained within another plugin's code block,
+                //   such as a Tabs plugin. The file is closed and that plugin has not correctly
+                //   tidied up, so we have not been deleted.
+                this.queryResultsRenderer.query.debug(
+                    '[render] Ignoring redraw request, as code block is not connected.',
+                );
+                return;
+            }
+
+            if (!this.containerEl.isShown()) {
+                // Example reasons why we might not be "shown":
+                // - We are in a collapsed callout.
+                // - We are in a note which is obscured by another note.
+                // - We are in a Tabs plugin, in a tab which is not at the front.
+                // - The user has not yet scrolled to this code block's position in the file.
+                this.queryResultsRenderer.query.debug('[render] Ignoring redraw request, as code block is not shown.');
+                return;
+            }
+
+            await this.renderResults(state, tasks);
+
+            // Our results are now up-to-date:
+            this.isCacheChangedSinceLastRedraw = false;
+        });
+    }
+
+    private async renderResults(state: State, tasks: Task[]) {
         const content = createAndAppendElement('div', this.containerEl);
         await this.queryResultsRenderer.render(state, tasks, content, {
             allTasks: this.plugin.getTasks(),

src/main.ts

@@ -2,7 +2,7 @@ import { Plugin } from 'obsidian';
 
 import type { Task } from 'Task/Task';
 import { i18n, initializeI18n } from './i18n/i18n';
-import { Cache } from './Obsidian/Cache';
+import { Cache, State } from './Obsidian/Cache';
 import { Commands } from './Commands';
 import { GlobalQuery } from './Config/GlobalQuery';
 import { TasksEvents } from './Obsidian/TasksEvents';
@@ -107,6 +107,13 @@ export default class TasksPlugin extends Plugin {
         }
     }
 
+    public getState(): State {
+        if (this.cache === undefined) {
+            return State.Cold;
+        }
+        return this.cache.getState();
+    }
+
     /**
      * Add {@link QueryFileDefaults} properties to the Obsidian vault's types.json file,
      * so that they are available via auto-complete in the File Properties panel.