Skip to content

Commit

Permalink
Add indium-update-script-source-hook (#46)
Browse files Browse the repository at this point in the history
* Add a new hook `indium-update-script-source-hook` to be run after each script update.
* Add documentation for the new hook.
  • Loading branch information
TatriX authored and NicolasPetton committed May 12, 2017
1 parent 8900596 commit aeca678
Show file tree
Hide file tree
Showing 5 changed files with 59 additions and 19 deletions.
46 changes: 32 additions & 14 deletions doc/Indium.texi
Original file line number Diff line number Diff line change
Expand Up @@ -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


Expand Down Expand Up @@ -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


Expand All @@ -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


Expand Down Expand Up @@ -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


Expand Down Expand Up @@ -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


Expand All @@ -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}

Expand Down Expand Up @@ -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


Expand Down Expand Up @@ -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 -
Expand Down Expand Up @@ -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 -
Expand All @@ -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
Expand Down
2 changes: 1 addition & 1 deletion indium-backend.el
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down
7 changes: 6 additions & 1 deletion indium-interaction.el
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand Down Expand Up @@ -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)

Expand Down
7 changes: 5 additions & 2 deletions indium-webkit.el
Original file line number Diff line number Diff line change
Expand Up @@ -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")
Expand All @@ -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))))
Expand Down
16 changes: 15 additions & 1 deletion sphinx-doc/code-evaluation.rst
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand All @@ -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
});

0 comments on commit aeca678

Please sign in to comment.