-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
UPDATE_ON_FETCH — sidebar won't refresh using Turbo 8.0.0 Beta 2 or later. #2110
Comments
Hey @chrisgrande, since I don't know that framework (if it is one), I'll need to get you to put together a reproducible example. Seeing the screencasts, there are errors generated in the console as you click, I want to see what those are. |
Btw, as you stated it works with the earlier version of "turbo" (whatever that is), so if the earlier version works with django-debug-toolbar 5.1.0, I am unsure the toolbar is at fault. |
Hi @karolyi — here is an updated example app: There was already a test page in the example app using Turbo 7.2.4, I created two additional pages, 8b1, and 8b2. You need to hard refresh each versions page to get the new Turbo version loaded. Looking at the changes between Turbo 8 beta 1 and 2, not sure if this might be causing the issue. |
I've checked out your repo today, and all I can see is some weird const redeclaration error that isn't coming from django-debug-toolbar:
Are you sure it is the toolbar to blame here? I see a script tag injected into the page that must be at fault: const incrementFetch = document.querySelector("#incrementFetch");
const incrementXHR = document.querySelector("#incrementXHR");
const value = document.querySelector("#session-value");
incrementFetch.addEventListener("click", function () {
fetch(incrementFetch.dataset.url).then( function (response) {
response.json().then(function(data) {
value.innerHTML = data.value;
});
});
});
incrementXHR.addEventListener("click", function () {
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState === 4) {
value.innerHTML = JSON.parse(xhr.response).value;
}
}
xhr.open('GET', incrementXHR.dataset.url, true);
xhr.send('');
}); |
The injected JS was duplicated from the original Turbo example page in the repo, originally added here. I have updated my repo removing the increment buttons and that JS from the Turbo 8 pages and have added an example with the current version of Turbo 8.0.13. There shouldn't be any obvious console errors now, however the toolbar doesn't update on the page navigation, with versions b2+. |
Oh wait, you meant the |
I guess the whole thing comes down to the order of loading javascripts. It seems that turbo grabs the original window.fetch before toolbar.js overrides (rebinds) it, and so toobar's version doesn't even get used on a page load by turbo. That has nothing to do with my change. |
So, yes, upon more investigating (downloaded turbo.js locally and added some debug to before As long as they use that reference, I'm surprised that toolbar can even pick up the http requests at all. I didn't go into the djdt source to see why the latter happens, but the reason for the former is indeed what you've suggested, and thus I think it's outside the scope of this project. |
Django Debug Toolbar: v5.1.0
Settings:
Using the example project with the above settings as an example, the sidebar will refresh with the Turbo page loads. Between Turbo 8.0.0 Beta 1 and Beta 2 (and all versions after Turbo 8 Beta 2), the sidebar no longer updates .
The History is correctly tracked and you can open the History and switch to any of the page loads, just the sidebar doesn't automatically update to the latest page load.
8.0.0 Beta 1:

8.0.0 Beta 2:

The text was updated successfully, but these errors were encountered: