Downloads TTF files instead of WOFF/WOFF2

[aristath]

This was brought up in the Gutenberg repo (see WordPress/gutenberg#55049 and WordPress/gutenberg#57706), as well as WP's Slack.
Currently we're downloading .ttf files which are quite large and don't support all features that modern font-families have.
We should instead download .woff files, or - ideally - .woff2.
We should be able to do that by passing a user-agent in the fetch call on

google-fonts-to-wordpress-collection/src/get_google_fonts.js

Line 80 in abe0da8

newApiData = await fetch(`${API_URL}${API_KEY}`);

User-agents we can use:
If we want to get woff files, then the one below is the recommended user-agent since it's the only one that also supports unicode-ranges

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/603.3.8 (KHTML, like Gecko) Version/10.1.2 Safari/603.3.8

If we want to get woff2 files, then this one will do:

Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:73.0) Gecko/20100101 Firefox/73.0

cc @matiasbenedetto

[luminuu]

An alternative approach would be using the capability parameter with WOFF2 as value, as per the Google Fonts documentation: https://developers.google.com/fonts/docs/developer_api#api_url_specification

[swissspidy]

Yes this really should use the capability parameter where possible, no user agent wizardry

[aristath]

Even better 👍

[matiasbenedetto]

An alternative approach would be using the capability parameter with WOFF2 as value, as per the Google Fonts documentation: https://developers.google.com/fonts/docs/developer_api#api_url_specification

This option seems to be new in the Google Fonts API. It didn't exist (or at least I didn't notice it) a few months ago while creating this repo. Good to know that now we have this option available. I think switching from ttf to woff2 should be simple now.

[aristath]

This option seems to be new in the Google Fonts API. It didn't exist (or at least I didn't notice it) a few months ago while creating this repo.

Oh it's definitely new... that's why I initially suggested using the user-agent, we've been using that method for years 'cause until recently there was no other way to do it 😅