Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: Improve readme for devtools package #7138

Merged
merged 2 commits into from
Oct 31, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
74 changes: 73 additions & 1 deletion packages/wrangler-devtools/README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,78 @@
# Wrangler Devtools Pages Project

This package contains a Workers specific version of Chrome Devtools that is used by the Wrangler dev command.
This package contains a Workers specific version of Chrome Devtools that is used by the Wrangler dev command. It is a customized fork of Chrome DevTools specifically tailored for debugging Cloudflare Workers. This package provides Worker-specific functionality through carefully maintained patches on top of Chrome DevTools.

## Overview

This package is used across multiple Cloudflare products:

- Workers Playground (`workers-playground`)
- Quick Editor (`@cloudflare/quick-edit`)
- Wrangler CLI via the `InspectorProxy`

## Features

Our customized DevTools implementation provides:

- Source code viewing and live updates
- Network request inspection
- Worker-specific UI optimizations

## Development

We maintain this fork by applying patches on top of Chrome DevTools. These patches need to be periodically rebased as Chrome DevTools evolves.

**Key Development Tasks:**

- Generating patches from our customizations
- Rebasing patches onto new Chrome DevTools versions
- Testing functionality across all integration points

## Updating DevTools

We perform quarterly updates to stay current with upstream Chrome DevTools. The update process involves:

1. Cloning the devtools-frontend repo
2. Applying our existing patches
3. Rebasing onto the latest Chrome DevTools
4. Regenerating patches
5. Thorough testing across all integration points

**For detailed instructions on updating DevTools, please refer to our internal documentation on keeping devtools up-to-date.**

## Testing

Two methods are available for testing updates:

**Local Development:**

- Build and serve DevTools locally
- Test against local Playground instance
- Make targeted fixes as needed

**Preview Builds:**

- Add `preview:wrangler-devtools` label to PRs
- Use deployed preview URL for testing
- Verify functionality in Playground

## Acceptance Criteria

Our DevTools implementation must maintain full functionality across:

- Console operations (logging, errors, filters)
- Source code viewing and debugging
- Network request inspection
- Worker-specific UI customizations

## Contributing

When making changes:

- Keep patches minimal and targeted
- Prefer CSS-based UI modifications
- Test thoroughly across all integration points
- Document any new patches or modifications

## Deployment

Expand Down
Loading