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

feature(dev-middleware): use userAgent query parameter as fallback when header is unset #43364

Conversation

byCedric
Copy link
Contributor

@byCedric byCedric commented Mar 7, 2024

Summary:

At Expo, we use Expo Tools to connect the built-in vscode-js-debug to Hermes.

Since there are a few differences in vscode vs chrome devtools, we need to enable a couple of modifications through the customMessageHandler API. Unfortunately, vscode itself doesn't set the user-agent header when connecting to the inspector proxy. Becuase of that, we'd need a fallback to "manually" mark the debugger as being vscode (we use this query parameter here).

This PR supports setting the user-agent through ?userAgent= when the header is not set.

Changelog:

[GENERAL] [ADDED] - Fallback to query parameter based user-agent when header is unset

Test Plan:

  • Install Expo Tools
  • Start Metro with this change.
  • Connect a device.
  • Run the vscode command "Expo: Debug Expo app ..."
  • Debugger should connect, and have it's user-agent marked as:
    vscode/1.87.0 vscode-expo-tools/1.3.0

@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. p: Expo Partner: Expo Partner Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. labels Mar 7, 2024
@motiz88
Copy link
Contributor

motiz88 commented Mar 8, 2024

Unit test please, but LGTM otherwise

@byCedric
Copy link
Contributor Author

byCedric commented Mar 11, 2024

Heads up that none of the tests currently test the user-agent header:

image


Edit:

We don't have access to the debuggerInfo using the current test setup. Neither the device nor the debugger agents are getting this information, and it is marked as private within the inspector proxy.

One thing we could do is rebase this on #43291 and test it through the unstable_customInspectorMessageHandler function instead. Let me know if you want to do this or an alternative option.

@motiz88
Copy link
Contributor

motiz88 commented Mar 12, 2024

rebase this on #43291 and test it through the unstable_customInspectorMessageHandler function

Yes please, that would help us keep from breaking your code that depends on it.

@motiz88
Copy link
Contributor

motiz88 commented Mar 12, 2024

Let's do the test in a separate PR to make sure we can land this in time for the next RC.

@facebook-github-bot
Copy link
Contributor

@motiz88 has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@facebook-github-bot facebook-github-bot added the Merged This PR has been merged. label Mar 12, 2024
@facebook-github-bot
Copy link
Contributor

@motiz88 merged this pull request in c62be78.

huntie pushed a commit that referenced this pull request Mar 18, 2024
…when header is unset (#43364)

Summary:
At Expo, we use [Expo Tools](https://github.com/expo/vscode-expo/blob/main/src/expoDebuggers.ts) to connect the [built-in vscode-js-debug](https://github.com/microsoft/vscode-js-debug) to Hermes.

Since there are a few differences in vscode vs chrome devtools, we need to enable a couple of modifications through the [`customMessageHandler` API](#43291). Unfortunately, vscode itself doesn't set the `user-agent` header when connecting to the inspector proxy. Becuase of that, we'd need a fallback to "manually" mark the debugger as being vscode ([we use this query parameter here](https://github.com/expo/vscode-expo/blob/main/src/expoDebuggers.ts#L208)).

This PR supports setting the `user-agent` through `?userAgent=` when the header is not set.

## Changelog:

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->

[GENERAL] [ADDED] - Fallback to query parameter based `user-agent` when header is unset

Pull Request resolved: #43364

Test Plan:
- Install [Expo Tools](https://marketplace.visualstudio.com/items?itemName=expo.vscode-expo-tools)
- Start Metro with this change.
- Connect a device.
- Run the vscode command `"Expo: Debug Expo app ..."`
- Debugger should connect, and have it's user-agent marked as:
    `vscode/1.87.0 vscode-expo-tools/1.3.0`

Reviewed By: huntie

Differential Revision: D54804556

Pulled By: motiz88

fbshipit-source-id: 1ff558ba5350811ad042d08a713438e046759feb
facebook-github-bot pushed a commit that referenced this pull request Mar 20, 2024
…#43559)

Summary:
This is a follow-up bugfix for expo/expo#27425, related to:
 - #43291
 - #43307
 - #43310
 - #43364

The middleware API works as intended and can run our extended CDP events. Unfortunately, this only applies to an actual `Page` from the device, not for the `React Native Experimental (Improved Chrome Reloads)` synthetic / virtual page.

That's because the middleware instantiation gets aborted when the page can't be found in `this.#pages.get(pageId)`, which always returns `null` for this synthetic page.

## Changelog:

[GENERAL] [FIXED] Create custom message handler for synthetic page

Pull Request resolved: #43559

Test Plan: See added test case.

Reviewed By: motiz88

Differential Revision: D55129412

Pulled By: huntie

fbshipit-source-id: 9679d8fe68f3cb4104f4a042f93612b995baddc9
huntie pushed a commit that referenced this pull request Mar 21, 2024
…#43559)

Summary:
This is a follow-up bugfix for expo/expo#27425, related to:
 - #43291
 - #43307
 - #43310
 - #43364

The middleware API works as intended and can run our extended CDP events. Unfortunately, this only applies to an actual `Page` from the device, not for the `React Native Experimental (Improved Chrome Reloads)` synthetic / virtual page.

That's because the middleware instantiation gets aborted when the page can't be found in `this.#pages.get(pageId)`, which always returns `null` for this synthetic page.

## Changelog:

[GENERAL] [FIXED] Create custom message handler for synthetic page

Pull Request resolved: #43559

Test Plan: See added test case.

Reviewed By: motiz88

Differential Revision: D55129412

Pulled By: huntie

fbshipit-source-id: 9679d8fe68f3cb4104f4a042f93612b995baddc9
This was referenced Jun 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged. p: Expo Partner: Expo Partner Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants