# Adding a restart process button in Pluto

**URL:** <https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812>\
**Category:** Pluto\
**Tags:** pluto\
**Created:** [February 20, 2022, 5:23pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812 "2022-02-20T17:23:12Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![rikh](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rikh/32/204104_2.png) [@rikh](https://discourse.julialang.org/u/rikh)\
**Post date:** [February 20, 2022, 5:23pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/1 "2022-02-20T17:23:13Z")

</div>

I’m trying to get a SnoopCompile workflow going inside a Pluto notebook. Since SnoopCompile requires a lot of process restarts, it would be nice to have a “Restart” button. I think that this should be possible by sending a CustomEvent to the backend, but I’m unable to locate the current notebook id.

```julia
HTML("""
<div>
	<button id="myrestart" href="#">Restart</button>
	
	<script>
		const div = currentScript.parentElement
		const button = div.querySelector("button#myrestart")
		button.onclick = function() { restart_nb() };
		function restart_nb() {
			div.dispatchEvent(
				new CustomEvent("restart_process"),
				{},
				{ notebook_id: div.state.notebook.notebook.id }
			);
		};
		
	</script>
</div>
""")

```

When clicking the button, this fails on

```nohighlight
Uncaught TypeError: Cannot read properties of undefined (reading 'notebook')
    at restart_nb (eval at ga (editor.9e18b711.js:248:175), <anonymous>:12:30)
    at HTMLButtonElement.button.onclick (eval at ga (editor.9e18b711.js:248:175), <anonymous>:7:33)

```

So, the question is: where I can find the current notebook id?

---

<div class="post-metadata">

**Author:** ![nilshg](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/nilshg/32/2283_2.png) [@nilshg](https://discourse.julialang.org/u/nilshg)\
**Post date:** [February 20, 2022, 6:00pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/2 "2022-02-20T18:00:52Z")

</div>

Not a direct answer to your question but Pluto already has a restart option which gets triggered when you make changes to your environment, maybe have a look into how that works?

---

<div class="post-metadata">

**Author:** ![rikh](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rikh/32/204104_2.png) [@rikh](https://discourse.julialang.org/u/rikh)\
**Post date:** [February 20, 2022, 6:17pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/3 "2022-02-20T18:17:26Z")

</div>

It’s [here](https://github.com/fonsp/Pluto.jl/blob/2cca8697499f9733c182fa79702aa5eaeed91281/frontend/components/Editor.js#L1194-L1206). I already looked at it, but `notebook` is not defined in global Javascript scope.

---

<div class="post-metadata">

**Author:** ![rikh](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/rikh/32/204104_2.png) [@rikh](https://discourse.julialang.org/u/rikh)\
**Post date:** [February 20, 2022, 6:38pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/4 "2022-02-20T18:38:59Z")

</div>

Answering your question did help out 🥳 The following code sets the process status to “no\_process”. Clicking next to the cell will then show the “Restart required” message:

```julia
HTML("""
<!-- the wrapper span -->
<div>
	<button id="myrestart" href="#">Restart</button>
	
	<script>
		const div = currentScript.parentElement
		const button = div.querySelector("button#myrestart")
		console.log(button);
		button.onclick = function() { restart_nb() };
		console.log(div.dispatchEvent)
		function restart_nb() {
			console.log("Send event");
			editor_state.notebook.process_status = "no_process";
			window.dispatchEvent(
				new CustomEvent("restart_process"),
				{},
				{ notebook_id: editor_state.notebook.id }
			);
		};
	</script>
</div>
""")

```

It’s something

---

<div class="post-metadata">

**Author:** ![fonsp](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/fonsp/32/222349_2.png) [@fonsp](https://discourse.julialang.org/u/fonsp)\
**Post date:** [July 17, 2023, 2:41pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/5 "2023-07-17T14:41:20Z")

</div>

Here you go!! Based on what @rikh started, with changes:

- use the react setter, `editor_state_set` instead of [modifying react state directly](https://react.dev/learn/updating-objects-in-state)
- wait for the change to take effect, then search for the button an `.click()` it 🙂

(This is not official API so it might break in a future patch.)

```julia
html"""
<script>
	const button = document.createElement("button")

	button.addEventListener("click", () => {
		editor_state_set(old_state => ({
			notebook: {
				...old_state.notebook,
				process_status: "no_process",
			},
		})).then(() => {
			window.requestAnimationFrame(() => {
				document.querySelector("#process_status a").click()
			})
		})
	})
	button.innerText = "Restart process"

	return button
</script>
"""

```

---

<div class="post-metadata">

**Author:** ![e3c6](https://avatars.discourse-cdn.com/v4/letter/e/e79b87/32.png) [@e3c6](https://discourse.julialang.org/u/e3c6)\
**Post date:** [June 27, 2025, 3:08pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/6 "2025-06-27T15:08:49Z")

</div>

It would be nice to have that in a package, e.g. `PlutoUI` could be good place?

---

<div class="post-metadata">

**Author:** ![ForceBru](https://sea2.discourse-cdn.com/julialang/user_avatar/discourse.julialang.org/forcebru/32/21389_2.png) [@ForceBru](https://discourse.julialang.org/u/ForceBru)\
**Post date:** [June 27, 2025, 4:11pm UTC](https://discourse.julialang.org/t/adding-a-restart-process-button-in-pluto/76812/7 "2025-06-27T16:11:37Z")

</div>

IMO, restarting and killing the current notebook is basic functionality and should be included in Pluto itself.

Right now the only way to shut down the notebook seems to be to click the Pluto logo and click the X/Close button in the list of running notebooks. This is unintuitive (why go back to the list of all running notebooks?) and takes too many clicks.
