Skip to content

feat(warp): add trace command for platform import debugging#38455

Closed
deyaaeldeen wants to merge 4 commits into
mainfrom
deyaaeldeen/warp-trace-imports
Closed

feat(warp): add trace command for platform import debugging#38455
deyaaeldeen wants to merge 4 commits into
mainfrom
deyaaeldeen/warp-trace-imports

Conversation

@deyaaeldeen
Copy link
Copy Markdown
Member

Summary

Add a new warp trace command that visualizes how #-prefixed imports resolve across different build targets. This helps catch bugs where a browser entry point accidentally imports a Node-only module, or vice versa.

Motivation

Recently we had a bug in the storage-common platform imports migration where indexPlatform-browser.mts was accidentally importing the Node version of StorageBrowserPolicyV2 instead of the browser version. This caused browser tests to fail because the cache-busting _ parameter wasn't being added to URLs.

This was difficult to debug because:

  1. The import chain was several levels deep
  2. The incorrect resolution wasn't obvious from looking at the source
  3. The mismatch only showed up at runtime in specific tests

The Solution

The warp trace command walks the import graph from each exported entry point and shows how #-prefixed imports resolve under each target's conditions.

Example output:

╔══════════════════════════════════════════════════════════════╗
║  Platform Import Divergences                                 ║
╚══════════════════════════════════════════════════════════════╝

#platform/indexPlatform:
  browser      → src/indexPlatform-browser.mts
  esm          → src/indexPlatform.ts
  commonjs     → src/indexPlatform.ts

╔══════════════════════════════════════════════════════════════╗
║  Import Graphs by Target                                     ║
╚══════════════════════════════════════════════════════════════╝

Target: browser (browser)
Conditions: import, browser, default

└─ src/index.ts
   └─ #platform/indexPlatform → src/indexPlatform-browser.mts (browser)
      └─ #platform/policies/CachePolicy → src/policies/CachePolicy-browser.mts (browser)

The divergences section shows all #-prefixed imports that resolve differently across targets - this makes it immediately obvious which imports have platform-specific behavior.

The import graphs section shows the full resolution chain from each entry point, making it easy to trace how a specific module ends up being included.

CLI Options

warp trace [options]

Options:
  --depth <n>       Maximum import chain depth to trace (default: 10)
  --entry <subpath> Only trace specific entry points (repeatable)
  --json           Output machine-readable JSON for CI pipelines

Files Changed

  • common/tools/warp/src/trace.ts - New module implementing the trace functionality
  • common/tools/warp/src/cli.ts - Added trace command to CLI
  • common/tools/warp/README.md - Documentation for the new command

Add a new `warp trace` command that visualizes how #-prefixed imports
resolve across different build targets. This helps catch bugs where a
browser entry point accidentally imports a Node-only module, or vice versa.

The command shows:
- Platform Import Divergences: all #-prefixed imports that resolve
  differently across targets (expected for platform-specific code)
- Import Graphs: full resolution chain from each entry point per target

Example output shows the browser target correctly resolving to -browser.mts
files while Node targets resolve to .ts files.

Use `--json` for machine-readable output suitable for CI pipelines.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@github-actions github-actions Bot added the warp Issues related to @microsoft/warp build tool label May 7, 2026
@deyaaeldeen deyaaeldeen force-pushed the deyaaeldeen/warp-trace-imports branch from 672cf65 to bd8de62 Compare May 7, 2026 17:31
Detects when a platform-specific file (e.g., -browser.mts) directly imports
a non-platform file that has a platform variant available. Shows warning:

  ⚠️  browser: src/indexPlatform-browser.mts
      imports: ./policies/StorageBrowserPolicyV2.js
      issue: "StorageBrowserPolicyV2.js" imported directly
      fix: Use #platform/... to get "StorageBrowserPolicyV2-browser.mts"

This catches the exact bug that caused storage-common test failures where
the browser entry point accidentally imported the Node version.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@deyaaeldeen deyaaeldeen force-pushed the deyaaeldeen/warp-trace-imports branch from bd8de62 to 846e909 Compare May 7, 2026 17:32
deyaaeldeen and others added 2 commits May 7, 2026 17:46
…uild)

Add validatePlatformImports function for build-time validation of platform
imports. Currently disabled in the build pipeline because the polyfill
mechanism handles direct imports in platform-specific files (-browser.mts).

The validation logic:
- Scans src/ directory for platform-specific files
- Checks if direct imports should use #platform/* instead
- Uses package.json imports field for principled detection

The trace command remains the primary tool for debugging platform import
issues. Build-time validation may be enabled in the future with refinements
to handle polyfill-covered cases.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
… not active

The polyfill mechanism handles direct imports in platform-specific files,
so validation is only needed when packages rely solely on #platform imports.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@deyaaeldeen
Copy link
Copy Markdown
Member Author

Added validation instead.

@deyaaeldeen deyaaeldeen closed this May 7, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Created By Copilot warp Issues related to @microsoft/warp build tool

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant