Add indium-update-script-source-hook

doc/Indium.texi

@@ -153,7 +153,7 @@ The inspector
 @end menu
 
 @node Installation,Getting up and running,,Table of contents
-@anchor{installation installation}@anchor{3}@anchor{installation doc}@anchor{4}
+@anchor{installation doc}@anchor{3}@anchor{installation installation}@anchor{4}
 @section Installation
 
 
@@ -220,7 +220,7 @@ Add the following to your Emacs configuration:
 @end example
 
 @node Getting up and running,The REPL,Installation,Table of contents
-@anchor{setup doc}@anchor{7}@anchor{setup getting-up-and-running}@anchor{8}@anchor{setup up-and-running}@anchor{9}
+@anchor{setup doc}@anchor{7}@anchor{setup up-and-running}@anchor{8}@anchor{setup getting-up-and-running}@anchor{9}
 @section Getting up and running
 
 
@@ -232,7 +232,7 @@ Add the following to your Emacs configuration:
 @end menu
 
 @node NodeJS,Chrome/Chromium,,Getting up and running
-@anchor{setup id1}@anchor{a}@anchor{setup nodejs}@anchor{b}
+@anchor{setup nodejs}@anchor{a}@anchor{setup id1}@anchor{b}
 @subsection NodeJS
 
 
@@ -287,7 +287,7 @@ M-x indium-connect-to-chrome
 @end example
 
 @node Using local files when debugging,,Chrome/Chromium,Getting up and running
-@anchor{setup local-files}@anchor{e}@anchor{setup using-local-files-when-debugging}@anchor{f}
+@anchor{setup using-local-files-when-debugging}@anchor{e}@anchor{setup local-files}@anchor{f}
 @subsection Using local files when debugging
 
 
@@ -337,7 +337,7 @@ directory!
 @end cartouche
 
 @node The REPL,Interaction in JS buffers,Getting up and running,Table of contents
-@anchor{repl the-repl}@anchor{10}@anchor{repl repl}@anchor{11}@anchor{repl doc}@anchor{12}
+@anchor{repl the-repl}@anchor{10}@anchor{repl doc}@anchor{11}@anchor{repl repl}@anchor{12}
 @section The REPL
 
 
@@ -354,7 +354,7 @@ directory!
 
 
 A REPL (Read Eval Print Loop) buffer is automatically open when a new Indium
-connection is made (see @ref{9,,Getting up and running}).
+connection is made (see @ref{8,,Getting up and running}).
 
 @image{repl,,,,png}
 
@@ -488,7 +488,7 @@ the current stack frame, and will be able to access local variables from the
 stack, etc.
 
 @node Interaction in JS buffers,The stepping debugger,The REPL,Table of contents
-@anchor{code-evaluation interaction}@anchor{19}@anchor{code-evaluation doc}@anchor{1a}@anchor{code-evaluation interaction-in-js-buffers}@anchor{1b}
+@anchor{code-evaluation doc}@anchor{19}@anchor{code-evaluation interaction}@anchor{1a}@anchor{code-evaluation interaction-in-js-buffers}@anchor{1b}
 @section Interaction in JS buffers
 
 
@@ -542,15 +542,15 @@ Here's a list of available keybindings:
 
 
 Press @code{C-c C-z} from any buffer with @code{indium-interaction-mode} turned on to
-switch back to the REPL buffer (see @ref{11,,The REPL}).
+switch back to the REPL buffer (see @ref{12,,The REPL}).
 
 @node Adding and removing breakpoints,Live code update hot-swapping JavaScript sources,Switching to the REPL buffer,Interaction in JS buffers
 @anchor{code-evaluation adding-and-removing-breakpoints}@anchor{1e}
 @subsection Adding and removing breakpoints
 
 
 You need to first make sure that Indium is set up correctly to use local files
-(see @ref{e,,Using local files when debugging}).
+(see @ref{f,,Using local files when debugging}).
 
 
 @itemize -
@@ -601,7 +601,7 @@ Chrome 57 and earlier.  We strongly encourage you to use Chrome >=
 @end cartouche
 
 To enable live updates, make sure Indium is set up to use local files (see
-@ref{e,,Using local files when debugging}).
+@ref{f,,Using local files when debugging}).
 
 
 @itemize -
@@ -615,19 +615,37 @@ current buffer.
 script JavaScript source after each buffer save.
 @end itemize
 
+You can setup a hook to be run after each script update. For example
+
+@example
+(add-hook 'indium-update-script-source-hook
+        (lambda (url)
+          (indium-eval (format "window.dispatchEvent(new CustomEvent('patch', @{detail: @{url: '%s'@}@}))"
+                               url))))
+@end example
+
+Then you can use it in your app for development purposes
+
+@example
+window.addEventListener("patch", (event) => @{
+  console.log("Patched @@ " + new Date().toTimeString().substring(0, 8), event.detail.url);
+  // rerender, etc
+@});
+@end example
+
 @node The stepping debugger,The inspector,Interaction in JS buffers,Table of contents
-@anchor{debugger doc}@anchor{21}@anchor{debugger debugger}@anchor{1f}@anchor{debugger the-stepping-debugger}@anchor{22}
+@anchor{debugger the-stepping-debugger}@anchor{21}@anchor{debugger doc}@anchor{22}@anchor{debugger debugger}@anchor{1f}
 @section The stepping debugger
 
 
 @node The inspector,,The stepping debugger,Table of contents
-@anchor{inspector the-inspector}@anchor{23}@anchor{inspector inspector}@anchor{14}@anchor{inspector doc}@anchor{24}
+@anchor{inspector inspector}@anchor{14}@anchor{inspector doc}@anchor{23}@anchor{inspector the-inspector}@anchor{24}
 @section The inspector
 
 
 Indium features an object inspector that can be open on any object reference
-from a REPL buffer (see @ref{11,,The REPL}), the debugger (see @ref{1f,,The stepping debugger}), or
-the result of any evaluation of JavaScript code (see @ref{19,,Interaction in JS buffers}).
+from a REPL buffer (see @ref{12,,The REPL}), the debugger (see @ref{1f,,The stepping debugger}), or
+the result of any evaluation of JavaScript code (see @ref{1a,,Interaction in JS buffers}).
 
 To inspect the result of the evaluation of an expression, press @code{C-c M-i}.  An
 inspector buffer will pop up.  You can also press @code{RET} or left click on

indium-backend.el

@@ -171,7 +171,7 @@ A breakpoint is an alist with the keys `id', `file', and `line'."
                   (string= (map-elt brk 'file) file))
                 breakpoints)))
 
-(cl-defgeneric indium-backend-set-script-source (backend url source)
+(cl-defgeneric indium-backend-set-script-source (backend url source &optional callback)
   "Update the contents of the script at URL to SOURCE.")
 
 (cl-defgeneric indium-backend-get-properties (backend reference &optional callback all-properties)

indium-interaction.el

@@ -35,6 +35,9 @@
   :type 'boolean
   :group 'indium)
 
+(defvar indium-update-script-source-hook nil
+  "Hook run when script source is updated.")
+
 (defun indium-eval (string &optional callback)
   "Evaluate STRING on the current backend.
 When CALLBACK is non-nil, evaluate CALLBACK with the result.
@@ -196,7 +199,9 @@ If PRINT is non-nil, print the output into the current buffer."
   (when-let ((url (indium-workspace-make-url buffer-file-name)))
     (indium-backend-set-script-source (indium-backend)
                                       url
-                                      (buffer-string))))
+                                      (buffer-string)
+                                      (lambda ()
+                                        (run-hook-with-args 'indium-update-script-source-hook url)))))
 
 (add-hook 'after-save-hook #'indium-interaction-update)
 

indium-webkit.el

@@ -140,7 +140,7 @@ prototype chain of the remote object."
               (indium-webkit--properties
                (map-nested-elt response '(result result)))))))
 
-(cl-defmethod indium-backend-set-script-source ((backend (eql webkit)) url source)
+(cl-defmethod indium-backend-set-script-source ((backend (eql webkit)) url source &optional callback)
   (when-let ((script-id (indium-webkit--get-script-id url)))
     (indium-webkit--send-request
      `((method . "Runtime.compileScript")
@@ -151,7 +151,10 @@ prototype chain of the remote object."
        (indium-webkit--send-request
         `((method . "Debugger.setScriptSource")
           (params . ((scriptId . ,script-id)
-                     (scriptSource . ,source)))))))))
+                     (scriptSource . ,source))))
+        (lambda (response)
+          (when callback
+            (funcall callback))))))))
 
 (cl-defmethod indium-backend-get-script-source ((backend (eql webkit)) frame callback)
   (let ((script-id (map-nested-elt frame '(location scriptId))))

sphinx-doc/code-evaluation.rst

@@ -42,7 +42,7 @@ You need to first make sure that Indium is set up correctly to use local files
 
 Once a breakpoint is set, execution will stop when a breakpoint is hit, and the
 Indium debugger pops up (see :ref:`debugger`).
-  
+
 .. Note:: Breakpoints are persistent: if the connection is closed, when a new
           connection is made Indium will attempt to add back all breakpoints.
 
@@ -68,3 +68,17 @@ To enable live updates, make sure Indium is set up to use local files (see
   current buffer.
 - ``(setq indium-update-script-on-save t)``: Automatically update the runtime
   script JavaScript source after each buffer save.
+
+You can setup a hook to be run after each script update. For example ::
+
+  (add-hook 'indium-update-script-source-hook
+	  (lambda (url)
+	    (indium-eval (format "window.dispatchEvent(new CustomEvent('patch', {detail: {url: '%s'}}))"
+				 url))))
+
+Then you can use it in your app for development purposes ::
+
+  window.addEventListener("patch", (event) => {
+    console.log("Patched @ " + new Date().toTimeString().substring(0, 8), event.detail.url);
+    // rerender, etc
+  });