mirror of
https://github.com/withastro/astro.git
synced 2024-12-16 21:46:22 -05:00
Split up e2e HMR test (#3425)
This commit is contained in:
parent
8eec97fdd1
commit
28ede84a88
1 changed files with 38 additions and 28 deletions
|
@ -106,41 +106,51 @@ test.describe('Multiple frameworks', () => {
|
|||
await expect(bComponent, 'component text is visible').toHaveText('Hello Astro (B)');
|
||||
});
|
||||
|
||||
test('HMR', async ({ astro, page }) => {
|
||||
await page.goto('/');
|
||||
test.describe('HMR', () => {
|
||||
test('Page template', async ({ astro, page }) => {
|
||||
await page.goto('/');
|
||||
|
||||
// 1: updating the page template
|
||||
const preactSlot = page.locator('#preact-counter + .counter-message');
|
||||
await expect(preactSlot, 'initial slot content').toHaveText('Hello Preact!');
|
||||
// 1: updating the page template
|
||||
const preactSlot = page.locator('#preact-counter + .counter-message');
|
||||
await expect(preactSlot, 'initial slot content').toHaveText('Hello Preact!');
|
||||
|
||||
await astro.editFile('./src/pages/index.astro', (content) =>
|
||||
content.replace('Hello Preact!', 'Hello Preact, updated!')
|
||||
);
|
||||
await astro.editFile('./src/pages/index.astro', (content) =>
|
||||
content.replace('Hello Preact!', 'Hello Preact, updated!')
|
||||
);
|
||||
|
||||
await expect(preactSlot, 'slot content updated').toHaveText('Hello Preact, updated!');
|
||||
await expect(preactSlot, 'slot content updated').toHaveText('Hello Preact, updated!');
|
||||
});
|
||||
|
||||
// Edit the react component
|
||||
await astro.editFile('./src/components/ReactCounter.jsx', (content) =>
|
||||
content.replace('useState(0)', 'useState(5)')
|
||||
);
|
||||
test('React component', async ({ astro, page }) => {
|
||||
await page.goto('/');
|
||||
|
||||
const reactCount = await page.locator('#react-counter pre');
|
||||
await expect(reactCount, 'initial count updated to 5').toHaveText('5');
|
||||
// Edit the react component
|
||||
await astro.editFile('./src/components/ReactCounter.jsx', (content) =>
|
||||
content.replace('useState(0)', 'useState(5)')
|
||||
);
|
||||
|
||||
// Edit the svelte component's style
|
||||
const svelteCounter = page.locator('#svelte-counter');
|
||||
await expect(svelteCounter, 'initial background is white').toHaveCSS(
|
||||
'background-color',
|
||||
'rgb(255, 255, 255)'
|
||||
);
|
||||
const reactCount = await page.locator('#react-counter pre');
|
||||
await expect(reactCount, 'initial count updated to 5').toHaveText('5');
|
||||
});
|
||||
|
||||
await astro.editFile('./src/components/SvelteCounter.svelte', (content) =>
|
||||
content.replace('background: white', 'background: rgb(230, 230, 230)')
|
||||
);
|
||||
test('Svelte component', async ({ astro, page }) => {
|
||||
await page.goto('/');
|
||||
|
||||
await expect(svelteCounter, 'background color updated').toHaveCSS(
|
||||
'background-color',
|
||||
'rgb(230, 230, 230)'
|
||||
);
|
||||
// Edit the svelte component's style
|
||||
const svelteCounter = page.locator('#svelte-counter');
|
||||
await expect(svelteCounter, 'initial background is white').toHaveCSS(
|
||||
'background-color',
|
||||
'rgb(255, 255, 255)'
|
||||
);
|
||||
|
||||
await astro.editFile('./src/components/SvelteCounter.svelte', (content) =>
|
||||
content.replace('background: white', 'background: rgb(230, 230, 230)')
|
||||
);
|
||||
|
||||
await expect(svelteCounter, 'background color updated').toHaveCSS(
|
||||
'background-color',
|
||||
'rgb(230, 230, 230)'
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue