0
Fork 0
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:
Matthew Phillips 2022-05-23 15:56:38 -04:00 committed by GitHub
parent 8eec97fdd1
commit 28ede84a88
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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)'
);
});
});
});