Provide icon to edge devtools. #26543
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
harrygz889
changed the title
| @@ -472,8 +472,8 @@ function createPanelIfReactLoaded() { | |||
| let needsToSyncElementSelection = false; | |||
|
|
|||
| chrome.devtools.panels.create( | |||
| IS_CHROME || IS_EDGE ? '⚛️ Components' : 'Components', | |||
There was a problem hiding this comment.
Can we keep the IS_EDGE here? since Edge still has the default UI that need this emoji version title.
|
Hi Harry, thank you so much for addressing this issue. I feel like it might be safer to limit the icon only provided for Edge cause we've no idea how's other browsers treat this api. Also left a comment there. |
|
main.js LGTM, though not sure if we need to modify the ReactVersion file, thank you! |
|
I did not modify this file directly, so I'm unsure why that occurred. It seems that must be part of some build output. |
hoxyq
added a commit
that referenced
this pull request
Apr 17, 2023
Full list of changes (not everything included in changelog): * refactor[devtools]: copy to clipboard only on frontend side ([hoxyq](https://github.com/hoxyq) in [#26604](#26604)) * Provide icon to edge devtools. ([harrygz889](https://github.com/harrygz889) in [#26543](#26543)) * [BE] move shared types & constants to consolidated locations ([mondaychen](https://github.com/mondaychen) in [#26572](#26572)) * remove backend dependency from the global hook ([mondaychen](https://github.com/mondaychen) in [#26563](#26563)) * Replace deprecated `new-window` with `webContents.setWindowOpenHandler()` ([Willie-Boy](https://github.com/Willie-Boy) in [#26559](#26559)) * DevTools: Inline references to fiber flags ([acdlite](https://github.com/acdlite) in [#26542](#26542)) * refactor[devtools]: forbid editing class instances in props ([hoxyq](https://github.com/hoxyq) in [#26522](#26522)) * Move update scheduling to microtask ([acdlite](https://github.com/acdlite) in [#26512](#26512)) * Remove unnecessary CIRCLE_CI_API_TOKEN checks ([mondaychen](https://github.com/mondaychen) in [#26499](#26499)) * browser extension: improve script injection logic ([mondaychen](https://github.com/mondaychen) in [#26492](#26492)) * [flow] make Flow suppressions explicit on the error ([kassens](https://github.com/kassens) in [#26487](#26487))
kassens
pushed a commit
to kassens/react
that referenced
this pull request
Apr 17, 2023
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. Before submitting a pull request, please make sure the following is done: 1. Fork [the repository](https://github.com/facebook/react) and create your branch from `main`. 2. Run `yarn` in the repository root. 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). 10. If you haven't already, complete the CLA. Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html --> ## Summary Addresses facebook#26352. This PR explicitly passes an icon to `chrome.devtools.panels.create()`, so that edge devtools will display the icon when in [Focus Mode](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/experimental-features/focus-mode). <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? --> ## How did you test this change? Passing test suite (`yarn test` & `yarn test --prod`) ✅ Passing lint (`yarn linc`) ✅ Passing type checks (`yarn flow`) ✅ **Visual Testing** Before Changes | After Changes :-------------------------:|:-------------------------:  |  <!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. How exactly did you verify that your PR solves the issue you wanted to solve? If you leave this empty, your PR will very likely be closed. -->
kassens
pushed a commit
to kassens/react
that referenced
this pull request
Apr 17, 2023
Full list of changes (not everything included in changelog): * refactor[devtools]: copy to clipboard only on frontend side ([hoxyq](https://github.com/hoxyq) in [facebook#26604](facebook#26604)) * Provide icon to edge devtools. ([harrygz889](https://github.com/harrygz889) in [facebook#26543](facebook#26543)) * [BE] move shared types & constants to consolidated locations ([mondaychen](https://github.com/mondaychen) in [facebook#26572](facebook#26572)) * remove backend dependency from the global hook ([mondaychen](https://github.com/mondaychen) in [facebook#26563](facebook#26563)) * Replace deprecated `new-window` with `webContents.setWindowOpenHandler()` ([Willie-Boy](https://github.com/Willie-Boy) in [facebook#26559](facebook#26559)) * DevTools: Inline references to fiber flags ([acdlite](https://github.com/acdlite) in [facebook#26542](facebook#26542)) * refactor[devtools]: forbid editing class instances in props ([hoxyq](https://github.com/hoxyq) in [facebook#26522](facebook#26522)) * Move update scheduling to microtask ([acdlite](https://github.com/acdlite) in [facebook#26512](facebook#26512)) * Remove unnecessary CIRCLE_CI_API_TOKEN checks ([mondaychen](https://github.com/mondaychen) in [facebook#26499](facebook#26499)) * browser extension: improve script injection logic ([mondaychen](https://github.com/mondaychen) in [facebook#26492](facebook#26492)) * [flow] make Flow suppressions explicit on the error ([kassens](https://github.com/kassens) in [facebook#26487](facebook#26487))
EdisonVan
pushed a commit
to EdisonVan/react
that referenced
this pull request
Apr 15, 2024
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. Before submitting a pull request, please make sure the following is done: 1. Fork [the repository](https://github.com/facebook/react) and create your branch from `main`. 2. Run `yarn` in the repository root. 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). 10. If you haven't already, complete the CLA. Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html --> ## Summary Addresses facebook#26352. This PR explicitly passes an icon to `chrome.devtools.panels.create()`, so that edge devtools will display the icon when in [Focus Mode](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/experimental-features/focus-mode). <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? --> ## How did you test this change? Passing test suite (`yarn test` & `yarn test --prod`) ✅ Passing lint (`yarn linc`) ✅ Passing type checks (`yarn flow`) ✅ **Visual Testing** Before Changes | After Changes :-------------------------:|:-------------------------:  |  <!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. How exactly did you verify that your PR solves the issue you wanted to solve? If you leave this empty, your PR will very likely be closed. -->
EdisonVan
pushed a commit
to EdisonVan/react
that referenced
this pull request
Apr 15, 2024
Full list of changes (not everything included in changelog): * refactor[devtools]: copy to clipboard only on frontend side ([hoxyq](https://github.com/hoxyq) in [facebook#26604](facebook#26604)) * Provide icon to edge devtools. ([harrygz889](https://github.com/harrygz889) in [facebook#26543](facebook#26543)) * [BE] move shared types & constants to consolidated locations ([mondaychen](https://github.com/mondaychen) in [facebook#26572](facebook#26572)) * remove backend dependency from the global hook ([mondaychen](https://github.com/mondaychen) in [facebook#26563](facebook#26563)) * Replace deprecated `new-window` with `webContents.setWindowOpenHandler()` ([Willie-Boy](https://github.com/Willie-Boy) in [facebook#26559](facebook#26559)) * DevTools: Inline references to fiber flags ([acdlite](https://github.com/acdlite) in [facebook#26542](facebook#26542)) * refactor[devtools]: forbid editing class instances in props ([hoxyq](https://github.com/hoxyq) in [facebook#26522](facebook#26522)) * Move update scheduling to microtask ([acdlite](https://github.com/acdlite) in [facebook#26512](facebook#26512)) * Remove unnecessary CIRCLE_CI_API_TOKEN checks ([mondaychen](https://github.com/mondaychen) in [facebook#26499](facebook#26499)) * browser extension: improve script injection logic ([mondaychen](https://github.com/mondaychen) in [facebook#26492](facebook#26492)) * [flow] make Flow suppressions explicit on the error ([kassens](https://github.com/kassens) in [facebook#26487](facebook#26487))
bigfootjon
pushed a commit
that referenced
this pull request
Apr 18, 2024
<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory. Before submitting a pull request, please make sure the following is done: 1. Fork [the repository](https://github.com/facebook/react) and create your branch from `main`. 2. Run `yarn` in the repository root. 3. If you've fixed a bug or added code that should be tested, add tests! 4. Ensure the test suite passes (`yarn test`). Tip: `yarn test --watch TestName` is helpful in development. 5. Run `yarn test --prod` to test in the production environment. It supports the same options as `yarn test`. 6. If you need a debugger, run `yarn test --debug --watch TestName`, open `chrome://inspect`, and press "Inspect". 7. Format your code with [prettier](https://github.com/prettier/prettier) (`yarn prettier`). 8. Make sure your code lints (`yarn lint`). Tip: `yarn linc` to only check changed files. 9. Run the [Flow](https://flowtype.org/) type checks (`yarn flow`). 10. If you haven't already, complete the CLA. Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html --> ## Summary Addresses #26352. This PR explicitly passes an icon to `chrome.devtools.panels.create()`, so that edge devtools will display the icon when in [Focus Mode](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/experimental-features/focus-mode). <!-- Explain the **motivation** for making this change. What existing problem does the pull request solve? --> ## How did you test this change? Passing test suite (`yarn test` & `yarn test --prod`) ✅ Passing lint (`yarn linc`) ✅ Passing type checks (`yarn flow`) ✅ **Visual Testing** Before Changes | After Changes :-------------------------:|:-------------------------:  |  <!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. How exactly did you verify that your PR solves the issue you wanted to solve? If you leave this empty, your PR will very likely be closed. --> DiffTrain build for commit 5426af3.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Addresses #26352.
This PR explicitly passes an icon to
chrome.devtools.panels.create(), so that edge devtools will display the icon when in Focus Mode.How did you test this change?
Passing test suite (
yarn test&yarn test --prod) ✅Passing lint (
yarn linc) ✅Passing type checks (
yarn flow) ✅Visual Testing