spectrum-web-components
spectrum-web-components copied to clipboard
fix(action-menu): allow menu groups to handle their own selections
trafficstars
Description
- Ensure that Picker with
selects="multiple"selection groups can appropriately announce changed when the last item in a multiple group is being toggled off. - Ensure that Menu Items in a Menu Group are appropriately attributed to the root Menu that they are in.
Related issue(s)
- fixes #4380
- fixes #4381
How has this been tested?
- [ ] Test case 1
- Go here
- See that the Items in the Menu Groups are associated with the Action Menu appropriately, meaning you can use arrow keys to move through them.
- These work because the Menu is open by default and the eventing that associated them happen after everything is initialized
- [ ] Test case 2
- Go here
- See that the Items in the Menu Groups are associated with the Action Menu appropriately, meaning you can use arrow keys to move through them.
- This now works because we appropriately trigger updates on child Menu Items when their parent Menu Groups are slotted into the Action Menu
- [ ] Test case 2
- Go here
- Open the Action Menu
- Toggle the "Reverse Order" Menu Item to selected
- Open the Action Menu
- Toggle the "Reverse Order" Menu Item to deselected
- See that the selection changes and that errors are not thrown
Types of changes
- [x] Bug fix (non-breaking change which fixes an issue)
Checklist
- [x] I have signed the Adobe Open Source CLA.
- [x] My code follows the code style of this project.
- [ ] If my change required a change to the documentation, I have updated the documentation in this pull request.
- [x] I have read the CONTRIBUTING document.
- [x] I have added tests to cover my changes.
- [x] All new and existing tests passed.
Branch preview
Visual regression test results
When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:
- High Contrast Mode | Medium | LTR
- Classic | Lightest | Medium | LTR
- Classic | Lightest | Medium | RTL
- Classic | Lightest | Large | LTR
- Classic | Lightest | Large | RTL
- Classic | Light | Medium | LTR
- Classic | Light | Medium | RTL
- Classic | Light | Large | LTR
- Classic | Light | Large | RTL
- Classic | Dark | Medium | LTR
- Classic | Dark | Medium | RTL
- Classic | Dark | Large | LTR
- Classic | Dark | Large | RTL
- Classic | Darkest | Medium | LTR
- Classic | Darkest | Medium | RTL
- Classic | Darkest | Large | LTR
- Classic | Darkest | Large | RTL
- Express | Lightest | Medium | LTR
- Express | Lightest | Medium | RTL
- Express | Lightest | Large | LTR
- Express | Lightest | Large | RTL
- Express | Light | Medium | LTR
- Express | Light | Medium | RTL
- Express | Light | Large | LTR
- Express | Light | Large | RTL
- Express | Dark | Medium | LTR
- Express | Dark | Medium | RTL
- Express | Dark | Large | LTR
- Express | Dark | Large | RTL
- Express | Darkest | Medium | LTR
- Express | Darkest | Medium | RTL
- Express | Darkest | Large | LTR
- Express | Darkest | Large | RTL
Lighthouse scores
| Category | Latest (report) | Main (report) | Branch (report) |
|---|---|---|---|
| Performance | 0.99 | 0.99 | 0.99 |
| Accessibility | 1 | 1 | 1 |
| Best Practices | 1 | 1 | 1 |
| SEO | 1 | 0.92 | 0.92 |
| PWA | 1 | 1 | 1 |
What is this?
Lighthouse scores comparing the documentation site built from the PR ("Branch") to that of the production documentation site ("Latest") and the build currently on main ("Main"). Higher scores are better, but note that the SEO scores on Netlify URLs are artifically constrained to 0.92.
Transfer Size
| Category | Latest | Main | Branch |
|---|---|---|---|
| Total | 224.408 kB | 210.257 kB | 210.231 kB 🏆 |
| Scripts | 53.64 kB | 48.113 kB 🏆 | 48.137 kB |
| Stylesheet | 34.879 kB | 30.328 kB | 30.306 kB 🏆 |
| Document | 5.917 kB | 5.20 kB | 5.191 kB 🏆 |
| Font | 126.988 kB | 126.616 kB | 126.597 kB 🏆 |
Request Count
| Category | Latest | Main | Branch |
|---|---|---|---|
| Total | 48 | 45 | 45 |
| Scripts | 37 | 37 | 37 |
| Stylesheet | 5 | 5 | 5 |
| Document | 1 | 1 | 1 |
| Font | 2 | 2 | 2 |
Tachometer results
Chrome
action-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 484 kB | 48.36ms - 50.08ms | - | faster ✔ 3% - 8% 1.58ms - 4.32ms |
| branch | 472 kB | 51.10ms - 53.23ms | slower ❌ 3% - 9% 1.58ms - 4.32ms |
- |
action-menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 646 kB | 131.06ms - 134.59ms | - | faster ✔ 5% - 8% 6.33ms - 11.41ms |
| branch | 634 kB | 139.86ms - 143.52ms | slower ❌ 5% - 9% 6.33ms - 11.41ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 603 kB | 60.21ms - 61.41ms | - | faster ✔ 6% - 9% 3.73ms - 5.79ms |
| branch | 592 kB | 64.73ms - 66.41ms | slower ❌ 6% - 10% 3.73ms - 5.79ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 59.11ms - 60.61ms | - | faster ✔ 5% - 8% 2.94ms - 5.47ms |
| branch | 591 kB | 63.05ms - 65.08ms | slower ❌ 5% - 9% 2.94ms - 5.47ms |
- |
test-open-close-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 788 kB | 1873.13ms - 1876.06ms | - | unsure 🔍 -0% - +0% -2.17ms - +2.34ms |
| branch | 777 kB | 1872.80ms - 1876.22ms | unsure 🔍 -0% - +0% -2.34ms - +2.17ms |
- |
test-open-close permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 787 kB | 1858.38ms - 1862.31ms | - | unsure 🔍 -0% - +0% -2.10ms - +2.77ms |
| branch | 775 kB | 1858.58ms - 1861.45ms | unsure 🔍 -0% - +0% -2.77ms - +2.10ms |
- |
combobox permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 709 kB | 35.96ms - 36.54ms | - | faster ✔ 2% - 4% 0.72ms - 1.58ms |
| branch | 697 kB | 37.08ms - 37.72ms | slower ❌ 2% - 4% 0.72ms - 1.58ms |
- |
light-dom-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 709 kB | 382.77ms - 391.97ms | - | faster ✔ 3% - 6% 13.07ms - 25.23ms |
| branch | 697 kB | 402.55ms - 410.50ms | slower ❌ 3% - 7% 13.07ms - 25.23ms |
- |
menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 476 kB | 211.08ms - 215.48ms | - | faster ✔ 1% - 4% 2.28ms - 9.28ms |
| branch | 463 kB | 216.33ms - 221.78ms | slower ❌ 1% - 4% 2.28ms - 9.28ms |
- |
overlay permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 681 kB | 423.91ms - 431.09ms | - | unsure 🔍 -1% - +1% -5.51ms - +2.62ms |
| branch | 670 kB | 427.03ms - 430.86ms | unsure 🔍 -1% - +1% -2.62ms - +5.51ms |
- |
directive-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 783 kB | 21.65ms - 22.07ms | - | faster ✔ 9% - 12% 2.08ms - 2.82ms |
| branch | 772 kB | 24.00ms - 24.61ms | slower ❌ 9% - 13% 2.08ms - 2.82ms |
- |
element-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 761 kB | 346.29ms - 349.54ms | - | faster ✔ 1% - 3% 5.17ms - 10.46ms |
| branch | 750 kB | 353.65ms - 357.82ms | slower ❌ 1% - 3% 5.17ms - 10.46ms |
- |
lazy-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 561 kB | 40.33ms - 41.25ms | - | faster ✔ 5% - 8% 2.04ms - 3.57ms |
| branch | 549 kB | 42.98ms - 44.21ms | slower ❌ 5% - 9% 2.04ms - 3.57ms |
- |
picker permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 513 kB | 513.03ms - 523.28ms | - | faster ✔ 1% - 4% 7.76ms - 22.04ms |
| branch | 501 kB | 528.08ms - 538.03ms | slower ❌ 1% - 4% 7.76ms - 22.04ms |
- |
popover permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 383 kB | 11.35ms - 11.48ms | - | faster ✔ 2% - 4% 0.25ms - 0.45ms |
| branch | 372 kB | 11.70ms - 11.84ms | slower ❌ 2% - 4% 0.25ms - 0.45ms |
- |
split-button permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 722 kB | 1858.52ms - 1862.53ms | - | unsure 🔍 -0% - +0% -1.87ms - +3.63ms |
| branch | 711 kB | 1857.76ms - 1861.52ms | unsure 🔍 -0% - +0% -3.63ms - +1.87ms |
- |
tooltip permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 552 kB | 33.15ms - 34.14ms | - | faster ✔ 2% - 5% 0.53ms - 1.72ms |
| branch | 542 kB | 34.44ms - 35.10ms | slower ❌ 2% - 5% 0.53ms - 1.72ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 533 kB | 22.91ms - 23.51ms | - | faster ✔ 6% - 10% 1.57ms - 2.50ms |
| branch | 535 kB | 24.89ms - 25.60ms | slower ❌ 7% - 11% 1.57ms - 2.50ms |
- |
test-element permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 654 kB | 50.83ms - 51.96ms | - | faster ✔ 5% - 8% 2.99ms - 4.68ms |
| branch | 643 kB | 54.60ms - 55.87ms | slower ❌ 6% - 9% 2.99ms - 4.68ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 631 kB | 41.58ms - 42.52ms | - | faster ✔ 5% - 9% 2.41ms - 3.87ms |
| branch | 619 kB | 44.62ms - 45.75ms | slower ❌ 6% - 9% 2.41ms - 3.87ms |
- |
truncated permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 527 kB | 54.20ms - 54.92ms | - | faster ✔ 4% - 6% 2.35ms - 3.68ms |
| branch | 516 kB | 57.02ms - 58.13ms | slower ❌ 4% - 7% 2.35ms - 3.68ms |
- |
Firefox
action-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 484 kB | 112.75ms - 118.93ms | - | unsure 🔍 -6% - +1% -7.53ms - +1.29ms |
| branch | 472 kB | 115.81ms - 122.11ms | unsure 🔍 -1% - +7% -1.29ms - +7.53ms |
- |
action-menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 646 kB | 272.84ms - 275.56ms | - | faster ✔ 13% - 14% 39.40ms - 44.40ms |
| branch | 634 kB | 314.00ms - 318.20ms | slower ❌ 14% - 16% 39.40ms - 44.40ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 603 kB | 128.73ms - 132.71ms | - | unsure 🔍 -2% - +1% -3.17ms - +1.01ms |
| branch | 592 kB | 131.16ms - 132.44ms | unsure 🔍 -1% - +2% -1.01ms - +3.17ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 153.51ms - 158.13ms | - | slower ❌ 9% - 14% 13.26ms - 19.30ms |
| branch | 591 kB | 137.59ms - 141.49ms | faster ✔ 9% - 12% 13.26ms - 19.30ms |
- |
test-open-close-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 788 kB | 1918.71ms - 1925.29ms | - | slower ❌ 2% - 2% 32.50ms - 40.26ms |
| branch | 777 kB | 1883.55ms - 1887.69ms | faster ✔ 2% - 2% 32.50ms - 40.26ms |
- |
test-open-close permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 787 kB | 1881.60ms - 1886.72ms | - | unsure 🔍 -0% - +0% -6.71ms - +0.83ms |
| branch | 775 kB | 1884.33ms - 1889.87ms | unsure 🔍 -0% - +0% -0.83ms - +6.71ms |
- |
combobox permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 709 kB | 64.65ms - 71.31ms | - | slower ❌ 4% - 16% 2.79ms - 9.85ms |
| branch | 697 kB | 60.48ms - 62.84ms | faster ✔ 5% - 14% 2.79ms - 9.85ms |
- |
light-dom-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 709 kB | 720.55ms - 731.45ms | - | slower ❌ 1% - 4% 9.85ms - 28.47ms |
| branch | 697 kB | 699.29ms - 714.39ms | faster ✔ 1% - 4% 9.85ms - 28.47ms |
- |
menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 476 kB | 424.25ms - 437.71ms | - | faster ✔ 0% - 4% 0.27ms - 18.37ms |
| branch | 463 kB | 434.26ms - 446.34ms | slower ❌ 0% - 4% 0.27ms - 18.37ms |
- |
overlay permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 768 kB | 619.63ms - 629.21ms | - | slower ❌ 1% - 4% 6.75ms - 22.29ms |
| branch | 757 kB | 603.79ms - 616.01ms | faster ✔ 1% - 4% 6.75ms - 22.29ms |
- |
directive-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 771 kB | 45.82ms - 46.78ms | - | faster ✔ 4% - 8% 1.87ms - 3.77ms |
| branch | 761 kB | 48.30ms - 49.94ms | slower ❌ 4% - 8% 1.87ms - 3.77ms |
- |
element-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 761 kB | 641.21ms - 647.87ms | - | slower ❌ 3% - 4% 19.17ms - 27.39ms |
| branch | 750 kB | 618.85ms - 623.67ms | faster ✔ 3% - 4% 19.17ms - 27.39ms |
- |
lazy-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 561 kB | 96.11ms - 104.17ms | - | slower ❌ 4% - 13% 3.38ms - 11.58ms |
| branch | 549 kB | 91.90ms - 93.42ms | faster ✔ 4% - 11% 3.38ms - 11.58ms |
- |
picker permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 513 kB | 984.06ms - 1014.70ms | - | faster ✔ 3% - 6% 32.22ms - 64.14ms |
| branch | 501 kB | 1043.07ms - 1052.05ms | slower ❌ 3% - 6% 32.22ms - 64.14ms |
- |
popover permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 383 kB | 28.44ms - 32.32ms | - | unsure 🔍 -10% - +10% -2.93ms - +2.89ms |
| branch | 372 kB | 28.23ms - 32.57ms | unsure 🔍 -10% - +10% -2.89ms - +2.93ms |
- |
split-button permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 722 kB | 1876.91ms - 1881.69ms | - | unsure 🔍 -0% - +0% -3.78ms - +3.50ms |
| branch | 711 kB | 1876.69ms - 1882.19ms | unsure 🔍 -0% - +0% -3.50ms - +3.78ms |
- |
tooltip permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 654 kB | 79.75ms - 83.41ms | - | slower ❌ 10% - 16% 7.60ms - 11.56ms |
| branch | 643 kB | 71.24ms - 72.76ms | faster ✔ 10% - 14% 7.60ms - 11.56ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 533 kB | 46.10ms - 47.42ms | - | faster ✔ 26% - 32% 16.45ms - 21.59ms |
| branch | 521 kB | 63.30ms - 68.26ms | slower ❌ 35% - 46% 16.45ms - 21.59ms |
- |
test-element permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 654 kB | 108.38ms - 114.86ms | - | faster ✔ 5% - 12% 6.59ms - 14.49ms |
| branch | 643 kB | 119.89ms - 124.43ms | slower ❌ 6% - 13% 6.59ms - 14.49ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 631 kB | 92.48ms - 97.36ms | - | faster ✔ 2% - 8% 2.29ms - 8.35ms |
| branch | 619 kB | 98.45ms - 102.03ms | slower ❌ 2% - 9% 2.29ms - 8.35ms |
- |
truncated permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 527 kB | 100.78ms - 107.78ms | - | unsure 🔍 -6% - +2% -6.88ms - +2.60ms |
| branch | 516 kB | 103.23ms - 109.61ms | unsure 🔍 -3% - +7% -2.60ms - +6.88ms |
- |