Directory

Interactivity API: Include `preact/debug` when `WP_DEVELOPMENT_MODE` is enabled. · Issue #59829 · WordPress/gutenberg · GitHub
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

Interactivity API: Include preact/debug when WP_DEVELOPMENT_MODE is enabled. #59829

Closed
t-hamano opened this issue Mar 13, 2024 · 1 comment · Fixed by #60514
Closed

Interactivity API: Include preact/debug when WP_DEVELOPMENT_MODE is enabled. #59829

t-hamano opened this issue Mar 13, 2024 · 1 comment · Fixed by #60514
Assignees
Labels
Developer Experience Ideas about improving block and theme developer experience [Feature] Interactivity API API to add frontend interactivity to blocks. Needs Dev Ready for, and needs developer efforts [Packages] Interactivity /packages/interactivity [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.

Comments

@t-hamano
Copy link
Contributor

What problem does this address?

When I attended a developer hours regarding the Interactivity API, I saw a participant ask if they had access to developer tools for debugging.

What is your proposed solution?

I temporarily made the following changes and was able to confirm that Preact Devtools worked on the front end.

diff --git a/packages/interactivity/src/init.js b/packages/interactivity/src/init.js
index fb510a9c00..79df6745d0 100644
--- a/packages/interactivity/src/init.js
+++ b/packages/interactivity/src/init.js
@@ -1,6 +1,7 @@
 /**
  * External dependencies
  */
+import 'preact/debug';
 import { hydrate } from 'preact';
 /**
  * Internal dependencies

image

Perhaps we need to detect whether a project is in development mode or not, but I think this tool will be useful to developers.

@t-hamano t-hamano added [Type] Enhancement A suggestion for improvement. Developer Experience Ideas about improving block and theme developer experience [Packages] Interactivity /packages/interactivity labels Mar 13, 2024
@gziolo gziolo added the [Feature] Interactivity API API to add frontend interactivity to blocks. label Mar 15, 2024
@cbravobernal
Copy link
Contributor

Yep. But we will still need to make extra adjustments. At least, we should name the Directives component with each directive, so that way we don't have a huge list of Directives component 😅

@cbravobernal cbravobernal changed the title Interactivity: Enable debugging Interactivity API: Include preact/debug when WP_DEVELOPMENT_MODE is enabled. Mar 20, 2024
@gziolo gziolo added the Needs Dev Ready for, and needs developer efforts label Mar 26, 2024
@DAreRodz DAreRodz self-assigned this Apr 5, 2024
@github-actions github-actions bot added the [Status] In Progress Tracking issues with work in progress label Apr 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Developer Experience Ideas about improving block and theme developer experience [Feature] Interactivity API API to add frontend interactivity to blocks. Needs Dev Ready for, and needs developer efforts [Packages] Interactivity /packages/interactivity [Status] In Progress Tracking issues with work in progress [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants