Fixing HMR for hoisted scripts (#3427)
* WIP: the leading /@fs broke script HMR * Revert "WIP: the leading /@fs broke script HMR" This reverts commit 84fce366268033261369aed48f909e59e78bf3e4. * Metadata needs to strip off /@fs from hoisted script URLs * adding a test for hoisted script HMR support * removing 2 second timeout on navigation, allow default 30 seconds * simplifying the hoisted script test sync * TEMP: bubbling up console logs to track down windows failure * removing temp logging * disabling the test on windows for now * chore: adding changeset
This commit is contained in:
parent
b2f955ec1b
commit
10b2589093
4 changed files with 33 additions and 3 deletions
5
.changeset/quick-crabs-lay.md
Normal file
5
.changeset/quick-crabs-lay.md
Normal file
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fixes HMR support for inline scripts in Astro components on Linux and OSX
|
|
@ -1,4 +1,5 @@
|
|||
import { test as base, expect } from '@playwright/test';
|
||||
import os from 'os';
|
||||
import { loadFixture } from './test-utils.js';
|
||||
|
||||
const test = base.extend({
|
||||
|
@ -18,8 +19,8 @@ test.afterEach(async () => {
|
|||
await devServer.stop();
|
||||
});
|
||||
|
||||
test.describe('Astro components', () => {
|
||||
test('HMR', async ({ page, astro }) => {
|
||||
test.describe('Astro component HMR', () => {
|
||||
test('component styles', async ({ page, astro }) => {
|
||||
await page.goto(astro.resolveUrl('/'));
|
||||
|
||||
const hero = page.locator('section');
|
||||
|
@ -39,4 +40,23 @@ test.describe('Astro components', () => {
|
|||
'rgb(230, 230, 230)'
|
||||
);
|
||||
});
|
||||
|
||||
// TODO: Re-enable this test on windows when #3424 is fixed
|
||||
// https://github.com/withastro/astro/issues/3424
|
||||
const it = os.platform() === 'win32' ? test.skip : test;
|
||||
it('hoisted scripts', async ({ page, astro }) => {
|
||||
const initialLog = page.waitForEvent('console', (message) => message.text() === 'Hello, Astro!');
|
||||
|
||||
await page.goto(astro.resolveUrl('/'));
|
||||
await initialLog;
|
||||
|
||||
const updatedLog = page.waitForEvent('console', (message) => message.text() === 'Hello, updated Astro!');
|
||||
|
||||
// Edit the hoisted script on the page
|
||||
await astro.editFile('./src/pages/index.astro', (content) =>
|
||||
content.replace('Hello, Astro!', 'Hello, updated Astro!')
|
||||
);
|
||||
|
||||
await updatedLog;
|
||||
});
|
||||
});
|
||||
|
|
|
@ -14,3 +14,7 @@ import Hero from '../components/Hero.astro';
|
|||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script>
|
||||
console.log('Hello, Astro!');
|
||||
</script>
|
||||
|
|
|
@ -102,7 +102,8 @@ export class Metadata {
|
|||
let i = 0,
|
||||
pathname = metadata.mockURL.pathname;
|
||||
while (i < metadata.hoisted.length) {
|
||||
yield `${pathname}?astro&type=script&index=${i}`;
|
||||
// Strip off the leading "/@fs" added during compilation.
|
||||
yield `${pathname.replace('/@fs', '')}?astro&type=script&index=${i}`;
|
||||
i++;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue