Tracking Issue: Expose the full Interactivity API in @wordpress/interactivity

[luisherranz]

• Part of Block API #41236.

In Expose the minimal Interactivity API in a public package, we exposed publicly the private and minimal version of the Interactivity API that we were using to test the Core blocks.

This new list of tasks is aimed to complete the Interactivity API publicly testable version, so it's the same full version as the one used in the block interactivity experiments repository (but without client-side navigation yet, which we'll add in a second phase).

Please, refer to the new Docs Tracking Issue to keep track of the documentation efforts.

Tasks

• Add the full Interactivity API runtime (but removing the client-side navigation)
  • Add missing directives: Interactivity API: Add missing directives and move e2e tests #51194
  • Add missing e2e tests: Interactivity API: Add missing tests for body, init and on directives #52952
  • Add missing JSDocs to the code: Interactivity API: Add JSDoc comments to the public API #52469
• Add first docs and structure (as markdown files in Gutenberg for now): Open "docs" folder for the Interactivity API package and Getting Started Guide #52462
• Add server-side rendering: Interactivity API: initial support for SSR #51229
  • Add the wp_store function: Interactivity API: add wp_store #51191
• Add defer again to all the interactive blocks (and runtime): Use defer loading strategy for frontend view scripts #52536

Discarded

• Add wp-html (decide final name and research security issues).

[luisherranz]

I'm working on the wp_store function. I'll open a PR tomorrow.

[luisherranz]

There you go:

• Interactivity API: add wp_store #51191

---

I'll start migrating the SSRing next. I'll update the Tracking Issue with more detailed tasks for that.

[DAreRodz]

I recently created a draft PR with the branch where I started working on porting the entire Interactivity API runtime (without CSN).

• Interactivity API: Add missing directives and move e2e tests #51194

So far, I moved the missing directives and all the e2e tests unrelated to the client-side navigation feature. I had to refactor the tests a little bit, and I'm not yet convinced with the current arrangement.

I think we can get rid of our fixture to serve local HTML files and use a custom plugin with compiled view.js files. There are some examples of plugins used for e2e tests in /packages/e2e-tests/plugins.

Also, I'm not compiling any js file yet, and I had to expose preact, preact/hooks and deepsignal from the runtime, as some test implementations were using them.

[luisherranz]

I'll start migrating the SSRing next.

There you go:

• Interactivity API: initial support for SSR #51229

I'll update the Tracking Issue with more detailed tasks for that.

I don't think it's necessary anymore as I did all the tasks in that PR.

[luisherranz]

Surficing this comment here. I will work on a PR to do the syntax changes from WordPress/block-interactivity-experiments#239.

Also, I added a task to the list to work on wp-html at a later point.

[luisherranz]

Done:

• Rename syntax to double hyphen and data-wp-interactive #51241

---

Let's try this order:

1. Merge the syntax changes.
2. Merge trunk with interactivity
3. Merge the server-side rendering.

[luisherranz]

Ok, those are merged and I also merged trunk.

[DAreRodz]

I just merged the PR that adds the missing directives and the e2e tests we had in the block-interactivity-experiments repository. Those tests have been adapted to follow the same format used in Gutenberg.

• Interactivity API: Add missing directives and move e2e tests #51194

[DAreRodz]

I created a small PR to improve security on the store serialization. It's ready for review.

• Interactivity API: Move Store's data encoding to the echo call #51974

[luisherranz]

An update on the progress of these tasks, and other related Interactivity API improvements:

• @westonruter opened a PR that adds the defer strategy to all the frontend block scripts, including the Interactivity API ones: Use defer loading strategy for frontend view scripts #52536
• @DAreRodz and I improved the logic of the priority levels: Improve the Interactivity API priority levels logic #52323
• @juanmaguitar created the first version of the Interactivity API Readme: first version of the Interactivity API README #52104
• @juanmaguitar added the docs folder and some initial texts, including a Getting Started guide: Open "docs" folder for the Interactivity API package and Getting Started Guide #52462
• @juanmaguitar added an interactive block template for @wordpress/create-block: Create block interactive template #52612
• @ryanwelcher added some refinements to the interactive block template for @wordpress/create-block: [create-block] Refinements to the create-block-interactive-template package. #52801
• @DAreRodz added JSDoc coverage of the public APIs: Interactivity API: Add JSDoc comments to the public API #52469
• @DAreRodz after moving all the e2e tests from the old repo to Gutenberg (Interactivity API: Add missing directives and move e2e tests #51194), he started working to add the missing e2e tests and increase our test coverage
• @c4rl0sbr4v0 and I added the runtime logic of the wp-style directive: Add runtime support for the wp-style directive #52645
• I changed the way we identify blocks without parent blocks because it was messing up with a CSS hash: Fix md5 class messed up with new block key #52557

---

So this is almost ready to go. I think we can consider it completed as soon as David publishes his e2e PR, we merge the JSDocs one, and Weston's defer PR is merged.

After that, we'll think about the next milestones and we'll publish a new Tracking Issue.

[luisherranz]

@DAreRodz opened a draft PR for the last task, add missing e2e tests:

• Interactivity API: Add missing tests for body, init and on directives #52952

[luisherranz]

An update on the progress of these tasks, and other related Interactivity API improvements:

• @westonruter merged his PR to add the defer strategy to all the frontend block scripts, including the Interactivity API ones: Use defer loading strategy for frontend view scripts #52536
• @juanmaguitar opened and merged a PR to add the first docs for the API: API Reference Docs for Interactivity API #52948
• I opened and merged a PR to remove wp-show from the runtime until we finally figure out how it should behave: Interactivity API: remove the wp-show directive temporarily #53240
• @DAreRodz opened a PR to add the missing e2e tests and increase our test coverage: Interactivity API: Add missing tests for body, init and on directives #52952
• @c4rl0sbr4v0 opened and merged a PR to add support for underscores and leading dashes in the suffix part of the directive: Interactivity API: Add support for underscores and leading dashes in the suffix part of the directive #53337

Apart from that, @juanmaguitar opened a new Docs Tracking Issue to coordinate the documentation efforts, so I won't report documentation updates here anymore. Please subscribe to that Tracking Issue to keep track of that progress.

[luisherranz]

Everything here is finished, including:

• Allow passing optional afterLoad callbacks to store calls #53363

I've opened a new Tracking Issue with a new set of improvements to the Interactivity API.

• Tracking Issue: More core blocks and new store() API #53740

Please, subscribe to the new one if you want to keep updated!