Skip to content

Add WordPress Playground Preview for Pull Requests #131

@davidperezgar

Description

@davidperezgar

Feature Request: WordPress Playground Live Preview for PRs

Problem

Currently, reviewing pull requests for Frontblocks requires contributors to:

  1. Clone the repository locally
  2. Install dependencies (Composer / npm)
  3. Build the plugin
  4. Set up a local WordPress environment
  5. Manually activate the plugin and test the changes

This process creates significant friction for reviewers and raises the barrier for new contributors who want to help validate changes — especially block UI changes where visual feedback is critical.


Proposed Solution

Integrate the official WordPress Playground GitHub Action so that every pull request automatically gets a live, browser-based WordPress preview with Frontblocks loaded and ready to test.

The workflow would:

  • Build the plugin from the PR branch
  • Upload build artifacts
  • Post an automated comment on the PR with a Playground preview link
  • Load the plugin inside a fully functional browser-based WordPress instance (no local setup needed)

Key Benefits

  • Faster code review: reviewers can visually validate block changes (layout, styles, schema output) instantly.
  • Lower contribution barrier: testers and non-developers can interact with the plugin without any local environment.
  • Better QA: edge cases and UI regressions can be caught earlier in the review cycle.
  • Accessible to everyone: design, content, and SEO stakeholders can preview FAQ schema output, block behaviour, and more.

Implementation Considerations

  1. Blueprint file: define a blueprint.json at the repo root (or .wordpress-playground/blueprint.json) to configure the Playground environment (WordPress version, active theme, pre-installed content).
  2. Sample content: consider pre-loading demo posts/pages with Frontblocks blocks already placed so reviewers can test immediately.
  3. Build pipeline: ensure the GitHub Action runs the necessary PHP and JS build steps before packaging the plugin for Playground.
  4. Fork security: evaluate whether preview links should only be generated for PRs from trusted contributors or only on pull_request_target events to avoid exposing secrets.

References


Acceptance Criteria

  • A GitHub Actions workflow is added that triggers on pull requests.
  • The workflow builds the plugin (PHP + JS assets).
  • A Playground preview link is posted as an automated comment on each PR.
  • The Playground instance loads WordPress with Frontblocks activated.
  • A blueprint.json is provided with sensible defaults (theme, sample content).
  • The workflow handles fork PRs safely (no secret exposure).

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions