fix: adjust test output

pull/16017/head
paoloricciuti 4 months ago
parent 6af745e781
commit f1269353b3

@ -1,9 +1,9 @@
import { test } from '../../test';
export default test({
html: `
ssrHtml: `
<select>
<option value="[object Object]">wheeee</option>
<option selected="" value="[object Object]">wheeee</option>
</select>
`
});

@ -17,9 +17,9 @@ export default test({
return { tasks, selected: tasks[0] };
},
html: `
ssrHtml: `
<select>
<option value='[object Object]'>put your left leg in</option>
<option selected="" value='[object Object]'>put your left leg in</option>
<option value='[object Object]'>your left leg out</option>
<option value='[object Object]'>in, out, in, out</option>
<option value='[object Object]'>shake it all about</option>
@ -36,7 +36,28 @@ export default test({
<p>shake it all about</p>
`,
async test({ assert, component, target, window }) {
async test({ assert, component, target, window, variant }) {
assert.htmlEqual(
target.innerHTML,
`
<select>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value='[object Object]'>put your left leg in</option>
<option value='[object Object]'>your left leg out</option>
<option value='[object Object]'>in, out, in, out</option>
<option value='[object Object]'>shake it all about</option>
</select>
<label>
<input type='checkbox'> put your left leg in
</label>
<h2>Pending tasks</h2>
<p>put your left leg in</p>
<p>your left leg out</p>
<p>in, out, in, out</p>
<p>shake it all about</p>
`
);
const input = target.querySelector('input');
const select = target.querySelector('select');
const options = target.querySelectorAll('option');
@ -57,7 +78,7 @@ export default test({
target.innerHTML,
`
<select>
<option value='[object Object]'>put your left leg in</option>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value='[object Object]'>put your left leg in</option>
<option value='[object Object]'>your left leg out</option>
<option value='[object Object]'>in, out, in, out</option>
<option value='[object Object]'>shake it all about</option>
@ -94,7 +115,7 @@ export default test({
target.innerHTML,
`
<select>
<option value='[object Object]'>put your left leg in</option>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value='[object Object]'>put your left leg in</option>
<option value='[object Object]'>your left leg out</option>
<option value='[object Object]'>in, out, in, out</option>
<option value='[object Object]'>shake it all about</option>

@ -6,17 +6,29 @@ export default test({
return { values: [1, 2, 3], foo: 2 };
},
html: `
ssrHtml: `
<select>
<option value="1">1</option>
<option value="2">2</option>
<option selected="" value="2">2</option>
<option value="3">3</option>
</select>
<p>foo: 2</p>
`,
test({ assert, component, target, window }) {
test({ assert, component, target, window, variant }) {
assert.htmlEqual(
target.innerHTML,
`
<select>
<option value="1">1</option>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value="2">2</option>
<option value="3">3</option>
</select>
<p>foo: 2</p>
`
);
const select = target.querySelector('select');
ok(select);
const options = [...target.querySelectorAll('option')];
@ -36,7 +48,7 @@ export default test({
`
<select>
<option value="1">1</option>
<option value="2">2</option>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value="2">2</option>
<option value="3">3</option>
</select>

@ -1,15 +1,15 @@
import { test } from '../../test';
export default test({
html: `
ssrHtml: `
<select>
<option value='hullo'>Hullo</option>
<option selected="" value='hullo'>Hullo</option>
<option value='world'>World</option>
</select>
<select>
<option value='hullo'>Hullo</option>
<option value='world'>World</option>
<option selected="" value='world'>World</option>
</select>
`,
@ -19,7 +19,21 @@ export default test({
};
},
test({ assert, component, target, window }) {
test({ assert, component, target, window, variant }) {
assert.htmlEqual(
target.innerHTML,
`
<select>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value='hullo'>Hullo</option>
<option value='world'>World</option>
</select>
<select>
<option value='hullo'>Hullo</option>
<option ${variant === 'hydrate' ? 'selected="" ' : ''}value='world'>World</option>
</select>
`
);
const selects = [...target.querySelectorAll('select')];
const change = new window.Event('change');

@ -2,27 +2,28 @@ import { flushSync } from 'svelte';
import { ok, test } from '../../test';
export default test({
html: `
<select>
<option selected="" value="a">A</option>
<option value="b">B</option>
</select>
selected: a
`,
test({ assert, target }) {
test({ assert, target, variant }) {
assert.htmlEqual(
target.innerHTML,
`
<select>
<option${variant === 'hydrate' ? ' selected=""' : ''} value="a">A</option$>
<option value="b">B</option>
</select>
selected: a
`
);
const select = target.querySelector('select');
ok(select);
const event = new window.Event('change');
select.value = 'b';
select.dispatchEvent(event);
flushSync();
assert.htmlEqual(
target.innerHTML,
`
<select>
<option value="a">A</option>
<option${variant === 'hydrate' ? ' selected=""' : ''} value="a">A</option$>
<option value="b">B</option>
</select>
selected: b

@ -3,8 +3,14 @@
let checkbox = $state(true);
let radio_group = $state('a');
let checkbox_group = $state(['a']);
let select = $state('b');
// this will be ssrd
let select = $state('a');
let textarea = $state('textarea');
$effect(()=>{
// changing the value of `select` on mount
select = 'b';
})
</script>
<p>{JSON.stringify({ text, checkbox, radio_group, checkbox_group, select, textarea })}</p>

Loading…
Cancel
Save