find box can be used also on render notes

src/public/app/widgets/find.js

@@ -142,19 +142,11 @@ export default class FindWidget extends NoteContextAwareWidget {
             return;
         }
 
-        if (!['text', 'code'].includes(this.note.type) || !this.$findBox.is(":hidden")) {
+        if (!['text', 'code', 'render'].includes(this.note.type) || !this.$findBox.is(":hidden")) {
             return;
         }
 
-        const readOnly = await this.noteContext.isReadOnly();
+        this.handler = await this.getHandler();
-
-        if (readOnly) {
-            this.handler = this.htmlHandler;
-        } else {
-            this.handler = this.note.type === "code"
-                ? this.codeHandler
-                : this.textHandler;
-        }
 
         this.$findBox.show();
         this.$input.focus();
@@ -173,6 +165,22 @@ export default class FindWidget extends NoteContextAwareWidget {
         }
     }
 
+    async getHandler() {
+        if (this.note.type === 'render') {
+            return this.htmlHandler;
+        }
+
+        const readOnly = await this.noteContext.isReadOnly();
+
+        if (readOnly) {
+            return this.htmlHandler;
+        } else {
+            return this.note.type === "code"
+                ? this.codeHandler
+                : this.textHandler;
+        }
+    }
+
     startSearch() {
         // XXX This should clear the previous search immediately in all cases
         //     (the search is stale when waitforenter but also while the
@@ -250,6 +258,6 @@ export default class FindWidget extends NoteContextAwareWidget {
     }
 
     isEnabled() {
-        return super.isEnabled() && ['text', 'code'].includes(this.note.type);
+        return super.isEnabled() && ['text', 'code', 'render'].includes(this.note.type);
     }
 }

src/public/app/widgets/type_widgets/render.js

@@ -3,13 +3,19 @@ import TypeWidget from "./type_widget.js";
 
 const TPL = `
 <div class="note-detail-render note-detail-printable">
+    <style>
+        .note-detail-render {
+            position: relative;
+        }
+    </style>
+
     <div class="note-detail-render-help alert alert-warning" style="margin: 50px; padding: 20px;">
         <p><strong>This help note is shown because this note of type Render HTML doesn't have required relation to function properly.</strong></p>
 
         <p>Render HTML note type is used for <a class="external" href="https://github.com/zadam/trilium/wiki/Scripts">scripting</a>. In short, you have a HTML code note (optionally with some JavaScript) and this note will render it. To make it work, you need to define a <a class="external" href="https://github.com/zadam/trilium/wiki/Attributes">relation</a> called "renderNote" pointing to the HTML note to render.</p>
     </div>
 
-    <div class="note-detail-render-content" style="height: 100%; overflow: auto;"></div>
+    <div class="note-detail-render-content"></div>
 </div>`;
 
 export default class RenderTypeWidget extends TypeWidget {
@@ -43,4 +49,14 @@ export default class RenderTypeWidget extends TypeWidget {
             this.refresh();
         }
     }
+
+    async executeWithContentElementEvent({resolve, ntxId}) {
+        if (!this.isNoteContext(ntxId)) {
+            return;
+        }
+
+        await this.initialized;
+
+        resolve(this.$noteDetailRenderContent);
+    }
 }