fixing up svelte tests

This commit is contained in:
Tony Sullivan 2022-05-16 13:41:42 -05:00
parent 7b85d40f25
commit 8326cfddf7
3 changed files with 25 additions and 11 deletions

View file

@ -1,4 +1,6 @@
<script>
<script lang="ts">
export let id: string;
let count = 0;
function add() {
@ -10,12 +12,12 @@
}
</script>
<div class="counter">
<button on:click={subtract}>-</button>
<div {id} class="counter">
<button class="decrement" on:click={subtract}>-</button>
<pre>{ count }</pre>
<button on:click={add}>+</button>
<button class="increment" on:click={add}>+</button>
</div>
<div class="message">
<div id={`${id}-message`} class="message">
<slot />
</div>

View file

@ -11,8 +11,20 @@ const someProps = {
<!-- Head Stuff -->
</head>
<body>
<Counter client:visible>
<h1>Hello, Svelte!</h1>
</Counter>
<Counter id="counter-idle" client:idle>
<h1>Hello, client:idle!</h1>
</Counter>
<Counter id="counter-load" client:load>
<h1>Hello, client:load!</h1>
</Counter>
<Counter id="counter-visible" client:visible>
<h1>Hello, client:visible!</h1>
</Counter>
<Counter id="counter-media" client:media="(max-width: 50rem)">
<h1>Hello, client:media!</h1>
</Counter>
</body>
</html>

View file

@ -88,12 +88,12 @@ test.only('Svelte', async ({ page, astro }) => {
// test 1: updating the page component
await astro.writeFile(
'src/pages/index.astro',
(original) => original.replace('id="counter-idle" {...someProps}', 'id="counter-idle" count={5}')
(original) => original.replace('Hello, client:idle!', 'Hello, updated client:idle!')
);
await afterHMR;
const count = page.locator('#counter-idle pre');
await expect(count).toHaveText('5');
const label = page.locator('#counter-idle-message');
await expect(label).toHaveText('Hello, updated client:idle!');
});
});