spectrum-web-components
spectrum-web-components copied to clipboard
Published
20 hours ago •
adobe
adobe
build: exclude all CSS vars from the theme styles
trafficstars
Test branch to see what happens when we remove Spectrum Vars from the themes.
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
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
Tachometer results
Chrome
action-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 483 kB | 67.46ms - 68.82ms | - | unsure 🔍 -0% - +4% -0.03ms - +2.60ms |
| branch | 374 kB | 65.73ms - 67.98ms | unsure 🔍 -4% - +0% -2.60ms - +0.03ms |
- |
action-menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 645 kB | 159.74ms - 162.80ms | - | unsure 🔍 -2% - +1% -2.49ms - +2.19ms |
| branch | 536 kB | 159.65ms - 163.19ms | unsure 🔍 -1% - +2% -2.19ms - +2.49ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 87.22ms - 88.22ms | - | slower ❌ 1% - 3% 1.28ms - 2.79ms |
| branch | 494 kB | 85.12ms - 86.25ms | faster ✔ 1% - 3% 1.28ms - 2.79ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 85.74ms - 87.12ms | - | slower ❌ 2% - 5% 2.07ms - 3.95ms |
| branch | 493 kB | 82.79ms - 84.06ms | faster ✔ 2% - 5% 2.07ms - 3.95ms |
- |
test-open-close-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 785 kB | 1871.95ms - 1874.44ms | - | unsure 🔍 +0% - +0% +0.53ms - +4.23ms |
| branch | 676 kB | 1869.45ms - 1872.18ms | unsure 🔍 -0% - -0% -4.23ms - -0.53ms |
- |
test-open-close permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 783 kB | 1867.15ms - 1870.23ms | - | unsure 🔍 +0% - +0% +2.47ms - +6.62ms |
| branch | 675 kB | 1862.75ms - 1865.54ms | unsure 🔍 -0% - -0% -6.62ms - -2.47ms |
- |
combobox permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 705 kB | 36.75ms - 37.22ms | - | slower ❌ 6% - 8% 2.22ms - 2.84ms |
| branch | 596 kB | 34.26ms - 34.66ms | faster ✔ 6% - 8% 2.22ms - 2.84ms |
- |
light-dom-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 705 kB | 389.64ms - 395.90ms | - | unsure 🔍 -0% - +2% -0.84ms - +7.93ms |
| branch | 596 kB | 386.15ms - 392.30ms | unsure 🔍 -2% - +0% -7.93ms - +0.84ms |
- |
menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 473 kB | 206.08ms - 209.49ms | - | slower ❌ 1% - 3% 1.43ms - 6.09ms |
| branch | 365 kB | 202.44ms - 205.60ms | faster ✔ 1% - 3% 1.43ms - 6.09ms |
- |
overlay permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 684 kB | 458.04ms - 461.43ms | - | slower ❌ 0% - 1% 2.02ms - 6.79ms |
| branch | 585 kB | 453.65ms - 457.01ms | faster ✔ 0% - 1% 2.02ms - 6.79ms |
- |
directive-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 777 kB | 34.76ms - 35.66ms | - | slower ❌ 5% - 9% 1.75ms - 2.81ms |
| branch | 658 kB | 32.66ms - 33.21ms | faster ✔ 5% - 8% 1.75ms - 2.81ms |
- |
element-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 756 kB | 341.15ms - 344.14ms | - | unsure 🔍 -1% - +1% -2.18ms - +4.02ms |
| branch | 648 kB | 339.01ms - 344.44ms | unsure 🔍 -1% - +1% -4.02ms - +2.18ms |
- |
lazy-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 557 kB | 52.62ms - 53.45ms | - | slower ❌ 2% - 5% 1.15ms - 2.40ms |
| branch | 449 kB | 50.80ms - 51.73ms | faster ✔ 2% - 5% 1.15ms - 2.40ms |
- |
picker permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 511 kB | 559.04ms - 566.76ms | - | unsure 🔍 -1% - +1% -4.75ms - +6.83ms |
| branch | 402 kB | 557.55ms - 566.18ms | unsure 🔍 -1% - +1% -6.83ms - +4.75ms |
- |
popover permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 382 kB | 21.27ms - 21.41ms | - | slower ❌ 11% - 12% 2.15ms - 2.33ms |
| branch | 273 kB | 19.04ms - 19.16ms | faster ✔ 10% - 11% 2.15ms - 2.33ms |
- |
slider permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 477 kB | 103.90ms - 105.69ms | - | slower ❌ 1% - 3% 0.96ms - 3.48ms |
| branch | 368 kB | 101.69ms - 103.46ms | faster ✔ 1% - 3% 0.96ms - 3.48ms |
- |
split-button permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 718 kB | 1866.25ms - 1868.86ms | - | unsure 🔍 +0% - +0% +0.02ms - +3.72ms |
| branch | 610 kB | 1864.37ms - 1866.99ms | unsure 🔍 -0% - -0% -3.72ms - -0.02ms |
- |
tooltip permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 548 kB | 43.66ms - 44.32ms | - | slower ❌ 4% - 7% 1.64ms - 2.74ms |
| branch | 439 kB | 41.36ms - 42.24ms | faster ✔ 4% - 6% 1.64ms - 2.74ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 645 kB | 34.48ms - 34.98ms | - | slower ❌ 6% - 8% 1.89ms - 2.60ms |
| branch | 534 kB | 32.24ms - 32.73ms | faster ✔ 5% - 7% 1.89ms - 2.60ms |
- |
test-element permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 650 kB | 62.08ms - 63.06ms | - | slower ❌ 2% - 4% 1.22ms - 2.69ms |
| branch | 542 kB | 60.07ms - 61.15ms | faster ✔ 2% - 4% 1.22ms - 2.69ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 628 kB | 52.50ms - 53.54ms | - | slower ❌ 4% - 7% 2.20ms - 3.57ms |
| branch | 519 kB | 49.69ms - 50.58ms | faster ✔ 4% - 7% 2.20ms - 3.57ms |
- |
truncated permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 523 kB | 56.61ms - 57.47ms | - | slower ❌ 3% - 5% 1.59ms - 2.91ms |
| branch | 414 kB | 54.29ms - 55.28ms | faster ✔ 3% - 5% 1.59ms - 2.91ms |
- |
Firefox
action-bar permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 483 kB | 137.17ms - 142.87ms | - | unsure 🔍 -1% - +5% -1.81ms - +7.29ms |
| branch | 374 kB | 133.73ms - 140.83ms | unsure 🔍 -5% - +1% -7.29ms - +1.81ms |
- |
action-menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 645 kB | 302.04ms - 305.16ms | - | faster ✔ 6% - 7% 18.39ms - 23.17ms |
| branch | 536 kB | 322.58ms - 326.18ms | slower ❌ 6% - 8% 18.39ms - 23.17ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 155.02ms - 156.94ms | - | slower ❌ 2% - 4% 3.39ms - 5.89ms |
| branch | 494 kB | 150.54ms - 152.14ms | faster ✔ 2% - 4% 3.39ms - 5.89ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 602 kB | 173.98ms - 177.38ms | - | slower ❌ 7% - 11% 11.22ms - 17.50ms |
| branch | 493 kB | 158.68ms - 163.96ms | faster ✔ 6% - 10% 11.22ms - 17.50ms |
- |
test-open-close-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 785 kB | 1470.69ms - 1477.83ms | - | slower ❌ 3% - 4% 42.81ms - 50.67ms |
| branch | 676 kB | 1425.87ms - 1429.17ms | faster ✔ 3% - 3% 42.81ms - 50.67ms |
- |
test-open-close permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 783 kB | 1461.97ms - 1464.99ms | - | slower ❌ 1% - 2% 17.05ms - 22.47ms |
| branch | 675 kB | 1441.47ms - 1445.97ms | faster ✔ 1% - 2% 17.05ms - 22.47ms |
- |
combobox permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 705 kB | 61.84ms - 66.76ms | - | slower ❌ 12% - 21% 6.67ms - 11.77ms |
| branch | 596 kB | 54.40ms - 55.76ms | faster ✔ 11% - 18% 6.67ms - 11.77ms |
- |
light-dom-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 705 kB | 707.71ms - 729.41ms | - | slower ❌ 4% - 8% 29.72ms - 53.64ms |
| branch | 596 kB | 671.86ms - 681.90ms | faster ✔ 4% - 7% 29.72ms - 53.64ms |
- |
menu permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 473 kB | 416.60ms - 428.52ms | - | slower ❌ 2% - 6% 7.48ms - 24.52ms |
| branch | 365 kB | 400.47ms - 412.65ms | faster ✔ 2% - 6% 7.48ms - 24.52ms |
- |
overlay permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 763 kB | 647.48ms - 653.92ms | - | slower ❌ 3% - 5% 20.51ms - 30.77ms |
| branch | 655 kB | 621.07ms - 629.05ms | faster ✔ 3% - 5% 20.51ms - 30.77ms |
- |
directive-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 767 kB | 65.77ms - 67.31ms | - | slower ❌ 3% - 6% 1.94ms - 3.82ms |
| branch | 658 kB | 63.11ms - 64.21ms | faster ✔ 3% - 6% 1.94ms - 3.82ms |
- |
element-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 756 kB | 612.63ms - 619.33ms | - | slower ❌ 6% - 7% 33.41ms - 42.23ms |
| branch | 648 kB | 575.29ms - 581.03ms | faster ✔ 5% - 7% 33.41ms - 42.23ms |
- |
lazy-test permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 557 kB | 112.11ms - 115.81ms | - | slower ❌ 11% - 16% 11.20ms - 15.80ms |
| branch | 449 kB | 99.09ms - 101.83ms | faster ✔ 10% - 14% 11.20ms - 15.80ms |
- |
picker permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 511 kB | 1008.22ms - 1033.10ms | - | unsure 🔍 -0% - +2% -3.09ms - +23.57ms |
| branch | 402 kB | 1005.64ms - 1015.20ms | unsure 🔍 -2% - +0% -23.57ms - +3.09ms |
- |
popover permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 382 kB | 42.65ms - 47.95ms | - | unsure 🔍 -1% - +16% -0.32ms - +6.60ms |
| branch | 273 kB | 39.94ms - 44.38ms | unsure 🔍 -14% - +0% -6.60ms - +0.32ms |
- |
slider permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 477 kB | 194.05ms - 201.03ms | - | unsure 🔍 -1% - +5% -1.69ms - +9.01ms |
| branch | 368 kB | 189.82ms - 197.94ms | unsure 🔍 -5% - +1% -9.01ms - +1.69ms |
- |
split-button permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 718 kB | 1428.36ms - 1431.76ms | - | slower ❌ 1% - 1% 7.74ms - 12.70ms |
| branch | 610 kB | 1418.03ms - 1421.65ms | faster ✔ 1% - 1% 7.74ms - 12.70ms |
- |
tooltip permalink
test-basic
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 650 kB | 95.79ms - 100.97ms | - | slower ❌ 10% - 18% 9.02ms - 15.30ms |
| branch | 542 kB | 84.44ms - 88.00ms | faster ✔ 9% - 15% 9.02ms - 15.30ms |
- |
test-directive permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 631 kB | 67.78ms - 69.70ms | - | faster ✔ 14% - 22% 11.49ms - 19.63ms |
| branch | 523 kB | 80.34ms - 88.26ms | slower ❌ 17% - 29% 11.49ms - 19.63ms |
- |
test-element permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 650 kB | 131.83ms - 138.05ms | - | unsure 🔍 -0% - +6% -0.12ms - +7.36ms |
| branch | 542 kB | 129.24ms - 133.40ms | unsure 🔍 -5% - +0% -7.36ms - +0.12ms |
- |
test-lazy permalink
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 628 kB | 108.93ms - 113.19ms | - | slower ❌ 0% - 6% 0.24ms - 6.32ms |
| branch | 519 kB | 105.61ms - 109.95ms | faster ✔ 0% - 6% 0.24ms - 6.32ms |
- |
truncated permalink
basic-test
| Version | Bytes | Avg Time | vs remote | vs branch |
|---|---|---|---|---|
| npm latest | 523 kB | 100.24ms - 106.36ms | - | unsure 🔍 -2% - +7% -1.65ms - +7.13ms |
| branch | 414 kB | 97.41ms - 103.71ms | unsure 🔍 -7% - +2% -7.13ms - +1.65ms |
- |
Lighthouse scores
| Category | Latest (report) | Main (report) | Branch (report) |
|---|---|---|---|
| Performance | 0.97 | 0.98 | 0.97 |
| 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 | 229.203 kB | 217.437 kB 🏆 | 217.481 kB |
| Scripts | 60.903 kB | 54.703 kB 🏆 | 54.754 kB |
| Stylesheet | 35.689 kB | 30.808 kB 🏆 | 30.84 kB |
| Document | 5.899 kB | 5.214 kB | 5.175 kB 🏆 |
| Third Party | 126.712 kB | 126.712 kB | 126.712 kB |
Request Count
| Category | Latest | Main | Branch |
|---|---|---|---|
| Total | 43 | 43 | 43 |
| Scripts | 35 | 35 | 35 |
| Stylesheet | 5 | 5 | 5 |
| Document | 1 | 1 | 1 |
| Third Party | 2 | 2 | 2 |