Skip to content

Commit

Permalink
Fix: Feature usage chart pagination (#1013)
Browse files Browse the repository at this point in the history
**Background:**

When backfilling usage data, the feature usage chart displayed only a few data points, not the complete set.  Network inspection revealed that multiple pages of data were successfully retrieved.

**Repro:**

1. Navigate to: https://website-webstatus-dev.corp.goog/features/flexbox?showUsageChart

**Solution:**

This change aligns the feature usage chart pagination with the feature support chart's implementation: https://github.com/GoogleChrome/webstatus.dev/blob/b84a9ac02c2455dd6e5043615fc2a084f6980a46/frontend/src/static/js/components/webstatus-feature-page.ts#L621-L650

**Testing:**

Comprehensive unit tests will be included with the refactor outlined in #964.

To validate the pagination logic, this commit increases the number of data points displayed to over 100, enabling testing through Playwright. To optimize Playwright test performance, the initial data load specifically filters for the feature used in the feature page test, mitigating delays associated with loading excessive fake data.
  • Loading branch information
jcscottiii authored Dec 30, 2024
1 parent 489104c commit 27becb2
Show file tree
Hide file tree
Showing 11 changed files with 59 additions and 50 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
"Feature name","Baseline status","Browser Implementation in Chrome","Chrome WPT Stable Score","Browser Implementation in Edge","Edge WPT Stable Score","Browser Implementation in Firefox","Firefox WPT Stable Score","Browser Implementation in Safari","Safari WPT Stable Score","Chrome WPT Experimental Score","Edge WPT Experimental Score","Firefox WPT Experimental Score","Safari WPT Experimental Score","Chromium Usage"
"Molestiae77","widely","2020-01-05","0.789380531","2020-08-05","0.091575092","","0.346210996","2021-03-11","0.13125","0.201954397","0.461035422","0.475669765","0.26796875",""
"Voluptas76","newly","2028-03-08","0.56455863","2023-04-17","0.083003953","2021-08-23","0.601455133","2022-07-22","0.506426735","0.483660131","0.579561043","0.82382134","0.355291577","0"
"Ratione74","newly","2021-11-21","0.351908397","2020-04-19","0.490307868","2024-06-10","0.9932341","2020-04-27","0.019011407","0.849101796","0.61627907","0.563758389","0.229522184","0"
"Et73","widely","2021-07-19","0.560755337","","0.457977208","2027-09-21","0.3856","2022-10-31","0.484793187","0.369863014","0.637261821","0.113445378","0.434579439","0.5631"
"Delectus72","newly","2025-03-28","0.321484992","2020-04-19","0.536679537","2027-05-24","0.263502455","","0.275862069","0.465132024","0.348159509","0.394618834","0.320524836","0.2631"
"Tenetur70","widely","2021-07-19","0.39433294","2023-08-26","0.500328299","","0.333333333","2020-04-27","0.450089659","0.256852792","0.496212121","0.539223782","0.675023213","0.5133"
"Molestiae77","widely","2020-01-05","0.789380531","2020-08-05","0.091575092","","0.346210996","2021-03-11","0.13125","0.201954397","0.461035422","0.475669765","0.26796875","0"
"Voluptas76","newly","2028-03-08","0.56455863","2023-04-17","0.083003953","2021-08-23","0.601455133","2022-07-22","0.506426735","0.483660131","0.579561043","0.82382134","0.355291577","0.8907"
"Ratione74","newly","2021-11-21","0.351908397","2020-04-19","0.490307868","2024-06-10","0.9932341","2020-04-27","0.019011407","0.849101796","0.61627907","0.563758389","0.229522184",""
"Et73","widely","2021-07-19","0.560755337","","0.457977208","2027-09-21","0.3856","2022-10-31","0.484793187","0.369863014","0.637261821","0.113445378","0.434579439","0.00001"
"Delectus72","newly","2025-03-28","0.321484992","2020-04-19","0.536679537","2027-05-24","0.263502455","","0.275862069","0.465132024","0.348159509","0.394618834","0.320524836",""
"Tenetur70","widely","2021-07-19","0.39433294","2023-08-26","0.500328299","","0.333333333","2020-04-27","0.450089659","0.256852792","0.496212121","0.539223782","0.675023213","0.941"
"Natus68","widely","2027-06-28","0.587628866","2023-08-26","0.269372694","2027-05-24","0.246456693","","0.644727001","0.673822715","0.578598485","0.173913043","0.559467919","0.00001"
"Vel67","widely","2029-02-23","0.025787966","2025-01-24","0.33396765","","0.891818182","","0.26023166","0.072131148","0.125","0.534105534","0.407211029","0"
"Et66","newly","2021-07-19","0.926605505","2023-08-26","0.797881011","2021-08-23","0.09893617","2022-02-12","0.45024022","0.964788732","0.832495812","0.774011299","0.575060533",""
"Odit64","widely","2021-01-03","0.519968677","2020-08-05","0.604243542","2020-01-11","0.642319277","2020-04-27","0.2","0.51393534","0.757352941","0.336976321","0.484799131","0.0695"
"Vel67","widely","2029-02-23","0.025787966","2025-01-24","0.33396765","","0.891818182","","0.26023166","0.072131148","0.125","0.534105534","0.407211029","0.8819"
"Et66","newly","2021-07-19","0.926605505","2023-08-26","0.797881011","2021-08-23","0.09893617","2022-02-12","0.45024022","0.964788732","0.832495812","0.774011299","0.575060533","0"
"Odit64","widely","2021-01-03","0.519968677","2020-08-05","0.604243542","2020-01-11","0.642319277","2020-04-27","0.2","0.51393534","0.757352941","0.336976321","0.484799131","0.5879"
"Molestias63","widely","2031-05-06","0.559646539","2024-04-20","0.71399177","2028-07-08","0.355862069","2026-03-25","0.933656958","0.680084746","0.533081285","0.631914894","0.569486405",""
"Cumque62","widely","","0.014492754","2023-01-24","0.159895151","2024-10-14","0.730916031","2022-07-22","0.408477842","0.304712042","0.514752371","0.691983122","0.643564356","0.6893"
"Autem60","widely","2022-06-05","0.38547486","2020-04-19","0.151631478","2024-10-14","0.196003806","2024-06-29","0.558596491","0.577840112","0.878453039","0.377127297","0.636755205","0.2791"
Expand Down Expand Up @@ -48,7 +48,7 @@
"Id0","newly","","0.123201439","2028-04-22","0.51894452","2022-07-16","0.622673435","2022-02-12","0.179263566","0.634573304","0.503419253","0.957420925","0.681946403","0.4185"
"Asperiores7","limited","2026-11-23","0.4605764","2023-01-24","0.357958873","2024-10-14","0.356832972","2020-04-27","0.5155902","0.563097514","0.057803468","0.341496599","0.600997506","0.3013"
"Deleniti21","limited","2020-08-31","0.517928287","2020-08-05","0.64184953","","0.06147541","2020-01-27","0.589115646","0.472222222","0.984","0.338412189","0.571218796","0.00001"
"Doloribus71","limited","","0.630557801","","0.235497835","","0.464978448","2020-01-27","0.258487654","0.707801418","0.051136364","0.523421589","0.112676056","0.2542"
"Doloribus71","limited","","0.630557801","","0.235497835","","0.464978448","2020-01-27","0.258487654","0.707801418","0.051136364","0.523421589","0.112676056","0"
"Error13","limited","2020-01-13","0.572307692","","0.7515625","2029-03-01","0.805607477","2024-06-29","0.63378545","0.452986023","0.326086957","0.186315789","0.06779661","0.7404"
"Est29","limited","2022-11-01","0.535407015","","0.542915531","2020-05-02","0.967032967","2020-01-26","0.2","0.452611219","0.690677966","0.915397631","0.455233291","0"
"Fugiat37","limited","2020-01-13","0.274570983","2020-04-19","0.606288448","2021-08-23","0.427710843","2020-04-27","0.104347826","0.663128096","0.865479723","0.378212974","0.775280899","0.00001"
Expand All @@ -57,22 +57,22 @@
"Numquam56","limited","2022-11-01","0.20657277","2021-04-13","0.581893573","2022-10-22","0.502405131","2020-01-27","0.663303909","0.517412935","0.408545727","0.528599606","0.519137466",""
"Quae9","limited","2020-01-13","0.947368421","2021-04-13","0.339164237","","0.327941176","2033-01-19","0.696498054","0.37521815","0.768377254","0.145038168","0.779935275","0.00001"
"Quaerat14","limited","2021-03-24","0.747572816","2022-08-01","0.389548694","2022-10-22","0.666666667","2020-01-26","0.101769912","0.316055626","0.470178156","0.600877193","0.752112676","0.00001"
"Quia65","limited","2020-01-13","0.420435511","2020-08-05","0.488174651","2023-04-28","0.851816444","2024-06-29","0.547511312","0.498861048","0.528912467","0.738834217","0.722452361","0.9273"
"Quia65","limited","2020-01-13","0.420435511","2020-08-05","0.488174651","2023-04-28","0.851816444","2024-06-29","0.547511312","0.498861048","0.528912467","0.738834217","0.722452361","0.9366"
"Reiciendis8","limited","2021-03-24","0.238461538","2029-06-17","0.855042017","","0.195993031","2021-08-26","0.498434238","0.372225745","0.672413793","0.623505976","0.305989583","0.3442"
"Sapiente75","limited","2020-01-05","0.503289474","2025-06-10","0.702380952","2028-07-08","0.385230769","2029-03-15","0.05060241","0.598468271","0.518329939","0.090403338","0.301919721",""
"Voluptas18","limited","2028-06-28","0.44604811","2021-04-13","0.778675283","2027-09-21","0.701789264","2020-01-27","0.87761194","0.711642251","0.671068427","0.064917127","0.572902338","0.692"
"Voluptate22","limited","","0.536553525","2021-04-13","0.807692308","2027-09-21","0.940914158","2026-03-25","0.62412993","0.148371532","0.209205021","0.866745283","0.252465483","0"
"Voluptate36","limited","2022-11-01","0.977987421","2025-01-24","0.351948052","2022-02-17","0.717343173","2021-03-11","0.113924051","0.597864769","0.446658098","0.087818697","0.008733624","0"
"Aut78","","2020-01-05","0.070224719","2020-11-18","0.614442295","","0.931415929","2023-07-28","0.568757539","0.942180095","0.574098798","0.531317495","0.082036775","0.00001"
"Aut78","","2020-01-05","0.070224719","2020-11-18","0.614442295","","0.931415929","2023-07-28","0.568757539","0.942180095","0.574098798","0.531317495","0.082036775",""
"Ea52","","2020-08-31","0.531030761","2020-08-05","0.400669643","2020-01-08","0.594139194","2020-04-27","0.654353562","0.645627376","0.053333333","0.727598566","0.153034301","0.7388"
"Et61","","2021-01-03","0.502051984","2020-08-05","0.280245023","2029-06-05","0.843862816","2023-07-28","0.567947516","0.220272904","0.070588235","0.537428023","0.963604853","0"
"Explicabo31","","2021-11-21","0.524336283","2023-04-17","0.447749809","2020-01-11","0.403183024","2022-07-22","0.184939092","0.190812721","0.463345196","0.440179143","0.625","0.8578"
"Fugit69","","2023-11-21","0.398513011","2020-08-05","0.57754386","2029-06-05","0.44413251","2022-07-22","0.505408063","0.69650655","0.775609756","0.525219298","0.039285714","0"
"Fugit69","","2023-11-21","0.398513011","2020-08-05","0.57754386","2029-06-05","0.44413251","2022-07-22","0.505408063","0.69650655","0.775609756","0.525219298","0.039285714",""
"Nisi24","","2020-01-05","0.542277339","","0.778409091","2020-01-11","0.459259259","2020-04-27","0.389592124","0.278825996","0.662768031","0.739811912","0.277909739","0.1476"
"Omnis53","","2021-07-19","0.979591837","2022-05-24","0.642076503","2022-07-16","0.105343511","2023-12-07","0.284040996","0.654726368","0.638724036","0.506521739","0.458304618","0.00001"
"Qui54","","2020-08-31","0.401437372","2020-11-18","0.317355372","2024-06-10","0.406362979","2020-04-27","0.36863711","0.367901235","0.759776536","0.087912088","0.758421559",""
"Quod40","","2020-01-13","0.405952381","2020-11-18","0.22962963","2021-08-23","0.403864734","2023-12-07","0.378059072","0.357670221","0.873271889","0.454876937","0.742857143","0.871"
"Quos79","","2025-03-28","0.556986478","2020-11-18","0.052837573","2020-05-02","0.494138864","2020-01-27","0.657142857","0.656910569","0.510932106","0.435658915","0.210292813",""
"Quos79","","2025-03-28","0.556986478","2020-11-18","0.052837573","2020-05-02","0.494138864","2020-01-27","0.657142857","0.656910569","0.510932106","0.435658915","0.210292813","0.4987"
"Repudiandae55","","2020-01-05","0.645953757","2022-08-01","0.92578125","2020-01-08","0.461384152","2024-06-29","0.824046921","0.181341719","0.242537313","0.586005831","0.353767561","0.3001"
"Rerum26","","","0.168715084","2023-08-26","0.681514477","2020-01-08","0.384965831","2022-10-31","0.509081474","0.552677029","0.817234848","0.878546099","0.597383721","0.3444"
"Suscipit41","","2023-08-30","0.707112971","2022-08-01","0.741585233","2020-01-08","0.837902265","2020-04-27","0.768656716","0.28440367","0.253731343","0.238679969","0.853705486","0.00001"
Expand Down
Loading

0 comments on commit 27becb2

Please sign in to comment.