You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
svelte/test/runtime/samples/binding-indirect/_config.js

90 lines
2.3 KiB

const tasks = [
{ description: 'put your left leg in', done: false },
{ description: 'your left leg out', done: false },
{ description: 'in, out, in, out', done: false },
{ description: 'shake it all about', done: false }
];
export default {
skip_if_ssr: true,
props: {
tasks,
selected: tasks[0]
},
html: `
<select>
<option 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>
`,
async test({ assert, component, target, window }) {
const input = target.querySelector('input');
const select = target.querySelector('select');
const options = target.querySelectorAll('option');
const change = new window.Event('change');
input.checked = true;
await input.dispatchEvent(change);
assert.ok(component.tasks[0].done);
assert.htmlEqual(target.innerHTML, `
<select>
<option 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>your left leg out</p>
<p>in, out, in, out</p>
<p>shake it all about</p>
`);
options[1].selected = true;
await select.dispatchEvent(change);
assert.equal(component.selected, tasks[1]);
assert.ok(!input.checked);
input.checked = true;
await input.dispatchEvent(change);
assert.ok(component.tasks[1].done);
assert.htmlEqual(target.innerHTML, `
<select>
<option 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'> your left leg out
</label>
<h2>Pending tasks</h2>
<p>in, out, in, out</p>
<p>shake it all about</p>
`);
}
};