[wp-trac] [WordPress Trac] #59165: Font Face: Server-side @font-face styles generator and printer

[WordPress Trac]

#59165: Font Face: Server-side @font-face styles generator and printer
-------------------------------------------------+-------------------------
 Reporter:  hellofromTonya                       |       Owner:
                                                 |  hellofromTonya
     Type:  enhancement                          |      Status:  closed
 Priority:  normal                               |   Milestone:  6.4
Component:  General                              |     Version:
 Severity:  normal                               |  Resolution:  fixed
 Keywords:  gutenberg-merge needs-dev-note has-  |     Focuses:
  patch has-unit-tests has-testing-info commit   |
  has-screenshots                                |
-------------------------------------------------+-------------------------
Changes (by hellofromTonya):

 * status:  accepted => closed
 * resolution:   => fixed


Comment:

 In [changeset:"56500" 56500]:
 {{{
 #!CommitTicketReference repository="" revision="56500"
 Introduce font-face styles generator and printer.

 Introducing Font Face, a server-side `@font-face` styles generator and
 printer.

 tl;dr:
 * Introduces Font Face.
 * Deprecates `_wp_theme_json_webfonts_handler()`.

 **Introduce Font Face**

 From an array of fonts (i.e. each font-family and its font variations to
 be processed), it:

 1. Validates each `font-face` declaration, i.e. the CSS property and value
 pairing. If validation fails, processing stops with no font-face styles
 printed.
 3. Generates the `@font-face` CSS for each font-family.
 4. Prints the CSS within a `<style id="wp-fonts-local">` element.

 The entry point into Font Face is through a new global function called
 `wp_print_font_faces()`, which is automatically called:

 * when the `'wp_head'` hook runs (for the front-end).
 * when the `'admin_print_styles'` hook runs (for the back-end).
 * when `_wp_get_iframed_editor_assets()` runs to inject the `@font-face`
 styles into the iframed editor.

 Once called, it gets the fonts from Theme_JSON merged data layer, which
 includes theme defined fonts and user activated fonts (once the Font
 Library #59166 is introduced into Core).

 For classic sites, themes and plugins can directly call
 `wp_print_font_faces()` and pass their fonts array to it for processing.

 **Deprecates `_wp_theme_json_webfonts_handler()`.**

 As Font Face is a direct replacement, the stopgap code in
 `_wp_theme_json_webfonts_handler()` (introduced in 6.0.0 via [53282]) is
 deprecated and unused in Core.

 **Props note:**
 There's a long multiple year history baked into Font Face, which dates
 back to the early versions of a web font API (see #46370 and
 [https://github.com/WordPress/gutenberg/issues/41479 roadmap]. The props
 list includes those who contributed from those early versions up to this
 commit.

 **References:**
 * #46370 original (Web)Fonts API proposal for registering and enqueuing
 web fonts.
 * [https://github.com/WordPress/gutenberg/issues/41479 Gutenberg tracking
 issue] which includes the evolution from Webfonts API to Fonts API to Font
 Face.
 * [53282] / #55567 Added the stopgap code
 `_wp_theme_json_webfonts_handler()` in 6.0.
 * [https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face @font-face
 on mdn web docs]
 * #59166 Font Library: Font manager for WordPress

 Follow-up to [53282].

 Props aristath, jonoaldersonwp, hellofromTonya, andraganescu, annezazu,
 antonvlasenko, arena, askdesign, azaozz, bph, bradley2083, colorful-tones,
 costdev, davidbaumwald, desrosj, dingo_d, djcowan, domainsupport,
 dryanpress, elmastudio, flixos90, francina, garrett-eclipse, gigitux,
 grantmkin, grapplerulrich, gziolo, ironprogrammer, jb510, jeffpaul,
 jeremyyip, jffng, joostdevalk, jorgefilipecosta, juanmaguitar, mamaduka,
 matveb, mburridge, mitogh, ndiego, ntsekouras, oandregal, ocean90,
 oglekler, paaljoachim, pagelab, peterwilsoncc, poena, priethor, scruffian,
 SergeyBiryukov, shiloey, simison, skorasaurus, soean, westonruter,
 wildworks, zaguiini.
 Fixes #59165.
 }}}

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/59165#comment:20>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform