{"id":19665959,"url":"https://github.com/microsoftedge/topdeveloperneeds","last_synced_at":"2025-05-05T16:15:57.145Z","repository":{"id":234294448,"uuid":"787486605","full_name":"MicrosoftEdge/TopDeveloperNeeds","owner":"MicrosoftEdge","description":"Web platform top developer needs dashboard","archived":false,"fork":false,"pushed_at":"2025-02-07T00:06:39.000Z","size":469,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-30T22:12:43.754Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://MicrosoftEdge.github.io/TopDeveloperNeeds","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MicrosoftEdge.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-04-16T16:02:49.000Z","updated_at":"2025-02-07T00:06:42.000Z","dependencies_parsed_at":"2024-04-18T19:29:51.372Z","dependency_job_id":"3b6c0034-82ef-4de1-a506-786f20b170f6","html_url":"https://github.com/MicrosoftEdge/TopDeveloperNeeds","commit_stats":null,"previous_names":["microsoftedge/topdeveloperneeds"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MicrosoftEdge%2FTopDeveloperNeeds","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MicrosoftEdge%2FTopDeveloperNeeds/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MicrosoftEdge%2FTopDeveloperNeeds/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MicrosoftEdge%2FTopDeveloperNeeds/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MicrosoftEdge","download_url":"https://codeload.github.com/MicrosoftEdge/TopDeveloperNeeds/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252531871,"owners_count":21763292,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-11T16:25:38.243Z","updated_at":"2025-05-05T16:15:57.120Z","avatar_url":"https://github.com/MicrosoftEdge.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Microsoft Edge - 2024 web platform top developer needs\n\nThis repository contains the data and scripts that are used to generate the [Microsoft Edge - 2024 web platform top developer needs](https://microsoftedge.github.io/TopDeveloperNeeds/) dashboard.\n\nFor more information about the dashboard, see [Introducing the Edge 2024 web platform top developer needs dashboard](https://blogs.windows.com/msedgedev/2024/04/18/2024-web-platform-top-developer-needs-dashboard/) oin the Microsoft Edge blog.\n\nThe rest of this README file explains how to update the dashboard data and site.\n\n## Prerequisites\n\n* Install [Node.js](https://nodejs.org).\n* Install the required dependencies by typing `npm install`.\n\n## Updating the list of features\n\nThe features listed on the dashboard are defined in the `features.json` file.\n\nTo update the list of features, make changes to the file. The file contains a JSON array of objects, where each object represents a single feature.\n\nFeatures are based on the features part of the [web-features project](https://github.com/web-platform-dx/web-features/). At a minimum, each feature object must contain the following information:\n\n* `webFeaturesID`: the ID of the feature in the [web-features](https://github.com/web-platform-dx/web-features/) repo.\n* `rationale`: a list of reasons why this feature is important for our dashboard. Each reason is an object with the following string properties `{ description, link }`.\n* `wpt`: a string starting with `/results`, and including the optional request parameters that's used to retrieve WPT test results on the wpt.fyi site.\n\nFor example:\n\n```json\n{\n  \"webFeaturesID\": \"object-view-box\",\n  \"wpt\": \"/results/css?q=object%20view%20box\",\n  \"rationale\": [\n    {\n      \"description\": \"The feature is a pre-requisite for the View Transitions API, which is a highly requested feature\",\n      \"link\": \"https://github.com/w3c/csswg-drafts/issues/7058\"\n    }\n  ]\n}\n```\n\nIf the feature corresponds to a group of features from the web-features repo, make the following changes:\n\n* `name`: define a name for the group of features.\n* `webFeaturesIDs`: change this field's type to an array of the IDs of the features in the web-features repo.\n\nFor example, the Scrollbar styling group below is a group of three different web-features:\n\n```json\n{\n  \"name\": \"Scrollbar styling\",\n  \"webFeaturesID\": [\"scrollbar-color\", \"scrollbar-gutter\", \"scrollbar-width\"],\n  \"wpt\": \"/results/css?q=path%3A%2Fcss%2Fcss-scrollbars%20or%20%28scrollbar-gutter%20and%20path%3A%2Fcss%2Fcss-overflow%29\",\n  \"rationale\": [\n    {\n      \"description\": \"Styling scrollbar ranked #5 in the State of CSS Survey 2023's browser incompatibilities question\",\n      \"link\": \"https://2023.stateofcss.com/en-US/usage/#css_interoperability_features\"\n    }\n  ]\n}\n```\n\nIn addition, you can provide the following optional fields:\n\n* `id`: used to set the anchor link ID for the feature. By default anchor links match web-features IDs. Use `id` to override the default anchor link ID. This can be useful when updating a feature over time, to avoid breaking existing links.\n* `name`: to override the name coming from the web-features repo.\n* `description`: to override the description coming from the web-features repo.\n* `spec`: to override the spec (or specs) coming from the web-features repo.\n\n## Generating the dashboard data\n\n1. Update the dependencies:\n\n   * `npm update web-features`\n     \n     This updates to the most recent version of web-features.\n\n   * `npx npm-check-updates -u`\n\n     This updates to the most recent version of browser-compat-data, and other dependencies, such as Playwright.\n\n   * `npm install`\n   \n     This installs the missing dependencies if new versions were found at the previous step.\n\n   * `npx playwright install`\n\n     This re-installs the Playwright executables, if needed.\n\n1. To update the computed feature data file:\n\n   * `npm run generate`\n   \n   This re-generates `site/_data/features.json` based on `features.json`.\n\n1. To retrieve the latest WPT revision for this week:\n\n   * `npm run get-wpt-shas`\n   \n     This adds more entries into the `historical-shas.json` file, which is needed to retrieve WPT test results.\n\n1. To retrieve the WPT test results:\n\n   * `npm run update-wpt`\n   \n     This fetches the missing WPT results for our features based on the `historical-shas.json` file, and puts them in `site/_data/wpt.json` as well as generates front-end files in `site/assets/`.\n\n1. To build the site\n\n   * `npm run build-site`\n   \n     This generates the dashboard website in the `docs` directory.\n\n## Testing the dashboard\n\nTo test the built website before publishing it to the live server, run `npm run serve-site` and open a browser window to `http://localhost:8080/`.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmicrosoftedge%2Ftopdeveloperneeds","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmicrosoftedge%2Ftopdeveloperneeds","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmicrosoftedge%2Ftopdeveloperneeds/lists"}