Commit eedbfdda authored by Robert Knight's avatar Robert Knight

Add "Load client" / "Unload client" toggle button to dev server

Add a button to the dev server to facilitate easy testing of unloading
and re-loading the client, as done by the browser extension and also
some third-party pages.
parent a67e7787
...@@ -29,9 +29,31 @@ function renderScript(context) { ...@@ -29,9 +29,31 @@ function renderScript(context) {
const scriptTemplate = ` const scriptTemplate = `
{{{hypothesisConfig}}} {{{hypothesisConfig}}}
<script> <script>
const embedScript = document.createElement('script'); const toggleClientButton = document.querySelector('#toggleClient');
embedScript.src = '{{{clientUrl}}}'.replace('{current_host}', document.location.hostname);
document.body.appendChild(embedScript); function loadClient() {
const embedScript = document.createElement('script');
embedScript.src = '{{{clientUrl}}}'.replace('{current_host}', document.location.hostname);
document.body.appendChild(embedScript);
toggleClient.textContent = 'Unload client';
}
function unloadClient() {
const annotatorLink = document.querySelector('link[type="application/annotator+html"]');
annotatorLink?.dispatchEvent(new Event('destroy'));
toggleClient.textContent = 'Load client';
}
toggleClientButton.onclick = () => {
const isLoaded = document.querySelector('link[type="application/annotator+html"]');
if (isLoaded) {
unloadClient();
} else {
loadClient();
}
};
loadClient();
</script> </script>
`; `;
return Mustache.render(scriptTemplate, context); return Mustache.render(scriptTemplate, context);
......
...@@ -40,6 +40,7 @@ ...@@ -40,6 +40,7 @@
<button data-hypothesis-trigger> <button data-hypothesis-trigger>
Open sidebar Open sidebar
</button> </button>
<button id="toggleClient">Load client</button>
<h2>Useful links</h2> <h2>Useful links</h2>
<ul> <ul>
<li><a href="https://github.com/hypothesis/client">GitHub project</a></li> <li><a href="https://github.com/hypothesis/client">GitHub project</a></li>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment