Ruslan Lesiutin
8269d55d23
chore[react-devtools]: add global for native and use it to fork backend implementation ( #30533 )
...
Adding `__IS_NATIVE__` global, which will be used for forking backend
implementation. Will only be set to `true` for `react-devtools-core`
package, which is used by `react-native`.
Ideally, we should name it `react-devtools-native`, and keep
`react-devtools-core` as host-agnostic.
With this change, the next release of `react-devtools-core` should
append component stack as Error object, not as string, and should add
`(<anonymous>)` suffix to component stack frames.
2024-08-02 10:51:15 +01:00
Sebastian Markbåge
491a4eacce
[DevTools] Print component stacks as error objects to get source mapping ( #30289 )
...
Before:
<img width="844" alt="Screenshot 2024-07-04 at 3 20 34 PM"
src="https://github.com/facebook/react/assets/63648/0fd8a53f-538a-4429-a4cf-c22f85a09aa8 ">
After:
<img width="845" alt="Screenshot 2024-07-05 at 6 08 28 PM"
src="https://github.com/facebook/react/assets/63648/7b9da13a-fa97-4581-9899-06de6fface65 ">
Firefox:
<img width="1338" alt="Screenshot 2024-07-05 at 6 09 50 PM"
src="https://github.com/facebook/react/assets/63648/f2eb9f2a-2251-408f-86d0-b081279ba378 ">
The first log doesn't get a stack because it's logged before DevTools
boots up and connects which is unfortunate.
The second log already has a stack printed by React (this is on stable)
it gets replaced by our object now.
The third and following logs don't have a stack and get one appended.
I only turn the stack into an error object if it matches what we would
emit from DevTools anyway. Otherwise we assume it's not React. Since I
had to change the format slightly to make this work, I first normalize
the stack slightly before doing a comparison since it won't be 1:1.
2024-07-08 18:42:58 -04:00
Ruslan Lesiutin
572ded3762
React DevTools 5.3.0 -> 5.3.1 ( #30199 )
...
## Summary
Full list of changes, mostly fixes:
* chore[react-devtools/renderer]: dont show strict mode warning for prod
renderer builds ([hoxyq](https://github.com/hoxyq ) in
[#30158 ](https://github.com/facebook/react/pull/30158 ))
* chore[react-devtools/ui]: fix strict mode badge styles
([hoxyq](https://github.com/hoxyq ) in
[#30159 ](https://github.com/facebook/react/pull/30159 ))
* fix[react-devtools]: restore original args when recording errors
([hoxyq](https://github.com/hoxyq ) in
[#30091 ](https://github.com/facebook/react/pull/30091 ))
* Read constructor name more carefully
([LoganDark](https://github.com/LoganDark ) in
[#29954 ](https://github.com/facebook/react/pull/29954 ))
* refactor[react-devtools/extensions]: dont debounce cleanup logic on
navigation ([hoxyq](https://github.com/hoxyq ) in
[#30027 ](https://github.com/facebook/react/pull/30027 ))
* lint: enable reportUnusedDisableDirectives and remove unused
suppressions ([kassens](https://github.com/kassens ) in
[#28721 ](https://github.com/facebook/react/pull/28721 ))
* fix[react-devtools/extensions]: propagate globals from env
([hoxyq](https://github.com/hoxyq ) in
[#29963 ](https://github.com/facebook/react/pull/29963 ))
* refactor[react-devtools/tests]: use registered marks instead of
cleared in tests ([hoxyq](https://github.com/hoxyq ) in
[#29929 ](https://github.com/facebook/react/pull/29929 ))
2024-07-03 11:46:46 +01:00
Ruslan Lesiutin
1434af3d22
React DevTools 5.2.0 -> 5.3.0 ( #29918 )
...
Full list of changes:
* chore[react-devtools]: improve console arguments formatting before
passing it to original console ([hoxyq](https://github.com/hoxyq ) in
[#29873 ](https://github.com/facebook/react/pull/29873 ))
* chore[react-devtools]: unify console patching and default to ansi
escape symbols ([hoxyq](https://github.com/hoxyq ) in
[#29869 ](https://github.com/facebook/react/pull/29869 ))
* chore[react-devtools/backend]: remove
consoleManagedByDevToolsDuringStrictMode
([hoxyq](https://github.com/hoxyq ) in
[#29856 ](https://github.com/facebook/react/pull/29856 ))
* chore[react-devtools/extensions]: make source maps url relative
([hoxyq](https://github.com/hoxyq ) in
[#29886 ](https://github.com/facebook/react/pull/29886 ))
* fix[react-devtools] divided inspecting elements between inspecting do…
([vzaidman](https://github.com/vzaidman ) in
[#29885 ](https://github.com/facebook/react/pull/29885 ))
* [Fiber] Create virtual Fiber when an error occurs during reconcilation
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29804 ](https://github.com/facebook/react/pull/29804 ))
* fix[react-devtools] component badge in light mode is now not invisible
([vzaidman](https://github.com/vzaidman ) in
[#29852 ](https://github.com/facebook/react/pull/29852 ))
* Remove Warning: prefix and toString on console Arguments
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29839 ](https://github.com/facebook/react/pull/29839 ))
* Add jest lint rules ([rickhanlonii](https://github.com/rickhanlonii )
in [#29760 ](https://github.com/facebook/react/pull/29760 ))
* [Fiber] Track the Real Fiber for Key Warnings
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29791 ](https://github.com/facebook/react/pull/29791 ))
* fix[react-devtools/store-test]: fork the test to represent current be…
([hoxyq](https://github.com/hoxyq ) in
[#29777 ](https://github.com/facebook/react/pull/29777 ))
* Default native inspections config false
([vzaidman](https://github.com/vzaidman ) in
[#29784 ](https://github.com/facebook/react/pull/29784 ))
* fix[react-devtools] remove native inspection button when it can't be
used ([vzaidman](https://github.com/vzaidman ) in
[#29779 ](https://github.com/facebook/react/pull/29779 ))
* chore[react-devtools]: ip => internal-ip
([hoxyq](https://github.com/hoxyq ) in
[#29772 ](https://github.com/facebook/react/pull/29772 ))
* Fix #29724 : `ip` dependency update for CVE-2024-29415
([Rekl0w](https://github.com/Rekl0w ) in
[#29725 ](https://github.com/facebook/react/pull/29725 ))
* cleanup[react-devtools]: remove unused supportsProfiling flag from
store config ([hoxyq](https://github.com/hoxyq ) in
[#29193 ](https://github.com/facebook/react/pull/29193 ))
* [Fiber] Enable Native console.createTask Stacks When Available
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29223 ](https://github.com/facebook/react/pull/29223 ))
* Move createElement/JSX Warnings into the Renderer
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29088 ](https://github.com/facebook/react/pull/29088 ))
* Set the current fiber to the source of the error during error
reporting ([sebmarkbage](https://github.com/sebmarkbage ) in
[#29044 ](https://github.com/facebook/react/pull/29044 ))
* Unify ReactFiberCurrentOwner and ReactCurrentFiber
([sebmarkbage](https://github.com/sebmarkbage ) in
[#29038 ](https://github.com/facebook/react/pull/29038 ))
* Dim `console` calls on additional Effect invocations due to
`StrictMode` ([eps1lon](https://github.com/eps1lon ) in
[#29007 ](https://github.com/facebook/react/pull/29007 ))
* refactor[react-devtools]: rewrite context menus
([hoxyq](https://github.com/hoxyq ) in
[#29049 ](https://github.com/facebook/react/pull/29049 ))
2024-06-18 12:12:27 +01:00
Ruslan Lesiutin
ff6e05a705
chore[react-devtools]: unify console patching and default to ansi escape symbols ( #29869 )
...
Stacked on https://github.com/facebook/react/pull/29856 .
## Summary
By default, React DevTools will apply dimming with ANSI escape symbols,
so it works for both terminals and browser consoles.
For Firefox, which doesn't support ANSI escape symbols console stylings,
we fallback to css properties, like we used to do before.
## How did you test this change?
| Environment | Dark mode | Light mode |
|--------|--------|--------|
| Terminal | 
| 
|
| Fusebox console | 
| 
|
| Firefox console | 
| 
|
| Chrome console | 
| 
|
2024-06-17 16:31:36 +01:00
Vitali Zaidman
d9a5b6393a
fix[react-devtools] divided inspecting elements between inspecting do… ( #29885 )
...
# **before**
* nav to dom element from devtools
* nav to devtools element from page
are enabled on extension and disabled on the rest of the flavors.
## extension:
* nav to dom element from devtools **enabled** and working
* nav to devtools element from page **enabled** and working

## inline:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **disabled**

## standalone:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **disabled**

## fusebox:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **disabled**

# **after**
same:
* nav to dom element from devtools
* nav to devtools element from page
are enabled on extension and disabled on inline.
change:
standalone and fusebox can nav to devtools element from page
## extension:
* nav to dom element from devtools **enabled** and working
* nav to devtools element from page **enabled** and working

## inline:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **disabled**

## standalone:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **enabled** and working

## fusebox:
* nav to dom element from devtools **disabled**
* nav to devtools element from page **enabled** and working

2024-06-13 15:37:51 +01:00
Vitali Zaidman
fd6e130b00
Default native inspections config false ( #29784 )
...
## Summary
To make the config `supportsNativeInspection` explicit, set it to
default to `false` and only allow it in the extension.
## How did you test this change?
When disabled on **React DevTools extension**
<img width="419" alt="Screenshot 2024-06-06 at 17 34 02"
src="https://github.com/facebook/react/assets/5188459/0052b645-2214-475c-8b41-4f9207ca3343 ">
When enabled on **React DevTools extension** (the chosen config)
<img width="425" alt="Screenshot 2024-06-06 at 17 34 53"
src="https://github.com/facebook/react/assets/5188459/df34ec8e-2039-4984-86c8-74feaf89bbdd ">
When enabled on **React DevTools in Fusebox**
<img width="1170" alt="Screenshot 2024-06-06 at 17 29 24"
src="https://github.com/facebook/react/assets/5188459/ae52274b-583d-463c-8482-2323d502f4c0 ">
When disabled on **React DevTools in Fusebox** (the chosen config)
<img width="1453" alt="Screenshot 2024-06-06 at 17 30 31"
src="https://github.com/facebook/react/assets/5188459/cba5b51b-c973-412d-8ad0-382a4f9bf115 ">
When enabled on **React DevTools Inline**
<img width="915" alt="Screenshot 2024-06-06 at 17 24 20"
src="https://github.com/facebook/react/assets/5188459/f0d61d99-2b75-4a87-a19e-db431be697e3 ">
When disabled on **React DevTools Inline** (the chosen config)
<img width="844" alt="Screenshot 2024-06-06 at 17 19 39"
src="https://github.com/facebook/react/assets/5188459/d3bcc8a7-535d-4656-844d-f9f89bb2b248 ">
When enabled on **React DevTools standalone**
<img width="1227" alt="Screenshot 2024-06-06 at 17 23 16"
src="https://github.com/facebook/react/assets/5188459/174fbae6-1412-4539-bbe6-e1d0e8baa7d5 ">
When disabled on **React DevTools standalone** (the chosen config)
<img width="844" alt="Screenshot 2024-06-06 at 17 19 39"
src="https://github.com/facebook/react/assets/5188459/00c46907-e3a6-4766-a1b4-dd088cac2157 ">
2024-06-06 17:48:44 +01:00
Vitali Zaidman
99da76f23a
fix[react-devtools] remove native inspection button when it can't be used ( #29779 )
...
## Summary
There's no native inspection available in any of the React-Native
devtools:
* **React DevTools in Fusebox**
* **React DevTools standalone**
Besides, **React DevTools Inline** can't really open the devtools and
point to the native inspector because of lack of an API to do that.
Only **React DevTools extension** can actually do that.
That's why I've disabled it for the first 3 flavours of React DevTools
mentioned above.
## How did you test this change?
Still enabled on **React DevTools extension**
<img width="1355" alt="Screenshot 2024-06-06 at 16 09 21"
src="https://github.com/facebook/react/assets/5188459/a9b658a6-eafe-443c-9298-280bb9f4ed72 ">
Disabled on **React DevTools in Fusebox**
<img width="1670" alt="Screenshot 2024-06-06 at 16 04 28"
src="https://github.com/facebook/react/assets/5188459/a2ded76f-2aaf-47ce-b581-611494ca33bd ">
Disabled on **React DevTools standalone**
<img width="1268" alt="Screenshot 2024-06-06 at 16 15 08"
src="https://github.com/facebook/react/assets/5188459/eb2f308d-32cb-43ea-921b-3503aa874d64 ">
Disabled on **React DevTools Inline**
<img width="1206" alt="Screenshot 2024-06-06 at 16 09 26"
src="https://github.com/facebook/react/assets/5188459/03da741a-66bf-4414-91f7-2f344c78a880 ">
2024-06-06 17:10:40 +01:00
Ruslan Lesiutin
1717ab0171
React DevTools 5.1.0 -> 5.2.0 ( #29022 )
...
Full list of changes (not a public changelog):
* fix[react-devtools/ci]: fix configurations for e2e testing
([hoxyq](https://github.com/hoxyq ) in
[#29016 ](https://github.com/facebook/react/pull/29016 ))
* feat[react-devtools]: display forget badge for components in profiling
session ([hoxyq](https://github.com/hoxyq ) in
[#29014 ](https://github.com/facebook/react/pull/29014 ))
* fix[react-devtools]: add backwards compat with legacy element type
symbol ([hoxyq](https://github.com/hoxyq ) in
[#28982 ](https://github.com/facebook/react/pull/28982 ))
* Expose "view source" options to Fusebox integration
([motiz88](https://github.com/motiz88 ) in
[#28973 ](https://github.com/facebook/react/pull/28973 ))
* Enable inspected element context menu in Fusebox
([motiz88](https://github.com/motiz88 ) in
[#28972 ](https://github.com/facebook/react/pull/28972 ))
* Check in `frontend.d.ts` for react-devtools-fusebox, include in build
output ([motiz88](https://github.com/motiz88 ) in
[#28970 ](https://github.com/facebook/react/pull/28970 ))
* Devtools: Fix build-for-devtools
([eps1lon](https://github.com/eps1lon ) in
[#28976 ](https://github.com/facebook/react/pull/28976 ))
* Move useMemoCache hook to react/compiler-runtime
([kassens](https://github.com/kassens ) in
[#28954 ](https://github.com/facebook/react/pull/28954 ))
* warn -> error for Test Renderer deprecation
([acdlite](https://github.com/acdlite ) in
[#28904 ](https://github.com/facebook/react/pull/28904 ))
* [react-dom] move all client code to `react-dom/client`
([gnoff](https://github.com/gnoff ) in
[#28271 ](https://github.com/facebook/react/pull/28271 ))
* Rename the react.element symbol to react.transitional.element
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28813 ](https://github.com/facebook/react/pull/28813 ))
* Rename Forget badge ([jbonta](https://github.com/jbonta ) in
[#28858 ](https://github.com/facebook/react/pull/28858 ))
* Devtools: Add support for useFormStatus
([eps1lon](https://github.com/eps1lon ) in
[#28413 ](https://github.com/facebook/react/pull/28413 ))
2024-05-08 13:26:14 +01:00
Ruslan Lesiutin
2d128ff041
React DevTools 5.0.2 -> 5.1.0 ( #28840 )
...
Full list of changes:
* Look for a ReactMemoCacheSentinel on state
([gsathya](https://github.com/gsathya ) in
[#28831 ](https://github.com/facebook/react/pull/28831 ))
* Use use() in the Cache if available
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28793 ](https://github.com/facebook/react/pull/28793 ))
* feat[devtools-fusebox]: support theme option
([hoxyq](https://github.com/hoxyq ) in
[#28832 ](https://github.com/facebook/react/pull/28832 ))
* feat[devtools]: add package for fusebox integration
([hoxyq](https://github.com/hoxyq ) in
[#28553 ](https://github.com/facebook/react/pull/28553 ))
* feat[devtools]: add method for connecting backend with custom
messaging protocol ([hoxyq](https://github.com/hoxyq ) in
[#28552 ](https://github.com/facebook/react/pull/28552 ))
* Rename SECRET INTERNALS to
`__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE`
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28789 ](https://github.com/facebook/react/pull/28789 ))
* Flatten ReactSharedInternals
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28783 ](https://github.com/facebook/react/pull/28783 ))
* feat[devtools]: ship source maps for content scripts and ignore list
installHook script ([hoxyq](https://github.com/hoxyq ) in
[#28730 ](https://github.com/facebook/react/pull/28730 ))
* Track Owner for Server Components in DEV
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28753 ](https://github.com/facebook/react/pull/28753 ))
* Move ReactDOMLegacy implementation into RootFB
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28656 ](https://github.com/facebook/react/pull/28656 ))
* Reland #28672 : Remove IndeterminateComponent
([gnoff](https://github.com/gnoff ) in
[#28681 ](https://github.com/facebook/react/pull/28681 ))
* Remove reference to deleted <Cache> in un-linted file
([josephsavona](https://github.com/josephsavona ) in
[#28715 ](https://github.com/facebook/react/pull/28715 ))
* [be] Remove unshipped experimental <Cache> element type
([josephsavona](https://github.com/josephsavona ) in
[#28698 ](https://github.com/facebook/react/pull/28698 ))
* Revert "Remove module pattern function component support"
([rickhanlonii](https://github.com/rickhanlonii ) in
[#28670 ](https://github.com/facebook/react/pull/28670 ))
* Remove module pattern function component support
([gnoff](https://github.com/gnoff ) in
[#27742 ](https://github.com/facebook/react/pull/27742 ))
* [RTR] Enable warning flag ([jackpope](https://github.com/jackpope ) in
[#28419 ](https://github.com/facebook/react/pull/28419 ))
* Update error messages ([rickhanlonii](https://github.com/rickhanlonii )
in [#28652 ](https://github.com/facebook/react/pull/28652 ))
* fix[devtools/ci]: split profiling cache test for different react
versions and toEqual checker ([hoxyq](https://github.com/hoxyq ) in
[#28628 ](https://github.com/facebook/react/pull/28628 ))
* Guard against legacy context not being supported in DevTools fixture
([eps1lon](https://github.com/eps1lon ) in
[#28596 ](https://github.com/facebook/react/pull/28596 ))
* Use `declare const` instead of `declare var`
([kassens](https://github.com/kassens ) in
[#28599 ](https://github.com/facebook/react/pull/28599 ))
* Update isConcurrent RTR option usage
([jackpope](https://github.com/jackpope ) in
[#28546 ](https://github.com/facebook/react/pull/28546 ))
* Disable legacy context ([kassens](https://github.com/kassens ) in
[#27991 ](https://github.com/facebook/react/pull/27991 ))
* Remove invokeGuardedCallback and replay trick
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28515 ](https://github.com/facebook/react/pull/28515 ))
* Remove remaining usages of ReactTestUtils in tests unrelated to
`react-dom/test-util` ([eps1lon](https://github.com/eps1lon ) in
[#28534 ](https://github.com/facebook/react/pull/28534 ))
* fix[devtools/e2e]: fixed source inspection in e2e tests
([hoxyq](https://github.com/hoxyq ) in
[#28518 ](https://github.com/facebook/react/pull/28518 ))
* Devtools: Display actual pending state when inspecting `useTransition`
([eps1lon](https://github.com/eps1lon ) in
[#28499 ](https://github.com/facebook/react/pull/28499 ))
2024-04-15 14:56:57 +01:00
Ruslan Lesiutin
d012a32f84
feat[devtools]: add method for connecting backend with custom messaging protocol ( #28552 )
...
## Summary
RDT backend will now expose method `connectWithCustomMessagingProtocol`,
which will be similar to the classic `connectToDevTools` one, but with
few differences:
1. It delegates the communication management between frontend and
backend to the owner (whos injecting RDT backend). Unlike the
`connectToDevTools`, which is relying on websocket connection and
receives host and port as an arguments.
2. It returns a callback, which can be used for unsubscribing the
current backend instance from the global DevTools hook.
This is a prerequisite for any non-browser RDT integration, which is not
designed to be based on websocket.
2024-04-12 15:17:07 +01:00
Ruslan Lesiutin
966d17483c
React DevTools 5.0.1 -> 5.0.2 ( #28496 )
...
* feat[devtools]: symbolicate source for inspected element
([hoxyq](https://github.com/hoxyq ) in
[#28471 ](https://github.com/facebook/react/pull/28471 ))
* refactor[devtools]: lazily define source for fiber based on component
stacks ([hoxyq](https://github.com/hoxyq ) in
[#28351 ](https://github.com/facebook/react/pull/28351 ))
* fix[devtools/tree/element]: onClick -> onMouseDown to handle first
click correctly ([hoxyq](https://github.com/hoxyq ) in
[#28486 ](https://github.com/facebook/react/pull/28486 ))
* [DOM] disable legacy mode behind flag
([gnoff](https://github.com/gnoff ) in
[#28468 ](https://github.com/facebook/react/pull/28468 ))
* Fix Broken Links In Documentation
([justindhillon](https://github.com/justindhillon ) in
[#28321 ](https://github.com/facebook/react/pull/28321 ))
* Update /link URLs to react.dev
([rickhanlonii](https://github.com/rickhanlonii ) in
[#28477 ](https://github.com/facebook/react/pull/28477 ))
* [tests] add support for @gate pragma
([gnoff](https://github.com/gnoff ) in
[#28479 ](https://github.com/facebook/react/pull/28479 ))
* Devtools: Unwrap Promise in useFormState
([eps1lon](https://github.com/eps1lon ) in
[#28319 ](https://github.com/facebook/react/pull/28319 ))
* Add support for rendering BigInt
([eps1lon](https://github.com/eps1lon ) in
[#24580 ](https://github.com/facebook/react/pull/24580 ))
* Include server component names in the componentStack in DEV
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28415 ](https://github.com/facebook/react/pull/28415 ))
2024-03-05 14:11:30 +00:00
Ruslan Lesiutin
e5287287aa
feat[devtools]: symbolicate source for inspected element ( #28471 )
...
Stacked on https://github.com/facebook/react/pull/28351 , please review
only the last commit.
Top-level description of the approach:
1. Once user selects an element from the tree, frontend asks backend to
return the inspected element, this is where we simulate an error
happening in `render` function of the component and then we parse the
error stack. As an improvement, we should probably migrate from custom
implementation of error stack parser to `error-stack-parser` from npm.
2. When frontend receives the inspected element and this object is being
propagated, we create a Promise for symbolicated source, which is then
passed down to all components, which are using `source`.
3. These components use `use` hook for this promise and are wrapped in
Suspense.
Caching:
1. For browser extension, we cache Promises based on requested resource
+ key + column, also added use of
`chrome.devtools.inspectedWindow.getResource` API.
2. For standalone case (RN), we cache based on requested resource url,
we cache the content of it.
2024-03-05 12:32:11 +00:00
Ruslan Lesiutin
61bd00498d
refactor[devtools]: lazily define source for fiber based on component stacks ( #28351 )
...
`_debugSource` was removed in
https://github.com/facebook/react/pull/28265 .
This PR migrates DevTools to define `source` for Fiber based on
component stacks. This will be done lazily for inspected elements, once
user clicks on the element in the tree.
`DevToolsComponentStackFrame.js` was just copy-pasted from the
implementation in `ReactComponentStackFrame`.
Symbolication part is done in
https://github.com/facebook/react/pull/28471 and stacked on this commit.
2024-03-05 12:10:36 +00:00
Ruslan Lesiutin
288cf747c9
React DevTools 5.0.0 -> 5.0.1 ( #28418 )
...
Full list of changes (not a public CHANGELOG):
* feature[REMOVED][devtools]: turn off / hide location based component
filters ([hoxyq](https://github.com/hoxyq ) in
[#28417 ](https://github.com/facebook/react/pull/28417 ))
* Add useSyncExternalStore and useTransition to getPrimitiveStackCache
([jamesbvaughan](https://github.com/jamesbvaughan ) in
[#28399 ](https://github.com/facebook/react/pull/28399 ))
* chore[devtools]: use react-window from npm and bump
react-virtualized-auto-sizer to ^1.0.23
([hoxyq](https://github.com/hoxyq ) in
[#28408 ](https://github.com/facebook/react/pull/28408 ))
* Pass ref as normal prop ([acdlite](https://github.com/acdlite ) in
[#28348 ](https://github.com/facebook/react/pull/28348 ))
* Combine createElement and JSX modules
([acdlite](https://github.com/acdlite ) in
[#28320 ](https://github.com/facebook/react/pull/28320 ))
* [Debug Tools] Always use includeHooksSource option
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28309 ](https://github.com/facebook/react/pull/28309 ))
* Revert "[Tests] Reset modules by default"
([acdlite](https://github.com/acdlite ) in
[#28318 ](https://github.com/facebook/react/pull/28318 ))
* Switch <Context> to mean <Context.Provider>
([gaearon](https://github.com/gaearon ) in
[#28226 ](https://github.com/facebook/react/pull/28226 ))
* [Debug Tools] Introspect Promises in use()
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28297 ](https://github.com/facebook/react/pull/28297 ))
* fix[devtools/useModalDismissSignal]: use getRootNode for shadow root
case support ([hoxyq](https://github.com/hoxyq ) in
[#28145 ](https://github.com/facebook/react/pull/28145 ))
* fix: define IS_ACT_ENVIRONMENT global for tests with concurrent mode
and synchronous act ([hoxyq](https://github.com/hoxyq ) in
[#28296 ](https://github.com/facebook/react/pull/28296 ))
* chore: gate legacy apis for react-devtools-shell
([hoxyq](https://github.com/hoxyq ) in
[#28273 ](https://github.com/facebook/react/pull/28273 ))
* DevTools: Add support for use(Context)
([eps1lon](https://github.com/eps1lon ) in
[#28233 ](https://github.com/facebook/react/pull/28233 ))
* Remove __self and __source location from elements
([sebmarkbage](https://github.com/sebmarkbage ) in
[#28265 ](https://github.com/facebook/react/pull/28265 ))
* chore: use versioned render in inspectedElement test
([hoxyq](https://github.com/hoxyq ) in
[#28246 ](https://github.com/facebook/react/pull/28246 ))
* chore: use versioned render in TimelineProfiler test and gate some for
legacy rendering ([hoxyq](https://github.com/hoxyq ) in
[#28218 ](https://github.com/facebook/react/pull/28218 ))
* [Tests] Reset modules by default
([rickhanlonii](https://github.com/rickhanlonii ) in
[#28254 ](https://github.com/facebook/react/pull/28254 ))
* chore: use versioned render in preprocessData test and gate some for …
([hoxyq](https://github.com/hoxyq ) in
[#28219 ](https://github.com/facebook/react/pull/28219 ))
* chore: use versioned render in storeStressSync test and gate them for
legacy rendering ([hoxyq](https://github.com/hoxyq ) in
[#28216 ](https://github.com/facebook/react/pull/28216 ))
* Patch devtools before running useMemo function in strict mode
([gsathya](https://github.com/gsathya ) in
[#28249 ](https://github.com/facebook/react/pull/28249 ))
* chore: use versioned render in storeComponentFilters test
([hoxyq](https://github.com/hoxyq ) in
[#28241 ](https://github.com/facebook/react/pull/28241 ))
* chore: use versioned render in profilerContext test
([hoxyq](https://github.com/hoxyq ) in
[#28243 ](https://github.com/facebook/react/pull/28243 ))
* chore: use versioned render in profilingCommitTreeBuilder test and
gate some for legacy rendering ([hoxyq](https://github.com/hoxyq ) in
[#28236 ](https://github.com/facebook/react/pull/28236 ))
* chore: use versioned render in profilingHostRoot test and gate some
for legacy rendering ([hoxyq](https://github.com/hoxyq ) in
[#28237 ](https://github.com/facebook/react/pull/28237 ))
* chore: use versioned render in profilingCache test
([hoxyq](https://github.com/hoxyq ) in
[#28242 ](https://github.com/facebook/react/pull/28242 ))
* chore: use versioned render in ownersListContext test
([hoxyq](https://github.com/hoxyq ) in
[#28240 ](https://github.com/facebook/react/pull/28240 ))
* chore: use versioned render in editing test
([hoxyq](https://github.com/hoxyq ) in
[#28239 ](https://github.com/facebook/react/pull/28239 ))
* chore: use versioned render in treeContext test
([hoxyq](https://github.com/hoxyq ) in
[#28245 ](https://github.com/facebook/react/pull/28245 ))
* chore: use versioned render in store test
([hoxyq](https://github.com/hoxyq ) in
[#28244 ](https://github.com/facebook/react/pull/28244 ))
* chore: use versioned render in profilerStore test
([hoxyq](https://github.com/hoxyq ) in
[#28238 ](https://github.com/facebook/react/pull/28238 ))
* chore: use versioned render in profilingCharts test
([hoxyq](https://github.com/hoxyq ) in
[#28235 ](https://github.com/facebook/react/pull/28235 ))
* chore: use versioned render in profilerChangeDescriptions test
([hoxyq](https://github.com/hoxyq ) in
[#28221 ](https://github.com/facebook/react/pull/28221 ))
* chore: use versioned render in storeOwners test
([hoxyq](https://github.com/hoxyq ) in
[#28215 ](https://github.com/facebook/react/pull/28215 ))
* chore: use versioned render in componentStacks test
([hoxyq](https://github.com/hoxyq ) in
[#28214 ](https://github.com/facebook/react/pull/28214 ))
* chore: use versioned render in console test
([hoxyq](https://github.com/hoxyq ) in
[#28213 ](https://github.com/facebook/react/pull/28213 ))
* chore: use versioned render in useEditableValue test
([hoxyq](https://github.com/hoxyq ) in
[#28212 ](https://github.com/facebook/react/pull/28212 ))
* chore: use versioned render in FastRefreshDevToolsIntegration test
([hoxyq](https://github.com/hoxyq ) in
[#28211 ](https://github.com/facebook/react/pull/28211 ))
* chore: add versioned render implementation for DevTools tests
([hoxyq](https://github.com/hoxyq ) in
[#28210 ](https://github.com/facebook/react/pull/28210 ))
* chore: add single versioned implementation of act for DevTools tests
([hoxyq](https://github.com/hoxyq ) in
[#28186 ](https://github.com/facebook/react/pull/28186 ))
* DevTools: Add support for useFormState
([eps1lon](https://github.com/eps1lon ) in
[#28232 ](https://github.com/facebook/react/pull/28232 ))
* DevTools: Add support for useOptimistic Hook
([eps1lon](https://github.com/eps1lon ) in
[#27982 ](https://github.com/facebook/react/pull/27982 ))
* Add stable React.act export ([acdlite](https://github.com/acdlite ) in
[#28160 ](https://github.com/facebook/react/pull/28160 ))
* [flow] upgrade to 0.225.1 ([kassens](https://github.com/kassens ) in
[#27871 ](https://github.com/facebook/react/pull/27871 ))
* fix[devtools/e2e]: add fallback for act in integration tests
([hoxyq](https://github.com/hoxyq ) in
[#27842 ](https://github.com/facebook/react/pull/27842 ))
* Add stable concurrent option to react-test-renderer
([jackpope](https://github.com/jackpope ) in
[#27804 ](https://github.com/facebook/react/pull/27804 ))
* Update act references in tests ([gnoff](https://github.com/gnoff ) in
[#27805 ](https://github.com/facebook/react/pull/27805 ))
* Flow: make more objects exact ([kassens](https://github.com/kassens )
in [#27790 ](https://github.com/facebook/react/pull/27790 ))
2024-02-22 19:45:55 +00:00
Jan Kassens
f498aa2992
Flow: make more objects exact ( #27790 )
...
This makes a couple objects more exact. Nothing critical, just noticed
this old branch I had created when doing some Flow upgrades in the past.
2023-12-04 16:10:36 -05:00
Ruslan Lesiutin
87cb0bf182
React DevTools 4.28.5 -> 5.0.0 ( #27759 )
...
### Breaking
* refactor[devtools]: highlight an array of elements for native
([hoxyq](https://github.com/hoxyq ) in
[#27734 ](https://github.com/facebook/react/pull/27734 ))
### Features
* feat[devtools]: display Forget badge for the relevant components
([hoxyq](https://github.com/hoxyq ) in
[#27709 ](https://github.com/facebook/react/pull/27709 ))
### Other
* Added windows powershell syntax to build scripts
([PrathamLalwani](https://github.com/PrathamLalwani ) in
[#27692 ](https://github.com/facebook/react/pull/27692 ))
* refactor[react-devtools-shared]: minor parsing improvements and
modifications ([hoxyq](https://github.com/hoxyq ) in
[#27661 ](https://github.com/facebook/react/pull/27661 ))
2023-11-29 18:27:53 +00:00
Ruslan Lesiutin
20c91b6534
React DevTools 4.28.4 -> 4.28.5 ( #27538 )
...
Changes:
* fix[devtools/useMemoCache]: add stub for useMemoCache in
ReactDebugHook ([hoxyq](https://github.com/hoxyq ) in
[#27472 ](https://github.com/facebook/react/pull/27472 ))
* useDeferredValue should skip initialValue if it suspends
([acdlite](https://github.com/acdlite ) in
[#27509 ](https://github.com/facebook/react/pull/27509 ))
* feat[react-devtools-extensions/logging]: initialize session id on the
client for logging ([hoxyq](https://github.com/hoxyq ) in
[#27517 ](https://github.com/facebook/react/pull/27517 ))
* refactor[react-devtools-extensions]: use globals to eliminate dead
code ([hoxyq](https://github.com/hoxyq ) in
[#27516 ](https://github.com/facebook/react/pull/27516 ))
* fix[devtools/inspectElement]: dont pause initial inspectElement call
when user switches tabs ([hoxyq](https://github.com/hoxyq ) in
[#27488 ](https://github.com/facebook/react/pull/27488 ))
2023-10-18 14:08:23 +01:00
Ruslan Lesiutin
77ec61885f
fix[devtools/inspectElement]: dont pause initial inspectElement call when user switches tabs ( #27488 )
...
There are not so many changes, most of them are changing imports,
because I've moved types for UI in a single file.
In https://github.com/facebook/react/pull/27357 I've added support for
pausing polling events: when user inspects an element, we start polling
React DevTools backend for updates in props / state. If user switches
tabs, extension's service worker can be killed by browser and this
polling will start spamming errors.
What I've missed is that we also have a separate call for this API, but
which is executed only once when user selects an element. We don't
handle promise rejection here and this can lead to some errors when user
selects an element and switches tabs right after it.
The only change here is that this API now has
`shouldListenToPauseEvents` param, which is `true` for polling, so we
will pause polling once user switches tabs. It is `false` by default, so
we won't pause initial call by accident.
af8beeebf6/packages/react-devtools-shared/src/backendAPI.js (L96)
2023-10-10 18:10:17 +01:00
Ruslan Lesiutin
94d5b5b2bf
React DevTools 4.28.3 -> 4.28.4 ( #27419 )
...
* refactor[devtools/extension]: refactored messaging logic across
different parts of the extension ([hoxyq](https://github.com/hoxyq ) in
[#27417 ](https://github.com/facebook/react/pull/27417 ))
* fix[devtools/extension]: added a workaround for proxy content script
injection in firefox ([hoxyq](https://github.com/hoxyq ) in
[#27375 ](https://github.com/facebook/react/pull/27375 ))
* fix[devtools/useTransition]: don't check for dispatch property when
determining if hook is stateful ([hoxyq](https://github.com/hoxyq ) in
[#27365 ](https://github.com/facebook/react/pull/27365 ))
* feat[devtools/extension]: show disclaimer when page doesnt run react
and refactor react polling logic ([hoxyq](https://github.com/hoxyq ) in
[#27373 ](https://github.com/facebook/react/pull/27373 ))
* feat:-Added a delete all filters action and added title to the add
filter a… ([Biki-das](https://github.com/Biki-das ) in
[#27332 ](https://github.com/facebook/react/pull/27332 ))
* fix[devtools/extension]: unregister dynamically injected content
scripts instead of filtering ([hoxyq](https://github.com/hoxyq ) in
[#27369 ](https://github.com/facebook/react/pull/27369 ))
* refactor[devtools/extension]: more stable element updates polling to
avoid timed out errors ([hoxyq](https://github.com/hoxyq ) in
[#27357 ](https://github.com/facebook/react/pull/27357 ))
* feat[devtools/extension]: add dark theme for popup
([rakleed](https://github.com/rakleed ) in
[#27330 ](https://github.com/facebook/react/pull/27330 ))
2023-09-25 13:24:52 -04:00
Ruslan Lesiutin
a374287fea
React DevTools 4.28.2 -> 4.28.3 ( #27337 )
...
This is a patch version to fix some bugs in a previous internal release.
I am expecting this one also to be internal-only, need to make sure that
extension is stable in Chrome. Some changes and improvements are
expected for Firefox, though, before going public.
* refactor[devtools/extension]: handle ports disconnection, instead of
frequent reconnection ([hoxyq](https://github.com/hoxyq ) in
[#27336 ](https://github.com/facebook/react/pull/27336 ))
* refactor[devtools/extension]: migrate from using setInterval for
polling if react is loaded ([hoxyq](https://github.com/hoxyq ) in
[#27323 ](https://github.com/facebook/react/pull/27323 ))
* fix[devtools/extension]: fixed duplicating panels in firefox
([hoxyq](https://github.com/hoxyq ) in
[#27320 ](https://github.com/facebook/react/pull/27320 ))
2023-09-05 18:58:27 +01:00
Ruslan Lesiutin
3808b01b3a
React DevTools 4.28.1 -> 4.28.2 ( #27318 )
...
List of changes:
* fix[devtools/extension]: handle tab navigation events before react is
loaded ([hoxyq](https://github.com/hoxyq ) in
[#27316 ](https://github.com/facebook/react/pull/27316 ))
2023-08-30 19:47:08 +01:00
Ruslan Lesiutin
2f368725fb
React DevTools 4.28.0 -> 4.28.1 ( #27305 )
...
List of changes:
* refactor: refactored devtools browser extension scripts to improve
port management and service worker lifetime
([hoxyq](https://github.com/hoxyq ) in
[#27215 ](https://github.com/facebook/react/pull/27215 ))
* refactor[devtools/extension]: minify production builds to strip
comments ([hoxyq](https://github.com/hoxyq ) in
[#27304 ](https://github.com/facebook/react/pull/27304 ))
* fix[devtools]: allow element updates polling only if bridge is alive
([hoxyq](https://github.com/hoxyq ) in
[#27067 ](https://github.com/facebook/react/pull/27067 ))
* refactor: resolve browser via env variables based on build rather than
user agent ([hoxyq](https://github.com/hoxyq ) in
[#27179 ](https://github.com/facebook/react/pull/27179 ))
* fix[devtools/updateFiberRecursively]: mount suspense fallback set in
timed out case ([hoxyq](https://github.com/hoxyq ) in
[#27147 ](https://github.com/facebook/react/pull/27147 ))
* Feat:-Added open in editor to appear by default
([Biki-das](https://github.com/Biki-das ) in
[#26949 ](https://github.com/facebook/react/pull/26949 ))
* fix[devtools/inspect]: null check memoized props before trying to call
hasOwnProperty ([hoxyq](https://github.com/hoxyq ) in
[#27057 ](https://github.com/facebook/react/pull/27057 ))
* rename SuspenseList export to unstable_SuspenseList
([noahlemen](https://github.com/noahlemen ) in
[#27061 ](https://github.com/facebook/react/pull/27061 ))
2023-08-29 13:37:35 +01:00
Ruslan Lesiutin
035a41c4e2
React DevTools 4.27.8 -> 4.28.0 ( #27051 )
...
List of changes:
* Devtools:-Removed unused CSS ([Biki-das](https://github.com/Biki-das )
in [#27032 ](https://github.com/facebook/react/pull/27032 ))
* fix[devtools/profilingCache-test]: specify correct version gate for
test ([hoxyq](https://github.com/hoxyq ) in
[#27008 ](https://github.com/facebook/react/pull/27008 ))
* fix[devtools/ci]: fixed incorrect condition calculation for
@reactVersion annotation ([hoxyq](https://github.com/hoxyq ) in
[#26997 ](https://github.com/facebook/react/pull/26997 ))
* fix[ci]: fixed jest configuration not to skip too many devtools tests
([hoxyq](https://github.com/hoxyq ) in
[#26955 ](https://github.com/facebook/react/pull/26955 ))
* fix[devtools/standalone]: update webpack configurations
([hoxyq](https://github.com/hoxyq ) in
[#26963 ](https://github.com/facebook/react/pull/26963 ))
* fix[devtools]: check if fiber is unmounted before trying to highlight
([hoxyq](https://github.com/hoxyq ) in
[#26983 ](https://github.com/facebook/react/pull/26983 ))
* feat[devtools]: support x_google_ignoreList source maps extension
([hoxyq](https://github.com/hoxyq ) in
[#26951 ](https://github.com/facebook/react/pull/26951 ))
* chore[devtools]: upgrade to webpack v5
([hoxyq](https://github.com/hoxyq ) in
[#26887 ](https://github.com/facebook/react/pull/26887 ))
* fix[devtools]: display NaN as string in values
([hoxyq](https://github.com/hoxyq ) in
[#26947 ](https://github.com/facebook/react/pull/26947 ))
* fix: devtools cannot be closed correctly
([Jack-Works](https://github.com/Jack-Works ) in
[#25510 ](https://github.com/facebook/react/pull/25510 ))
* Fix:- Fixed dev tools inspect mode on Shadow dom
([Biki-das](https://github.com/Biki-das ) in
[#26888 ](https://github.com/facebook/react/pull/26888 ))
* Updated copyright text to Copyright (c) Meta Platforms, Inc. and its …
([denmo530](https://github.com/denmo530 ) in
[#26830 ](https://github.com/facebook/react/pull/26830 ))
* Fix strict mode badge URL ([ibrahemid](https://github.com/ibrahemid )
in [#26825 ](https://github.com/facebook/react/pull/26825 ))
2023-07-04 09:11:14 +01:00
Ruslan Lesiutin
6c84b505c7
fix[devtools/standalone]: update webpack configurations ( #26963 )
...
## Summary
Overlooked when was working on
https://github.com/facebook/react/pull/26887 .
- Added `webpack` packages as dev dependencies to `react-devtools-core`,
because it calls webpack to build
- Added `process` package as dev dependency, because it is injected with
`ProvidePlugin` (otherwise fails with Safari usage)
- Updated rule for sourcemaps
- Listed required externals for `standalone` build
Tested on RN application & Safari
2023-06-22 08:55:20 +01:00
Ruslan Lesiutin
4ddc019aca
chore[devtools]: upgrade to webpack v5 ( #26887 )
...
## Summary
- Updated `webpack` (and all related packages) to v5 in
`react-devtools-*` packages.
- I haven't touched any `TODO (Webpack 5)`. Tried to poke it, but each
my attempt failed and parsing hook names feature stopped working. I will
work on this in a separate PR.
- This work is one of prerequisites for updating Firefox extension to
manifests v3
related PRs:
https://github.com/facebook/react/pull/22267
https://github.com/facebook/react/pull/26506
## How did you test this change?
Tested on all surfaces, explicitly checked that parsing hook names
feature still works.
2023-06-14 13:15:52 +01:00
Dennis Moradkhani
4b877b6c66
Updated copyright text to Copyright (c) Meta Platforms, Inc. and its … ( #26830 )
...
…affiliates.
## Summary
There were 8 different places where the copyright comment was wrong.
Rewrote from "Copyright (c) Facebook, Inc. and its affiliates." to
"Copyright (c) Meta Platforms, Inc. and its affiliates."
## How did you test this change?
No code was changed. Comment was still a comment after changes.
Co-authored-by: Dennis Moradkhani <denmo530@student.liu.se >
2023-05-19 17:52:17 -07:00
Ruslan Lesiutin
2468a87358
React DevTools 4.27.7 -> 4.27.8 ( #26823 )
...
Closes https://github.com/facebook/react/issues/26787 ,
https://github.com/facebook/react/issues/26793
Includes these changes:
* fix[devtools]: fixed duplicated backend activation with multiple
renderers ([hoxyq](https://github.com/hoxyq ) in
[#26807 ](https://github.com/facebook/react/pull/26807 ))
2023-05-17 11:40:50 +01:00
Jan Kassens
fda1f0b902
Flow upgrade to 0.205.1 ( #26796 )
...
Just a small upgrade to keep us current and remove unused suppressions
(probably fixed by some upgrade since).
- `*` is no longer allowed and has been an alias for `any` for a while
now.
2023-05-09 10:45:50 -04:00
Ruslan Lesiutin
783e7fcfa3
React DevTools 4.27.6 -> 4.27.7 ( #26780 )
...
List of changes:
* DevTools: fix backend activation ([hoxyq](https://github.com/hoxyq ) in
[#26779 ](https://github.com/facebook/react/pull/26779 ))
* fix[dynamic-scripts-injection]: unregister content scripts before
registration ([hoxyq](https://github.com/hoxyq ) in
[#26765 ](https://github.com/facebook/react/pull/26765 ))
2023-05-04 18:22:47 +01:00
Ruslan Lesiutin
7f8c501f68
React DevTools 4.27.5 -> 4.27.6 ( #26684 )
...
Full list of changes:
* Use .slice() for all substring-ing
([sophiebits](https://github.com/sophiebits ) in
[#26677 ](https://github.com/facebook/react/pull/26677 ))
* cleanup[devtools]: remove named hooks & profiler changed hook indices
feature flags ([hoxyq](https://github.com/hoxyq ) in
[#26635 ](https://github.com/facebook/react/pull/26635 ))
* chore[devtools/release-scripts]: update messages / fixed npm view com…
([hoxyq](https://github.com/hoxyq ) in
[#26660 ](https://github.com/facebook/react/pull/26660 ))
* (patch)[DevTools] bug fix: backend injection logic not working for
undocked devtools window ([mondaychen](https://github.com/mondaychen ) in
[#26665 ](https://github.com/facebook/react/pull/26665 ))
* use backend manager to support multiple backends in extension
([mondaychen](https://github.com/mondaychen ) in
[#26615 ](https://github.com/facebook/react/pull/26615 ))
2023-04-20 13:34:25 +01:00
Ruslan Lesiutin
77d3b02e5c
React DevTools 4.27.4 -> 4.27.5 ( #26637 )
...
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 ](https://github.com/facebook/react/pull/26604 ))
* Provide icon to edge devtools.
([harrygz889](https://github.com/harrygz889 ) in
[#26543 ](https://github.com/facebook/react/pull/26543 ))
* [BE] move shared types & constants to consolidated locations
([mondaychen](https://github.com/mondaychen ) in
[#26572 ](https://github.com/facebook/react/pull/26572 ))
* remove backend dependency from the global hook
([mondaychen](https://github.com/mondaychen ) in
[#26563 ](https://github.com/facebook/react/pull/26563 ))
* Replace deprecated `new-window` with
`webContents.setWindowOpenHandler()`
([Willie-Boy](https://github.com/Willie-Boy ) in
[#26559 ](https://github.com/facebook/react/pull/26559 ))
* DevTools: Inline references to fiber flags
([acdlite](https://github.com/acdlite ) in
[#26542 ](https://github.com/facebook/react/pull/26542 ))
* refactor[devtools]: forbid editing class instances in props
([hoxyq](https://github.com/hoxyq ) in
[#26522 ](https://github.com/facebook/react/pull/26522 ))
* Move update scheduling to microtask
([acdlite](https://github.com/acdlite ) in
[#26512 ](https://github.com/facebook/react/pull/26512 ))
* Remove unnecessary CIRCLE_CI_API_TOKEN checks
([mondaychen](https://github.com/mondaychen ) in
[#26499 ](https://github.com/facebook/react/pull/26499 ))
* browser extension: improve script injection logic
([mondaychen](https://github.com/mondaychen ) in
[#26492 ](https://github.com/facebook/react/pull/26492 ))
* [flow] make Flow suppressions explicit on the error
([kassens](https://github.com/kassens ) in
[#26487 ](https://github.com/facebook/react/pull/26487 ))
2023-04-17 17:42:02 +01:00
Mengdi Chen
451736b557
[DevTools][BE] move shared types & constants to consolidated locations ( #26572 )
...
## Summary
This pull request aims to improve the maintainability of the codebase by
consolidating types and constants that are shared between the backend
and frontend. This consolidation will allow us to maintain backwards
compatibility in the frontend in the future.
To achieve this, we have moved the shared types and constants to the
following blessed files:
- react-devtools-shared/src/constants
- react-devtools-shared/src/types
- react-devtools-shared/src/backend/types
- react-devtools-shared/src/backend/NativeStyleEditor/types
Please note that the inclusion of NativeStyleEditor in this list is
temporary, and we plan to remove it once we have a better plugin system
in place.
## How did you test this change?
I have tested it by running `yarn flow dom-node`, which reports no
errors.
2023-04-10 17:07:05 -04:00
Mengdi Chen
dd5365878d
[DevTools] remove backend dependency from the global hook ( #26563 )
...
## Summary
- #26234 is reverted and replaced with a better approach
- introduce a new global devtools variable to decouple the global hook's
dependency on backend/console.js, and add it to react-devtools-inline
and react-devtools-standalone
With this PR, I want to introduce a new principle to hook.js: we should
always be alert when editing this file and avoid importing from other
files.
In the past, we try to inline a lot of the implementation because we use
`.toString()` to inject this function from the extension (we still have
some old comments left). Although it is no longer inlined that way, it
has became now more important to keep it clean as it is a de facto
global API people are using (9.9K files contains it on Github search as
of today).
**File size change for extension:**
Before:
379K installHook.js
After:
21K installHook.js
363K renderer.js
2023-04-07 03:35:36 -04:00
Mengdi Chen
3fcf209ea4
React DevTools 4.27.3 -> 4.27.4 ( #26470 )
2023-03-24 15:45:26 -04:00
Mengdi Chen
8bdf162bcc
React DevTools 4.27.2 -> 4.27.3 ( #26459 )
...
bump version
2023-03-22 11:20:10 -04:00
Mengdi Chen
42106558ed
React DevTools 4.27.1 -> 4.27.2 ( #26185 )
2023-02-16 16:46:23 -05:00
Jan Kassens
6ddcbd4f96
[flow] enable LTI inference mode ( #26104 )
...
This is the next generation inference mode for Flow.
2023-02-09 17:07:39 -05:00
Xin Chen
758fc7fde1
Support highlights for React Native apps in dev tools ( #26060 )
...
<!--
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 debug-test --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
<!--
Explain the **motivation** for making this change. What existing problem
does the pull request solve?
-->
This pull request emit the trace update events `drawTraceUpdates` with
the trace frame information when the trace update drawer runs outside of
web environment. This allows React Devtool running in mobile or other
platforms have a chance to render such highlights and provide similar
feature on web to provide re-render highlights. This is a feature needed
for identifying unnecessary re-renders.
## How did you test this change?
<!--
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.
-->
I tested this change with Flipper desktop app running against mobile
app, and verified that the event with correct array of frames are
passing through properly.
2023-02-07 14:47:05 -08:00
Jan Kassens
6b30832666
Upgrade prettier ( #26081 )
...
The old version of prettier we were using didn't support the Flow syntax
to access properties in a type using `SomeType['prop']`. This updates
`prettier` and `rollup-plugin-prettier` to the latest versions.
I added the prettier config `arrowParens: "avoid"` to reduce the diff
size as the default has changed in Prettier 2.0. The largest amount of
changes comes from function expressions now having a space. This doesn't
have an option to preserve the old behavior, so we have to update this.
2023-01-31 08:25:05 -05:00
Jan Kassens
c49131669b
Remove unused Flow suppressions ( #25977 )
...
These suppressions are no longer required.
Generated using:
```sh
flow/tool update-suppressions .
```
followed by adding back 1 or 2 suppressions that were only triggered in
some configurations.
2023-01-10 10:32:42 -05:00
Jan Kassens
0b4f443020
[flow] enable enforce_local_inference_annotations ( #25921 )
...
This setting is an incremental path to the next Flow version enforcing
type annotations on most functions (except some inline callbacks).
Used
```
node_modules/.bin/flow codemod annotate-functions-and-classes --write .
```
to add a majority of the types with some hand cleanup when for large
inferred objects that should just be `Fiber` or weird constructs
including `any`.
Suppressed the remaining issues.
Builds on #25918
2023-01-09 15:46:48 -05:00
Mengdi Chen
827cbdbcc6
React DevTools 4.27.0 -> 4.27.1 ( #25835 )
...
patch for devtools bug
2022-12-07 12:23:52 -05:00
Mengdi Chen
f197ca997b
React DevTools 4.26.1 -> 4.27.0 ( #25753 )
2022-11-30 19:14:11 -05:00
Robert Balicki
fecc288b7d
[react devtools] Device storage support ( #25452 )
...
# Summary
* This PR adds support for persisting certain settings to device
storage, allowing e.g. RN apps to properly patch the console when
restarted.
* The device storage APIs have signature `getConsolePatchSettings()` and
`setConsolePatchSettings(string)`, in iOS, are thin wrappers around the
`Library/Settings` turbomodule, and wrap a new TM that uses the `SharedPreferences` class in Android.
* Pass device storage getters/setters from RN to DevTools'
`connectToDevtools`. The setters are then used to populate values on
`window`. Later, the console is patched using these values.
* If we receive a notification from DevTools that the console patching
fields have been updated, we write values back to local storage.
* See https://github.com/facebook/react-native/pull/34903
# How did you test this change?
Manual testing, `yarn run test-build-devtools`, `yarn run prettier`,
`yarn run flow dom`
## Manual testing setup:
### React DevTools Frontend
* Get the DevTools frontend in flipper:
* `nvm install -g react-devtools-core`, then replace that package with a
symlink to the local package
* enable "use globally installed devtools" in flipper
* yarn run start in react-devtools, etc. as well
### React DevTools Backend
* `yarn run build:backend` in react-devtools-core, then copy-paste that
file to the expo app's node_modules directory
### React Native
* A local version of React Native can be patched in by modifying an expo
app's package.json, as in `"react-native":
"rbalicki2/react-native#branch-name"`
# Versioning safety
* There are three versioned modules to worry about: react native, the
devtools frontend and the devtools backend.
* The react devtools backend checks for whether a `cachedSettingsStore`
is passed from react native. If not (e.g. if React Native is outdated),
then no behavior changes.
* The devtools backend reads the patched console values from the cached
settings store. However, if nothing has been stored, for example because
the frontend is outdated or has never synced its settings, then behavior
doesn't change.
* The devtools frontend sends no new messages. However, if it did send a
new message (e.g. "store this value at this key"), and the backend was
outdated, that message would be silently ignored.
2022-10-25 13:25:33 +11:00
Andrew Clark
9cdf8a99ed
[Codemod] Update copyright header to Meta ( #25315 )
...
* Facebook -> Meta in copyright
rg --files | xargs sed -i 's#Copyright (c) Facebook, Inc. and its affiliates.#Copyright (c) Meta Platforms, Inc. and affiliates.#g'
* Manual tweaks
2022-10-18 11:19:24 -04:00
Tianyu Yao
44e2ca393e
React DevTools 4.26.0 -> 4.26.1 ( #25478 )
2022-10-14 10:36:52 -07:00
Tianyu Yao
fd31724d5d
Stop spamming highlight events when a component is selected ( #25448 )
2022-10-13 17:38:05 -07:00
Jan Kassens
9813edef29
Flow upgrade to 0.188
...
ghstack-source-id: 5c359b97cc
Pull Request resolved: https://github.com/facebook/react/pull/25423
2022-10-04 15:49:48 -04:00
Jan Kassens
3b6826ed9e
Flow: inference_mode=constrain_writes
...
This mode is going to be the new default in Flow going forward.
There was an unfortuante large number of suppressions in this update.
More on the changes can be found in this [Flow blog post](https://medium.com/flow-type/new-flow-language-rule-constrained-writes-4c70e375d190 ).
Added some of the required annotations using the provided codemod:
```sh
node_modules/.bin/flow codemod annotate-declarations --write .
```
ghstack-source-id: 0b168e1b23
Pull Request resolved: https://github.com/facebook/react/pull/25422
2022-10-04 15:49:48 -04:00