Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Theme.json Schema: add support for button elements #42133

Merged
merged 2 commits into from
Jul 6, 2022

Conversation

mikachan
Copy link
Member

@mikachan mikachan commented Jul 4, 2022

What?

In #40260, we added support for button elements to theme.json. We now need to update the schema for theme.json to reflect this accurately.

Why?

This improves the developer experience by automatically validating the contents of theme.json.

How?

By including button as one of the properties listed under the elements section.

I copied the way we're already doing this for core/button here, which has worked in my testing, but I'm not sure if there's a better/more correct way to handle this.

Testing Instructions

  1. Activate a theme which you can modify locally.
  2. Open the theme's theme.json file and update the $schema to point to your local Gutenberg version (follow the instructions from the docs here).
  3. Add some button rules under elements.button and check your IDE doesn't complain. Here is an example:
"elements": {
	"button": {
		"border": {
			"radius": "0",
			"width": "0"
		},
		"color": {
			"background": "black",
			"text": "white"
		},
		"typography": {
			"textTransform": "uppercase"
		},
		"spacing": {
			"padding": {
				"top": "10px",
				"bottom": "10px",
				"left": "20px",
				"right": "20px"
			}
		}
	}
}
  1. Add some invalid button properties and check that it does complain (e.g. textDecoration).

@mikachan mikachan added [Block] Buttons Affects the Buttons Block Developer Experience Ideas about improving block and theme developer experience labels Jul 4, 2022
@mikachan mikachan requested a review from ajlende as a code owner July 4, 2022 17:35
@mikachan mikachan self-assigned this Jul 4, 2022
Copy link
Contributor

@pbking pbking left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks and works right to me.

Gave me an opportunity to deep-dive into the schema. :)

Copy link
Contributor

@getdave getdave left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@mikachan mikachan merged commit 6dae661 into trunk Jul 6, 2022
@mikachan mikachan deleted the update/json-schema-button-elements branch July 6, 2022 09:01
@github-actions github-actions bot added this to the Gutenberg 13.7 milestone Jul 6, 2022
@bph bph added the Needs Dev Note Requires a developer note for a major WordPress release cycle label Aug 4, 2022
@bph bph mentioned this pull request Oct 3, 2022
89 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Buttons Affects the Buttons Block Developer Experience Ideas about improving block and theme developer experience Needs Dev Note Requires a developer note for a major WordPress release cycle
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants