wordpress-develop Pull Request previewer #700
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
adamziel
added
[Type] Enhancement
adamziel
changed the title
This was referenced Oct 13, 2023
|
Note that this relates to https://core.trac.wordpress.org/ticket/59416 and alongside optimizing the bundle download we can look into an automation to share a direct link in PRs as described in that Trac ticket. Great work here @adamziel, I LOVE IT!!! |
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
This PR moves applying a WordPress patch from the Dockerfile, where WP is built into a `.data` file, to JavaScript, where it can be applied to any arbitrary WordPress installation. This is needed to patch WordPress branches in Pull Request previewer. See #700. Testing instructions: 1. Run Playground with `npm run start` 2. Go to the block editor 3. Confirm that inserter's CSS is loaded (black + icon) 4. Install the Gutenberg plugin 5. Confirm that inserter's CSS is still loaded Related to #668, #646.
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
#702) Replaces approximate rules such as ```js if(path.startsWith('/wp-content')) { // serve from VFS } else { // serve from remote server } ``` With actual file existence check. ## Context When a static file is requested from Playground, the service worker doesn't know whether to serve it from VFS or playground.wordpress.net. It tries to guess that based on approximate rules such as `path.startsWith('/wp-content')`. This usually works, but is not very reliable. For example, when you store an entirely new WordPress instance in VFS, you would expect all the static assets to be served from VFS, but that is not what the request handler would do. This does not play well with previewing WordPress Pull Requests as we're actually replacing the entire WordPress instance in VFS with an arbitrary branch. Related to #700 Closes #109 ## Testing Instructions 1. Start Playground `npm run start` 2. Use it for a bit, go to wp-admin, confirm that static assets like CSS and JS files are loaded without issues 3. Upload something, confirm that worked too ## Breaking change The `isStaticFilePath` option is removed in this PR.. This is a breaking change in public API and may be relevant for wp-now CC @sejas @danielbachhuber. While that sounds scary, everything should "just work" without major changes required in wp-now, other than removing this usage of `isStaticFilePath`: https://github.com/WordPress/playground-tools/blob/d792d7f03323aa0ec34e5885e4aebd5741d96f24/packages/wp-now/src/wp-now.ts#L53-L65
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
This PR moves applying a WordPress patch from the Dockerfile, where WP is built into a `.data` file, to JavaScript, where it can be applied to any arbitrary WordPress installation. This is needed to patch WordPress branches in Pull Request previewer. See #700. Testing instructions: 1. Run Playground with `npm run start` 2. Go to the block editor 3. Confirm that inserter's CSS is loaded (black + icon) 4. Install the Gutenberg plugin 5. Confirm that inserter's CSS is still loaded Related to #668, #646.
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
…ile (#703) This PR moves applying a WordPress patch from the Dockerfile, where WP is built into a `.data` file, to JavaScript, where it can be applied to any arbitrary WordPress installation. This is needed to patch WordPress branches in Pull Request previewer. See #700. ## Testing instructions: 1. Run Playground with `npm run start` 2. Go to the block editor 3. Confirm that inserter's CSS is loaded (black + icon) 4. Install the Gutenberg plugin 5. Confirm that inserter's CSS is still loaded Related to #668, #646.
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
…e.html. Enables patching arbitrary WordPress bundles for compatibility with web browsers. Without this PR, remote.html applies these patch right after the WordPress module is loaded into the /wordpress VFS directory. However, in #700 we want to enable using an arbitrary WordPress build from any PR in wordpress-develop. We must, thus, expose a way of applying the necessary patches. Testing instructions 1. Start Playground, log out 2. Go to /wp-login.php 3. Confirm there's a message explaining what login credentials to use
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
…e.html. Enables patching arbitrary WordPress bundles for compatibility with web browsers. Without this PR, remote.html applies these patch right after the WordPress module is loaded into the /wordpress VFS directory. However, in #700 we want to enable using an arbitrary WordPress build from any PR in wordpress-develop. We must, thus, expose a way of applying the necessary patches. Testing instructions 1. Start Playground, log out 2. Go to /wp-login.php 3. Confirm there's a message explaining what login credentials to use
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
…e.html (#706) Enables patching arbitrary WordPress bundles for compatibility with web browsers. Without this PR, remote.html applies these patch right after the WordPress module is loaded into the /wordpress VFS directory. However, in #700 we want to enable using an arbitrary WordPress build from any PR in wordpress-develop. We must, thus, expose a way of applying the necessary patches. ## Testing instructions 1. Start Playground, log out 2. Go to /wp-login.php 3. Confirm there's a message explaining what login credentials to use <img width="419" alt="CleanShot 2023-10-16 at 12 40 13@2x" src="https://github.com/WordPress/wordpress-playground/assets/205419/9d775c67-c9cb-4826-bd90-9ef766c697b2">
adamziel
force-pushed
the
support-wordpress-pr-preview
branch
from
8f05fac to
4121aae
Compare
adamziel
added a commit
that referenced
this pull request
Oct 16, 2023
adamziel
force-pushed
the
support-wordpress-pr-preview
branch
from
035a4b0 to
2661306
Compare
|
This PR is ready! The only blocker now is WordPress/wordpress-develop#5481 – once it lands I'll update the workflow name in here and WordPress will finally have a PR previewer! |
Add wordpress.html, a simple HTML form that enables previewing any WordPress core Pull Request. Technically, it's very similar to gutenberg.html – it just creates a tailored Blueprint and redirects to Playground with that Blueprint applied. *Caveats* This leans on storing WordPress builds as a GitHub artifact in CI. For now only one PR does that – WordPress/wordpress-develop#5481. Once it's merged, the previewer proposed in this PR will work for every wordpress-develop Pull Request! The downloaded WordPress bundle is ~45MB and takes a while to download without any visible progress information. Let's find a way to optimize it.
…g patched files by hand
adamziel
force-pushed
the
support-wordpress-pr-preview
branch
from
8464ae9 to
7dd9b9d
Compare
|
🚢 ! This will only work for Pull Requests targeting wordpress-develop trunk after 8077c0723fd1c8c825ec66df6edad1a1719991d6. If you want to preview yours, just rebase it! The previewer lives at https://playground.wordpress.net/wordpress.html. You can use the form on that page, or create a direct preview URL as in this PR's description. For example, here's the URL to preview PR 5511: https://playground.wordpress.net/wordpress.html?pr=5511&url=/wp-admin/post-new.php?test=1 The largest issue is: downloading the build file is sloooow. Let's find a way to optimize it. |
This was referenced Oct 17, 2023
yyyhko
approved these changes
Nov 21, 2024
| @@ -7,7 +7,7 @@ | |||
| rel="stylesheet" | |||
| href="https://fonts.googleapis.com/css?family=Noto+Serif:400,700" | |||
| /> | |||
| <link rel="stylesheet" href="./gutenberg.css" /> | |||
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What is this PR doing?
Support for previewing wordpress-develop Pull Requests.
Tell me more!
The previewer lives at https://playground.wordpress.net/wordpress.html and supports a few query parameters:
?pr=5481– preview that PR?url=/wp-admin/post-new.php– load that URL in WordPress?mode=seamless– redirect to a full-screen Playground without the browser chrome and any other extra UI elementsFor example, I could use the following URL to preview PR 5511 and immediately navigate to
/wp-admin/post-new.php?test=1:https://playground.wordpress.net/wordpress.html?pr=5511&url=/wp-admin/post-new.php?test=1
Caveats
The downloaded WordPress bundle is ~45MB and takes a while to download without any visible progress information. Let's find a way to optimize it.
Testing instructions
Screenshots
cc @spacedmonkey @fabiankaegy @dmsnell @jonathanbossenger @dawidurbanski