theme json boilerplate fix to ensure fontSizes are saved back to the theme
related to #707
related to https://github.com/WordPress/create-block-theme/issues/707
Hi @eirichmond ! thanks for adding some rationale in https://github.com/WordPress/create-block-theme/issues/707#issuecomment-2503642531 and submitting this PR.
To make the proposed changes easier to review and test it's always good to provide common answers to 'what', 'why' and 'how' the PR is solving a problem and also provide some 'testing instructions' also.
@matiasbenedetto I appreciate the feedback but it's worth noting that #707 specifically refers to creating a blank theme, and this solution would only impact that particular scenario if the boilerplate is only used to create a new blank theme.
Create a blank theme. Edit the default font size presets. Save changes to the theme.
You will see that the edited font sizes are not present in the resulting theme.json file, and the default font sizes are reset to the Core defaults.
It was also stated that this approach "is just a way to disable the list of default font sizes for new blank themes created, but not a way to save the changes made to those default font sizes."
This is not true. The proposed boilerplate change ensures that:
A) defaultFontSizes is disabled.
B) The default font sizes from Core are replicated, making them editable via Global Styles.
C) Changes made via Global Styles and saved to the database are not removed when saving back to the theme.json file via the plugin. This directly addresses and fixes the bug mentioned in #707.
By reproducing the steps outlined in the original issue, you’ll find that this approach resolves the problem.
As for other themes, it’s worth noting that if defaultFontSizes is set to true by default, the fontSizes configuration isn’t implemented in the same way as described in #707. This distinction is important, as the issue specifically pertains to blank themes created via the plugin and the associated workflow.
To further add to the discussion, I’m not sure how this could logically work without first changing the boilerplate to include defaultFontSizes: false if you wanted to save the Global Styles font settings back to the theme. Currently, the process behaves like this after the user clicks Save to Theme:
-
Theme is loaded: The
theme.jsonfile from the new blank theme (or the current theme) is loaded. In the case of a blank theme boilerplate,defaultFontSizes: falseis not set, so it defaults todefaultFontSizes: true. Additionally,fontSizesis not defined in the theme boilerplate. -
Default settings are loaded: The default theme settings from Core are loaded, which include
defaultFontSizes: trueand the defaultfontSizes. -
Default
fontSizesare applied: The defaultfontSizesare added to the theme’sfontSizes(which is empty at this stage) in what appears to be a recursive process. -
Database user styles are cleared: The user’s Global Styles settings from the database are wiped.
As a result:
-
The theme.json in the theme ends up with an empty fontSizes array.
-
The database user styles for font sizes are cleared.
-
The Global Styles font size presets revert to the default Core fontSizes.
This makes it clear that without defaultFontSizes: false explicitly set and predefined fontSizes included first, the behavior will always revert to the Core defaults, making it impossible to preserve changes made in Global Styles.
@matiasbenedetto, perhaps this is a better fix in my last push.
What this fixes: When the Typography > Font Size preset is changed via Global Styles and then saved back to the database, the changes are not reflected in the theme when "Save Changes to Theme" is used.
Why this fix: This improves the theme development workflow. When changes are made via Global Styles and "Save Changes to Theme" is used, any font size presets should be respected and applied.
How it's fixed: Before the data is stringified, a new function, font_size_preset_changes, runs the data through a method of the parent class to check if any font sizes have been added to the database. Rather than saving the merged data with an empty fontSizes reference, the data from the database is used before it is cleared and applied to the theme.json file. Additionally, defaultFontSizes is set to false to ensure the font sizes are respected from the theme rather than the core.