Remove extra menu separators #11827
Remove extra menu separators #11827
Conversation
lib/browser/api/menu.js
Outdated
|
|
||
| return visibleItems.filter((el, idx, array) => { | ||
| const meetsDeleteConditions = !visiblePrev || idx === array.length - 1 || array[idx + 1].type === 'separator' | ||
| const toDelete = el.type === 'separator' && meetsDeleteConditions |
There was a problem hiding this comment.
This is a little hard to scan. I think that a reduce would work wonders here.
There was a problem hiding this comment.
I agree with felix this is a little hard to scan. I think the reasons are:
meetsDeleteConditionsandtoDeleteare confusingly named, e.g. how can you meet delete conditions if type isn'tseparator?visibleItemsrequires a little thought before you can tell how the loop will behave in edge cases
I'm not thinking functionally enough to see how a reduce would work cleanly here and would love enlightenment on this, no snark intended 😄
After poking around with a few approaches, the clearest I came up with was (untested):
function removeExtraSeparators(items) {
// remove invisible items
items = items.filter(e => e.visible !== false)
// fold adjacent separators together
items = items.filter((e, idx, arr) => e.type !== 'separator' || idx==0 || arr[idx-1].type!=='separator')
// remove edge separators
return items.filter((e, idx, arr) => e.type !== 'separator' || (idx!=0 && idx!=arr.length-1))
}Marking as Request Changes for cleanup to this section, but the above code is just a suggestion, not a requirement
lib/browser/api/menu.js
Outdated
|
|
||
| return visibleItems.filter((el, idx, array) => { | ||
| const meetsDeleteConditions = !visiblePrev || idx === array.length - 1 || array[idx + 1].type === 'separator' | ||
| const toDelete = el.type === 'separator' && meetsDeleteConditions |
There was a problem hiding this comment.
I agree with felix this is a little hard to scan. I think the reasons are:
meetsDeleteConditionsandtoDeleteare confusingly named, e.g. how can you meet delete conditions if type isn'tseparator?visibleItemsrequires a little thought before you can tell how the loop will behave in edge cases
I'm not thinking functionally enough to see how a reduce would work cleanly here and would love enlightenment on this, no snark intended 😄
After poking around with a few approaches, the clearest I came up with was (untested):
function removeExtraSeparators(items) {
// remove invisible items
items = items.filter(e => e.visible !== false)
// fold adjacent separators together
items = items.filter((e, idx, arr) => e.type !== 'separator' || idx==0 || arr[idx-1].type!=='separator')
// remove edge separators
return items.filter((e, idx, arr) => e.type !== 'separator' || (idx!=0 && idx!=arr.length-1))
}Marking as Request Changes for cleanup to this section, but the above code is just a suggestion, not a requirement
spec/api-menu-spec.js
Outdated
| assert.equal(menu.items.length, 3) | ||
| assert.equal(menu.items[0].label, 'a') | ||
| assert.equal(menu.items[1].label, 'b') | ||
| assert.equal(menu.items[2].label, 'c') |
There was a problem hiding this comment.
Another good edge case to test for would be [ sep, sep, a, b, c, sep, sep ] -> [ a, b, c ]
* add function to remove leading/trailing separators * change const name for clarity * add spec to check filtered separators * clean method and add edge case spec per review
Removes leading and trailing menu separators and resolves #5869.
Tested manually on MacOS, Windows, and Linux
To-Do: