Skip to content

Patterns: fix focus loss when closing the Create pattern dialog from the block toolbar#78957

Merged
t-hamano merged 1 commit into
WordPress:trunkfrom
Mustafabharmal:fix/78952-focus-loss-create-pattern-modal
Jun 7, 2026
Merged

Patterns: fix focus loss when closing the Create pattern dialog from the block toolbar#78957
t-hamano merged 1 commit into
WordPress:trunkfrom
Mustafabharmal:fix/78952-focus-loss-create-pattern-modal

Conversation

@Mustafabharmal

Copy link
Copy Markdown
Contributor

What?

Fixes a focus management regression in the "Create pattern" dialog opened from the block toolbar Options menu.

Closes #78952.

Why?

When pressing Escape (or otherwise dismissing the dialog without saving), focus was lost because the onClose handler for CreatePatternModal called closeBlockSettingsMenu(), which closed the entire parent dropdown menu. This left no visible focused element in the page.

Other dialogs in the same Options menu — Lock, Rename, and Hide — all follow the correct pattern: they only close the modal on dismiss, keeping the dropdown open so focus can return to the triggering menu item.

How?

Removed closeBlockSettingsMenu() from the onClose handler in PatternConvertButton.

closeBlockSettingsMenu() is still called correctly in handleSuccess() after the user successfully creates a pattern, ensuring the dropdown closes after a committed action.

 onClose={ () => {
     setIsModalOpen( false );
-    closeBlockSettingsMenu();
 } }

Testing Instructions

  1. Create a post, add a Paragraph block.
  2. Click the block toolbar Options (⋮) menu.
  3. Click "Create pattern" — the dialog opens.
  4. Press Escape — the dialog should close, focus should return to the "Create pattern" menu item in the still-open Options menu.
  5. Verify the same behavior still works correctly for Lock, Rename, and Hide (they should be unchanged).
  6. Also verify: creating a pattern successfully still closes both the modal AND the Options dropdown.

Screenshots or screencast

Before:

Testing.Create.Pattern.focus.loss.Before.Fix.mov

After:

Testing.Create.Pattern.focus.loss.After.Fix.mov

@github-actions

github-actions Bot commented Jun 4, 2026

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: Mustafabharmal <mustafabharmal@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: talldan <talldanwp@git.wordpress.org>
Co-authored-by: afercia <afercia@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions Bot added the [Package] Patterns /packages/patterns label Jun 4, 2026
@talldan

talldan commented Jun 5, 2026

Copy link
Copy Markdown
Contributor

@Mustafabharmal Looks like this is where that line was added - Block context menu: context menu not closing for disconnecting unsynced pattern menu items.

We may need to check removing it again doesn't cause the other bug to come back.

@t-hamano t-hamano added [Type] Bug An existing feature does not function as intended [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced labels Jun 5, 2026

@t-hamano t-hamano left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

This PR only addresses the issue where the Create Pattern modal is cancelled. I have confirmed that it does not affect the behavior when detaching is performed.

pattern-actions.mp4

@t-hamano t-hamano added the props-bot Manually triggers Props Bot to ensure the list of props is up to date. label Jun 5, 2026
@github-actions github-actions Bot removed the props-bot Manually triggers Props Bot to ensure the list of props is up to date. label Jun 5, 2026
@t-hamano t-hamano merged commit 7945bcc into WordPress:trunk Jun 7, 2026
55 checks passed
@github-actions github-actions Bot added this to the Gutenberg 23.4 milestone Jun 7, 2026
@talldan

talldan commented Jun 8, 2026

Copy link
Copy Markdown
Contributor

@t-hamano #75405 also touched the create pattern dialog:

I can reproduce when creating an unsynced pattern too. I'll see if I can update that as well

I tested though and it seems to be working ok.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Feature] Patterns A collection of blocks that can be synced (previously reusable blocks) or unsynced [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Package] Patterns /packages/patterns [Type] Bug An existing feature does not function as intended

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Focus loss when closing the Create pattern dialog opened from the block toolbar

3 participants