Background image: add support for relative theme path URLs in top-level theme.json styles

[ramonopoly]

This is a ticket to track the syncing of the Gutenberg PR ​Background image: add support for relative theme path URLs in top-level theme.json styles

Background

To ensure that themes with background image values in theme.json are portable — a theme developer can set a relative path to an image asset as a background image value, and that path will resolve correctly to absolute path of the file in the theme directory no matter where the theme is installed.

Contrast this with absolute image paths: every installation of the theme would point to single image files sitting somewhere on the internet.

How

Paths to images residing in the theme directory can be set in theme.son using the file: syntax, ​a convention already used in Core for web fonts.

The path is relative to the theme root. For example:

	"styles": {
		"background": {
			"backgroundImage": {
				"url": "file:./img/untitled.png"
			}
		}
	}

### Work in progress

This PR syncs the PHP changes from:

• ​https://github.com/WordPress/gutenberg/pull/61271

More to come....

Trac ticket: https://core.trac.wordpress.org/ticket/61273

I created a local branch containing this PR and ​https://github.com/WordPress/wordpress-develop/pull/6482 and tested a new block theme I created that uses a local file:./ image and the relative URL was not being turned into an absolute URL in the site frontend.

I think you're missing this change:

​https://github.com/WordPress/gutenberg/pull/61271/files#diff-b49a48d455acd888a968ee6facf9fb00d9c3de6f91d2818bbe9ddaa4b812dd55

I created a local branch containing this PR and ​https://github.com/WordPress/wordpress-develop/pull/6482 and, with the Gutenberg plugin disabled, I tested creating a new block theme that uses a local file:./ image. The relative URL was not being turned into an absolute URL in the site frontend.

Ah, nice spotting. Thanks! 🙇🏻

I'll update and push quickly.

TBH I'd stopped working on this in anticipation of ​https://github.com/WordPress/wordpress-develop/pull/6482 getting in first.

You asked me to test these two PRs, so ready or not, I'm testing these two PRs 😛

You asked me to test these two PRs so, ready or not, I'm testing these two PRs

🍺 You got me. 😄

Looking good. Would you mind adding step-by-step instructions for how to test the changes to class-wp-rest-global-styles-controller.php and class-wp-rest-global-styles-revisions-controller.php? I couldn't quite figure it out from hitting API endpoints locally.

Thanks! LGTM 👍

[noisysocks]

In 58262:

Block Themes: Add support for relative URLs in top-level theme.json styles

Allow using relative file: URLs in top-level theme.json properties such as
styles.background, and modify the REST API to provide clients with the
absolute URLs via a '​https://api.w.org/theme-file' attribute in the _links
array.

Props ramonopoly.
Fixes #61273.

Committed in r58262.

Trac ticket: https://core.trac.wordpress.org/ticket/61273

[noisysocks]

In 58263:

Remove extraneous spaces from WP_Theme_JSON_Resolver

Follows r58262.
See #61273.
Props mukesh27.

Committed in r58263.