Adds a development server for testing collection builds

[creativecoder]

Adds a simple node development server for testing font collections

Testing Instructions

Generate a collection and previews, if you haven't already

• GOOGLE_FONTS_API_KEY=YOUR_KEY npm run api
• npm run previews

Note that there may be errors when downloading fonts to generate previews. You can download the font individually with node src/generate_font_previews.js "FONT NAME" and then restart the preview generation command.

Add the following filters to an mu-plugin on your development site

// Allow serving fonts ocally for testing
function my_allow_localhost( $allow, $host, $url ) {
	if ( str_starts_with( $url, 'http://localhost:9158/images/fonts/' ) ) {
		$allow = true;
	}

	return $allow;
}
add_filter( 'http_request_host_is_external', 'my_allow_localhost', 10, 3 );

// Allow port 9158 for local fonts server
function my_allow_http_ports( $ports ) {
	$ports[] = 9158;
	return $ports;
}
add_filter( 'http_allowed_safe_ports', 'my_allow_http_ports' );

// Rewrite Google Fonts URLs to localhost
function my_local_google_fonts_collection( $pre, $args, $url ) {
	if ( str_starts_with( $url, 'https://s.w.org/images/fonts/' ) ) {
		$url = str_replace( 'https://s.w.org/images/fonts/wp-6.5', 'http://localhost:9158/images/fonts/17.7', $url );
                $url = str_replace( 'https://s.w.org/images/fonts/17.7', 'http://localhost:9158/images/fonts/17.7', $url );
		$http = new WP_Http();
		return $http->request( $url, $args );
	}

	return $pre;
}
add_filter( 'pre_http_request', 'my_local_google_fonts_collection', 10, 3 );

Now start the development server: npm run serve

You should now be able to load the font collection from the site editor, and it will be served from the local development server. You can watch the development server log to verify this.

[vcanales]

This is testing well for me; the replacement local URLs are being served correctly.

[mikachan]

Thanks for working on this @creativecoder! Sorry for the delayed review.

This makes testing the collection builds much easier. Works well for me, I'm happy to bring this in 👍

[creativecoder]

Thanks for the review @mikachan ! I think I'll add some instructions in the readme about how to use the development server (basically the testing instructions from this PR) and then get this merged.

[mikachan]

I think I'll add some instructions in the readme about how to use the development server

Sounds good!

[creativecoder]

I think I'll add some instructions in the readme about how to use the development server

Actually I see the readme could some other changes, as well. I've opened a separate PR here: #32