mirror of
https://github.com/coollabsio/coolify.git
synced 2026-06-14 03:19:51 +00:00
fix(navigation): strip stale x-cloak after Livewire navigation
Remove leftover x-cloak attributes after wire:navigate events so morphed pages do not stay hidden, while keeping the initial-load cloak guard covered by a feature test.
This commit is contained in:
@@ -1,5 +1,13 @@
|
||||
import { initializeTerminalComponent } from './terminal.js';
|
||||
|
||||
// Livewire 3.5.19+ re-applies `x-cloak` to morphed elements during wire:navigate
|
||||
// (via replaceHtmlAttributes). With `[x-cloak]{display:none}` on the app wrapper,
|
||||
// this blanks the whole page on every navigation until Alpine re-processes it.
|
||||
// Strip leftover x-cloak after each navigation; the initial-load FOUC guard stays.
|
||||
document.addEventListener('livewire:navigated', () => {
|
||||
document.querySelectorAll('[x-cloak]').forEach((el) => el.removeAttribute('x-cloak'));
|
||||
});
|
||||
|
||||
['livewire:navigated', 'alpine:init'].forEach((event) => {
|
||||
document.addEventListener(event, () => {
|
||||
// tree-shaking
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
<?php
|
||||
|
||||
it('strips leftover x-cloak after wire:navigate to prevent blank page', function () {
|
||||
$appJs = file_get_contents(resource_path('js/app.js'));
|
||||
|
||||
expect($appJs)
|
||||
->toContain("document.addEventListener('livewire:navigated'")
|
||||
->toContain("querySelectorAll('[x-cloak]')")
|
||||
->toContain("removeAttribute('x-cloak')");
|
||||
});
|
||||
|
||||
it('keeps the initial-load x-cloak guard on the app wrapper', function () {
|
||||
$layout = file_get_contents(resource_path('views/layouts/app.blade.php'));
|
||||
|
||||
expect($layout)->toContain('x-cloak');
|
||||
});
|
||||
Reference in New Issue
Block a user