Changing URLs
We have managed to change pages and visually mark in the browser where we are, but the browser URL is still passive. We are going to add a mechanism to update the path every time we change pages.
In JavaScript, we can use the History API to manipulate the address that the visitor sees in the browser. For example, if you wanted to show that you are at /login/, you would implement the following:
history.pushState({}, '', '/login/')
What we will do is modify the event listener message by adding the line we just mentioned, together with a new parameter that will always send a Consumer class called url:
// Event when a new message is received by WebSockets
myWebSocket.addEventListener("message", (event) => {
// Parse the data received
const data = JSON.parse(event.data);
// Renders the HTML received from the Consumer
const selector =...