Fix: different group with identical values

pull/4774/head
Th0rN13 5 years ago
parent 00b97b91b2
commit 8f5c1b81eb

@ -124,8 +124,8 @@ export function xlink_attr(node, attribute, value) {
node.setAttributeNS('http://www.w3.org/1999/xlink', attribute, value);
}
// To force uncheck repeated group, need to store old value
let oldValue: Set<unknown> = new Set();
// To force uncheck repeated group, need to store old value for each group
let groups = new Map();
export function get_binding_group_value(group) {
const value = new Set();
@ -133,14 +133,14 @@ export function get_binding_group_value(group) {
for (let i = 0; i < group.length; i += 1) {
if (group[i].checked) {
value.add(group[i].__value);
} else if (oldValue.has(group[i].__value)) {
} else if (groups.get(group) && groups.get(group).has(group[i].__value)) {
force.push(group[i].__value);
}
}
for (let i = 0; i < force.length; i += 1) {
value.delete(force[i]);
}
oldValue = value;
groups.set(group, value);
return Array.from(value);
}

@ -0,0 +1,91 @@
const values = [
"a",
"b",
];
export default {
props: {
values,
selected: [],
selected2: []
},
async test({ assert, target, window }) {
const inputs = target.querySelectorAll('input');
assert.equal(inputs[0].checked, false);
assert.equal(inputs[1].checked, false);
assert.equal(inputs[2].checked, false);
assert.equal(inputs[3].checked, false);
assert.equal(inputs[4].checked, false);
assert.equal(inputs[5].checked, false);
const event = new window.Event('change');
inputs[5].checked = true;
await inputs[5].dispatchEvent(event);
assert.htmlEqual(target.innerHTML, `
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<p></p>
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<p>b</p>
`);
inputs[3].checked = true;
await inputs[3].dispatchEvent(event);
assert.htmlEqual(target.innerHTML, `
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<p>b</p>
<label>
<input type="checkbox" value="a"> a
</label>
<label>
<input type="checkbox" value="b"> b
</label>
<p>b</p>
`);
}
};

@ -0,0 +1,33 @@
<script>
export let selected;
export let selected2;
export let values;
</script>
<label>
<input type="checkbox" value="{values[0]}" bind:group={selected} /> {values[0]}
</label>
<label>
<input type="checkbox" value="{values[1]}" bind:group={selected} /> {values[1]}
</label>
<label>
<input type="checkbox" value="{values[0]}" bind:group={selected} /> {values[0]}
</label>
<label>
<input type="checkbox" value="{values[1]}" bind:group={selected} /> {values[1]}
</label>
<p>{selected.join(', ')}</p>
<label>
<input type="checkbox" value="{values[0]}" bind:group={selected2} /> {values[0]}
</label>
<label>
<input type="checkbox" value="{values[1]}" bind:group={selected2} /> {values[1]}
</label>
<p>{selected2.join( ', ' ) }</p>

@ -1,7 +1,6 @@
const values = [
{ name: 'Alpha' },
{ name: 'Beta' },
{ name: 'Gamma' }
{ name: 'Beta' }
];
export default {

Loading…
Cancel
Save