{"id":17806347,"url":"https://github.com/jrapoport/grpc-web-devtools","last_synced_at":"2025-03-17T12:31:31.605Z","repository":{"id":42190660,"uuid":"320166975","full_name":"jrapoport/grpc-web-devtools","owner":"jrapoport","description":"Chrome \u0026 Firefox Browser extension to aid gRPC-Web development using native gRPC-Web interceptors. ","archived":false,"fork":false,"pushed_at":"2023-03-06T23:26:47.000Z","size":5437,"stargazers_count":31,"open_issues_count":17,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-28T00:10:49.424Z","etag":null,"topics":["chrome","chrome-extension","debugging-tool","developer-tools","devtools","firefox","firefox-extension","grpc","grpc-interceptor","grpc-web","javascript","platform","react","streaming-call"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jrapoport.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-12-10T05:14:19.000Z","updated_at":"2025-01-22T11:31:48.000Z","dependencies_parsed_at":"2023-02-07T16:32:27.372Z","dependency_job_id":null,"html_url":"https://github.com/jrapoport/grpc-web-devtools","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jrapoport%2Fgrpc-web-devtools","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jrapoport%2Fgrpc-web-devtools/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jrapoport%2Fgrpc-web-devtools/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jrapoport%2Fgrpc-web-devtools/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jrapoport","download_url":"https://codeload.github.com/jrapoport/grpc-web-devtools/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243864629,"owners_count":20360356,"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":["chrome","chrome-extension","debugging-tool","developer-tools","devtools","firefox","firefox-extension","grpc","grpc-interceptor","grpc-web","javascript","platform","react","streaming-call"],"created_at":"2024-10-27T13:05:28.042Z","updated_at":"2025-03-17T12:31:30.933Z","avatar_url":"https://github.com/jrapoport.png","language":"JavaScript","funding_links":["https://www.buymeacoffee.com/jrapoport"],"categories":[],"sub_categories":[],"readme":"# gRPC-Web Dev Tools: Interceptor Edition\n\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](http://makeapullrequest.com) \n[![GitHub](https://img.shields.io/github/license/jrapoport/grpc-web-devtools?style=flat-square)](https://github.com/jrapoport/grpc-web-devtools/blob/master/LICENSE)\n\n\n[![Buy Me A Coffee](https://img.shields.io/badge/buy%20me%20a%20coffee-☕-6F4E37?style=flat-square)](https://www.buymeacoffee.com/jrapoport)\n\n\n![gRPC-Web Dev Tools](screenshots/store_light_dark.png)\nNow supports dark mode.\n\n# gRPC-Web Interceptor Support\n\nThis fork of [grpc-web-devtools](https://github.com/SafetyCulture/grpc-web-devtools)\nadds support for native gRPC-Web interceptors.\n\n[SafetyCulture's previous version](https://github.com/SafetyCulture/grpc-web-devtools) \nwas incompatible with other gRPC-Web interceptors and broke them — which made \ndebugging things like JWT authorization over gRPC-Web impossible.\n\nThis version fixes that by reimplementing the extension as a pair of native \ngRPC-Web interceptors. Now you can include the debug interceptors alongside \nthe other gRPC-Web interceptors in your chain, and it \"just works\".\n\nI also added a new icon to indicate when a stream has ended (vs. the call \nreturning).\n\nCurrently, a unary gRPC-Web callback uses the same internal gRPC-Web code path \nas a streaming call (as opposed to a unary promise). As a result, the unary \ncallback appears as a streaming call in the debug panel.\n\n**NOTE: This is a breaking change.**\n\n## NEW Usage\n```javascript\nconst devInterceptors = window.__GRPCWEB_DEVTOOLS__ || (() =\u003e {});\nconst {\n  devToolsUnaryInterceptor,\n  devToolsStreamInterceptor,\n} = devInterceptors();\n\nconst opts = {\n  unaryInterceptors: [devToolsUnaryInterceptor],\n  streamInterceptors: [devToolsStreamInterceptor],\n};\nconst client = new EchoServiceClient('http://myapi.com', null, opts);\n```\n\n## Installation\n\n### Chrome\n\n~~Via the [Chrome Web Store](https://chrome.google.com/webstore/detail/grpc-web-developer-tools/ddamlpimmiapbcopeoifjfmoabdbfbjj) (recommended)~~\n\nor\n\n1. build it with `make build`\n1. open the **Extension Management** page by navigating to `chrome://extensions`.\n1. enable **Developer Mode** by clicking the toggle switch next to \"Developer mode\".\n1. Click the **LOAD UNPACKED** button and select the extension `./build` directory.\n\n### Firefox\n\n~~Via [Firefox Browser Add-Ons](https://addons.mozilla.org/en-US/firefox/addon/grpc-web-developer-tools/) (recommended)~~\n\nor\n\n1. build and package with `make package`\n1. enter `about:debugging` in the URL bar of Firefox\n1. click **This Firefox** \u003e **Load Temporary Add-on...**\n1. select the `grpc-web-devtools.zip` extention file\n\n## Usage\n\n```javascript\nconst devInterceptors = window.__GRPCWEB_DEVTOOLS__ || (() =\u003e {});\nconst {\n  devToolsUnaryInterceptor,\n  devToolsStreamInterceptor,\n} = devInterceptors();\n\nconst opts = {\n  unaryInterceptors: [devToolsUnaryInterceptor],\n  streamInterceptors: [devToolsStreamInterceptor],\n};\nconst client = new EchoServiceClient('http://myapi.com', null, opts);\n```\n\n\u003e NOTE:  \n\u003e Requires clients use grpc-web \u003e= 1.2.1 \u0026 that your generated client(s) use `protoc-gen-grpc-web` \u003e= 1.2.1  \n\u003e\n\u003e ~~protoc-gen-grpc-web v1.3.0 is bundled~~  \n\u003e (disabled temporarily pending arm64 macOS support)\n\n## Example\n\nThe example uses `docker-compose` to start a simple gRPC server, JavaScript\nclient and the Envoy proxy for gRPC-Web:\n\n```bash\nmake example-up\n```\n\nExample will be running on [http://localhost:8080](http://localhost:8080)\n\nTo stop the example:\n\n```bash\nmake example-down\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjrapoport%2Fgrpc-web-devtools","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjrapoport%2Fgrpc-web-devtools","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjrapoport%2Fgrpc-web-devtools/lists"}