diff --git a/.changeset/great-bears-watch.md b/.changeset/great-bears-watch.md new file mode 100644 index 000000000..ced76bad7 --- /dev/null +++ b/.changeset/great-bears-watch.md @@ -0,0 +1,9 @@ +--- +'astro': patch +--- + +Revert fix #8472 + +[#8472](https://github.com/withastro/astro/pull/8472) caused some style files from previous pages to not be cleanly deleted on view transitions. For a discussion of a future fix for the original issue [#8144](https://github.com/withastro/astro/issues/8114) see [#8745](https://github.com/withastro/astro/pull/8745). + + diff --git a/packages/astro/e2e/view-transitions.test.js b/packages/astro/e2e/view-transitions.test.js index 31e3128f5..f8bbad1cd 100644 --- a/packages/astro/e2e/view-transitions.test.js +++ b/packages/astro/e2e/view-transitions.test.js @@ -648,7 +648,7 @@ test.describe('View Transitions', () => { expect(loads.length, 'There should be 2 page loads').toEqual(2); }); - test('client:only styles are retained on transition', async ({ page, astro }) => { + test.skip('client:only styles are retained on transition', async ({ page, astro }) => { const totalExpectedStyles = 7; // Go to page 1 diff --git a/packages/astro/src/transitions/router.ts b/packages/astro/src/transitions/router.ts index 1049f92d1..e4dc9d52d 100644 --- a/packages/astro/src/transitions/router.ts +++ b/packages/astro/src/transitions/router.ts @@ -42,11 +42,6 @@ const announce = () => { }; const PERSIST_ATTR = 'data-astro-transition-persist'; const parser = new DOMParser(); -// explained at its usage -let noopEl: HTMLDivElement; -if (import.meta.env.DEV) { - noopEl = document.createElement('div'); -} // The History API does not tell you if navigation is forward or back, so // you can figure it using an index. On pushState the index is incremented so you @@ -198,22 +193,6 @@ async function updateDOM( const href = el.getAttribute('href'); return newDocument.head.querySelector(`link[rel=stylesheet][href="${href}"]`); } - // What follows is a fix for an issue (#8472) with missing client:only styles after transition. - // That problem exists only in dev mode where styles are injected into the page by Vite. - // Returning a noop element ensures that the styles are not removed from the old document. - // Guarding the code below with the dev mode check - // allows tree shaking to remove this code in production. - if (import.meta.env.DEV) { - if (el.tagName === 'STYLE' && el.dataset.viteDevId) { - const devId = el.dataset.viteDevId; - // If this same style tag exists, remove it from the new page - return ( - newDocument.querySelector(`style[data-vite-dev-id="${devId}"]`) || - // Otherwise, keep it anyways. This is client:only styles. - noopEl - ); - } - } return null; };