Problem/Motivation
After implementing #3397584: Turbo: Behaviours are often not attached if the script containing the behaviour finishes downloading/is evalutated after Turbo has rendered the new page, it's become clear that there are a number of behaviours which aren't written to properly handle the whole body being replaced and then cause errors when attached again after a detach.
Steps to reproduce
Load various site pages with Turbo active, and navigate by clicking various links; observe eventual console errors to various things.
Proposed resolution
Contribute fixes to core and contrib projects.
Drupal core
- ✅
- worked around by replacing with our own JavaScript.core/misc/announce.jsonly ever creates one element, and stores a persistent reference to it, even if it's removed - ✅
- worked around by rewriting our owncore/misc/batch.jsalways unnecessarily forces a full page load when batch operation completesbatch.jswhich replaces core's. - ✅
Contextual links behaviour does not have a detach, which may be causing contextual links being left behind when caching the page; see #3411449: Turbo: Support Turbo cache.- Should now be fixed. - ⏳ Media Library module has no detaches:
- ⏳ Navigation module: this has multiple issues due to its spaghetti JavaScript code:
- ✅
#3487905: New navigation does not displace if detached and attached again - ✅
Multiple issues when Turbo caching is enabled; opening issues TBD; see also #3411449: Turbo: Support Turbo cache- Worked around for now by runningonce.remove()on their identifiers before caching.
- ✅
- ✅
- Fixed by rewriting it with our own replacement.core/misc/dropbutton/dropbutton.js - ⏳
core/misc/tabledrag.jsis a massive beast which stores a bunch of global state.- ❌ Claro also has its own
tabledrag.jsthat adds a few more things. - See
3399243-tabledragissue fork for ongoing work.
- ❌ Claro also has its own
- ✅
- Fixed by adding our own compatibility JS.core/misc/tableselect.js- ✅
Also needs additional fix on media grid (- This has been fixed for Gin but Claro's select all seems to be broken on 10.5.1 even with RefreshLess uninstalled so this may not be our problem.admin/content/media-grid); broken on both Claro and Gin so not Gin-specific; this may be because Claro has its owntableselect.jswith additional functionality that we may need to port over.
- ✅
Remaining tasks
TBD.
User interface changes
Stuff should be more reliable.
API changes
None.
Data model changes
None.
Issue fork refreshless-3399243
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
ambient.impactAdded Gin list item with Claro CSS being incorrectly used.
Comment #3
ambient.impactRemoved Gin CSS stuff; moved to #3399314: Turbo: CSS files merged into the <head> always appended instead of preserving full page load order, causing CSS specificity issues
Comment #4
ambient.impactAdded #3411449: Turbo: Support Turbo cache
Comment #5
ambient.impactAdded
core/misc/announce.jslist item.Comment #6
ambient.impactAdded code link for contextual links item.
Comment #7
ambient.impactAdded
core/misc/batch.jsitem.Comment #9
ambient.impactMarked the
core/misc/announce.jsitem as complete.Comment #11
ambient.impactComment #15
ambient.impactAdded dropbutton and table select.
Comment #27
ambient.impactCompleted dropbutton and table select.
Comment #28
ambient.impactSet contextual and core Navigation as completed.
Comment #31
ambient.impactAdded media grid table select item.
Comment #42
ambient.impactComment #44
ambient.impactAdded
tabledrag.jsitem and markedtableselect.jsmore or less fixed.Comment #45
ambient.impactComment #47
ambient.impactAdded Media Library items.