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); node.setAttributeNS('http://www.w3.org/1999/xlink', attribute, value);
} }
// To force uncheck repeated group, need to store old value // To force uncheck repeated group, need to store old value for each group
let oldValue: Set<unknown> = new Set(); let groups = new Map();
export function get_binding_group_value(group) { export function get_binding_group_value(group) {
const value = new Set(); const value = new Set();
@ -133,14 +133,14 @@ export function get_binding_group_value(group) {
for (let i = 0; i < group.length; i += 1) { for (let i = 0; i < group.length; i += 1) {
if (group[i].checked) { if (group[i].checked) {
value.add(group[i].__value); 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); force.push(group[i].__value);
} }
} }
for (let i = 0; i < force.length; i += 1) { for (let i = 0; i < force.length; i += 1) {
value.delete(force[i]); value.delete(force[i]);
} }
oldValue = value; groups.set(group, value);
return Array.from(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 = [ const values = [
{ name: 'Alpha' }, { name: 'Alpha' },
{ name: 'Beta' }, { name: 'Beta' }
{ name: 'Gamma' }
]; ];
export default { export default {

Loading…
Cancel
Save