const values = [ { name: 'Alpha' }, { name: 'Beta' }, { name: 'Gamma' } ]; const selected_array = [ [values[1]], [], [values[2]] ]; export default { props: { values, selected_array }, html: `

Beta

Gamma

`, ssrHtml: `

Beta

Gamma

`, async test({ assert, component, target, window }) { const inputs = target.querySelectorAll('input'); assert.equal(inputs[0].checked, false); assert.equal(inputs[1].checked, true); assert.equal(inputs[2].checked, false); assert.equal(inputs[3].checked, false); assert.equal(inputs[4].checked, false); assert.equal(inputs[5].checked, false); assert.equal(inputs[6].checked, false); assert.equal(inputs[7].checked, false); assert.equal(inputs[8].checked, true); const event = new window.Event('change'); inputs[0].checked = true; await inputs[0].dispatchEvent(event); assert.htmlEqual(target.innerHTML, `

Alpha, Beta

Gamma

`); inputs[3].checked = true; await inputs[3].dispatchEvent(event); assert.htmlEqual(target.innerHTML, `

Alpha, Beta

Alpha

Gamma

`); inputs[8].checked = false; await inputs[8].dispatchEvent(event); assert.htmlEqual(target.innerHTML, `

Alpha, Beta

Alpha

`); component.selected_array = [[values[1], values[2]], [values[2]]]; assert.equal(inputs[0].checked, false); assert.equal(inputs[1].checked, true); assert.equal(inputs[2].checked, true); assert.equal(inputs[3].checked, false); assert.equal(inputs[4].checked, false); assert.equal(inputs[5].checked, true); assert.htmlEqual(target.innerHTML, `

Beta, Gamma

Gamma

`); } };