feat: use and initialize RDT Frontend in RDT panel#23
Conversation
hoxyq
force-pushed
the
react-devtools/initialize-react-devtools-frontend
branch
from
1976b59 to
a19a4ba
Compare
hoxyq
changed the title
hoxyq
force-pushed
the
react-devtools/initialize-react-devtools-frontend
branch
2 times, most recently
from
f8ecde2 to
da012d6
Compare
hoxyq
force-pushed
the
react-devtools/initialize-react-devtools-frontend
branch
2 times, most recently
from
243b4e7 to
a28a2f2
Compare
| ReactDevTools.initialize(this.contentElement, { | ||
| bridge: this.bridge, | ||
| store: this.store, | ||
| theme: usingDarkTheme ? 'dark' : 'light', |
There was a problem hiding this comment.
Nits - can be filed as followup tasks IMO:
- Is this reactive to theme changes?
- Does CDT allow the user to override the theme? Will this honour that setting?
There was a problem hiding this comment.
Is this reactive to theme changes?
Nope, it doesn't, unfortunately. I am keeping this in T185412086, because we can reuse it for browser extension.
Does CDT allow the user to override the theme? Will this honour that setting?
Yes, I've specified using dark theme in my Chrome and my Fusebox window is opened in dark mode across different reloads.
front_end/entrypoint_template.html
Outdated
| } | ||
| </style> | ||
| <meta http-equiv="Content-Security-Policy" content="object-src 'none'; script-src 'self' 'unsafe-eval' https://chrome-devtools-frontend.appspot.com"> | ||
| <meta http-equiv="Content-Security-Policy" content="worker-src 'self' blob: ; object-src 'none'; script-src 'self' 'unsafe-eval' https://chrome-devtools-frontend.appspot.com"> |
There was a problem hiding this comment.
I wish this was more self-documenting. Might be worth an explanatory comment as part of the file.
There was a problem hiding this comment.
I thought about moving this to build_entrypoints script, so only rn_fusebox.html entrypoint gets this.
Will add this tomorrow and add an explanatory comment, basically RDT frontend is using workers API for file uploads.
hoxyq
force-pushed
the
react-devtools/initialize-react-devtools-frontend
branch
from
a28a2f2 to
2cc2cc3
Compare
3 participants
Summary
Stacked on #22.
Last PR in this series of PRs. Uses
react-devtools-fuseboxas a dependency to initialize React DevTools Frontend.Loader is rendered while React DevTools is initialized:
Potential improvements, will probably add later:
catchblock in case if initialization failed, for displaying error messagern_fuseboxis updatedTest plan
Demo:
Screen.Recording.2024-04-12.at.18.24.50.mov
Upstreaming plan
devtools-frontendrepo. I've reviewed the contribution guide.