Editor: Introducing Browse Mode

[priethor]

Why Browse Mode?

WordPress 6.2 aims to wrap Phase 2 and stabilize the site editing capabilities; browse Mode represents a key element for the Site Editing experience, providing a new UI to navigate, edit, and create templates and edit your site. With such a UI overhaul, there are still a few items to polish (​example) based on the latest feedback.

cc @mamaduka @ntsekouras @hellofromtonya

[azaozz]

Re-posting here for posterity:

I'm thinking the description on how/when to use the "blessed" keyword is pretty good in the handbook. But perhaps the part about needing "blessed" when adding code from Gutenberg may not be needed.

My understanding is that the code in the Gutenberg repo is part of core. It is being released as a plugin every two weeks so new changes can be tested fast, much faster than core trunk.

The requirement for new features and enhancements to be committed to core trunk before beta (which is also the effective "feature freeze") are in place to ensure they are adequately tested. However this testing can happen in the Gutenberg plugin, and it seems it is quite more effective there (300k sites are testing!).

So when committing code to core trunk during beta, there is no reason to disallow hew features and enhancements that have already been tested in a Gutenberg release. On the opposite, code tested in Gutenberg for a few days has most likely been tested by many thousands of users on many thousands of sites. I'm afraid that is not the case for testing the core trunk during beta.

As far as I know Browse Mode will be in the next Gutenberg release. In that terms thinking this ticket should be closed as the "blessed" keyword is not needed for new features when they have been tested in a Gutenberg release. There is no reason to disallow adding Browse Mode during beta.

[hellofromTonya]

Rewording to focus on the feature introduction into Core, rather than the a request to "bless" the feature to continue into the 6.2 beta cycle.

[hellofromTonya]

Reposting the request by @priethor to "bless" this feature to continue its development within Gutenberg into the Beta cycle:

Following the process of releasing Beta versions described ​in the Handbook, I'd like to propose ​Gutenberg's Browse Mode feature be blessed during the WordPress 6.2 release cycle.

When did this feature first ship in Gutenberg?
It was first released in Gutenberg 14.8.

[hellofromTonya]

The @wordpress package updates will be done in #57471.

PRs for PHP code from Gutenberg into Core can be linked to this Trac ticket for commit.

[costdev]

@hellofromTonya Myself and @mukesh27 are scrubbing through the last of the enhancement/feature request tickets in the 6.2 milestone ahead of 6.2 Beta 1 later today. Is this one still on track to receive linked PRs? (and should the close keyword still be applied?)

[hellofromTonya]

There is a discussion underway in ​in Core Slack core-committers channel for code being copied/merged from Gutenberg into Core already being blessed.

Today is 6.2 Beta 1. Core's handbook is clear about how to handle ALL enhancements and features requests before starting Beta 1.

• ​How the Release Cycle Works:

  Phase 3: Beta. Betas are released and beta-testers are asked to start reporting bugs. No more commits for new enhancements or feature requests are allowed for the rest of the release.
  

• ​Releasing Beta and RC Versions:

  For Beta releases, ensure that the milestone is cleared of enhancement and feature request tickets (e.g., Trac query for 6.1). If there is agreement within the release squad that a certain enhancement or feature request is critical for the release and thus needs to remain in the milestone, its ticket type should be changed to “Task (blessed)”. Also ensure with the Editor Tech Lead that enhancements/features merges from Gutenberg are similarly either cleared from the milestone or changed to a “Task (blessed)”.
  

This discussion likely will not get resolved before today's Beta 1 party starts.

I'm setting this new feature to "blessed" as it is planned for 6.2 and has already been released in Gutenberg. Its continuation is feature refinement. Given the fast iterations and release cycles, it will receive more testing, discussion, and feedback through Gutenberg's cycles than in Core's beta cycle.

This "blessed" feature can be revisited once there's resolution to the discussion.

In talking with @priethor, there will be a mixture of PHP code to merge/backport and packages to update. This ticket can be the landing place to track the feature.

[hellofromTonya]

Manually adding changesets from #57471 @wordpress package updates.

[hellofromTonya]

In 55333:

Editor: Update @wordpress packages for 6.2 Beta 2.

Updates the `@wordpress` packages to include the following changes:

- Add missing period in keyboard shortcut descriptions
- Site Editor: Append template type and name to the site editor page title
- Specify active color state for template navigation button
- Global Styles: Move more link about custom CSS to part of description
- ToolsPanel: Display optional items when values are updated externally
- File block: Re-add editor styles for classic themes
- Enable undo after creating a new menu
- Style Book: Exclude blocks that are not allowed to insert
- Add basic tsconfig.json validation
- Fix Experiments native variant breakage
- Update moment and moment-timezone packages to fix timezone issues
- NavigatorButton: Reuse Button types
- ToolsPanel: Ensure display of optional items when panel id is null
- ColorPalette: Ensure text label contrast checking works with CSS variables
- Components: Add support for named arguments in the navigator components
- Rename experiments package to private-apis
- Cherry-pick CLI: Fix the default label to match the documentation
- Handle block metadata attribute and related experimental APIs
- Fix: Remove browser default border for iframe in the editor
- [Layout]: Fix align controls for hybrid themes
- Visual Regression tests: use default playwright utils
- SelectControl: Fix multiple prop styling
- Fix clicking on the toggle button not closing the block inserter
- Update deps for the useEffect that creates navigation menus
- Minor updates in Private APIs docs
- Site Editor: Fix custom Template Parts rename action
- [Block Library - Cover]: Ensure url is not malformed due to sanitization through wp_kses
- Revert "Prevent the image from being resized larger than its container"
- Lodash: Remove from @wordpress/keycodes package
- Distraction free mode: Fix keyboard shortcut not working
- Popover: lock the __experimentalPopoverPositionToPlacement function
- Rename the "experiments" export to "privateApis"
- Add an aria label to the site save dialog
- Navigator: add more pattern matching tests, refine existing tests
- Add parent navigation support for the navigator component
- Add back link to Design heading in site editor navigation to return to Dashboard
- Add a nested level when selecting templates or template parts
- Move site editor 6.2 specific code to the right file
- Fix site editor navigation

References:
* [https://github.com/WordPress/gutenberg/commit/1bf01c01a8238ce3a681ad1e517f86033818b78d Gutenberg's commit for publishing the packages]

Follow-up to [55257].

Props ntsekouras.
See #57471.

Changes in this changeset include:

• Add a nested level when selecting templates or template parts (See Gutenberg ​Issue 46640 | ​PR 47777)
• Add back link to Design heading in site editor navigation to return to Dashboard (See Gutenberg ​Issue 47583 | ​PR 47950)

[hellofromTonya]

In 55392:

Update the WP packages with fixes prior to WP 6.2 beta 3

Includes the following changes:

- Upgrade Playwright to 1.30.0
- [Block Editor - Inserter]: preload media categories empty check - client side
- Navigation: Fixes undo and redo for nesting operations in the navigation block's inspector
- Fix: OffCanvasEditor does not inserts submenu on collapsed items.
- OffCanvasEditor: Only allow some blocks to be converted to submenus
- Navigation: Updates "Add Submenu item" text to "Add Submenu link"
- Update: Make OffCanvasEditor use LeafMoreMenu by default.
- Template Part: Performance: Replace usage of wp_get_theme()->get_stylesheet() with get_stylesheet()
- Widget Editor: Fix a problem with 'Move to Widget Area' button not working
- Reusable Blocks: Use React 18 rendering for import dropdown
- useAsyncList: flush state updates when processing queue
- Refactor the site editor URLs for better backward compatibility
- Template editor: only disable the save button if no changes rather than hiding it
- [Quote]: Fix deprectated large style specificity rule
- Style Book: Allow button text labels for style book icon
- List View: Scroll selected block into view when single block selection changes
- Post editor: revert iframed editor for WP core only
- Fix the Publish region position and focus style.
- Remove "& Shadow" from the Border ScreenHeader title
- Site editor: specify focus state color for template navigation button

References: [https://github.com/WordPress/gutenberg/commit/1e2b2f680c6378f789d6660bc04b30e35e3a33a3 Gutenberg's commit for publishing the packages]

Props ntsekouras, ellatrix.
See #57471.

Changes include:

• Template editor: only disable the save button if no changes rather than hiding it (See Gutenberg ​Issue 47882 | ​PR 47895)

[hellofromTonya]

In 55440:

Update the WP packages with fixes prior to WP 6.2 beta 4

This updated the packages to the latest versions with the latest fixes.

Gutenberg changes: https://github.com/WordPress/gutenberg/commit/35f10c183655e9196d4ea12b8fa499a8ecbb7b6a

Includes the following bug fixes:

- Only add layout classes to inner wrapper if block is a container.
- Revert dynamic block anchor support
- [Inserter - Media tab]: Upload Openverse images when inserted
- SpacingSizesControl: Fix white dot on thumb
- Site Editor: update the edit button
- Change "Browse all templates" to "Manage all templates" in template details popover
- Remove TemplateAreas from template details
- Add support for orientation-based block movers to core/social-links
- Site Editor: polish add template modal style
- Match color of the focus template view with site dark material
- Site Editor: Fix routing for Classic themes using block-based template parts
- Remove broken site editor redirect
- Make the template customized info accessible
- Sort templates and template parts by slug
- Prevent distracting focused back button on site editor load
- Fix: Content only CPT template locking.
- Pin floating-ui/react-dom version
- Widget Importer: Don't render controls when there's nothing to import
- Post Editor: Update postContentBlock check to see if the block is valid
- Site Tagline: Add example so that it will display in style book
- Remove copy for managing a block's style variations
- Fix the site editor home page loading when installed in a subdirectory
- Global Styles: Display preset names via the tooltip
- [Query Loop] Fix top border in pattern selection modal
- Site Editor: Fix the 'Browse all' link in the template details modal
- Site Editor: Fix the tooltip and shortcut for the global save button
- Make the Site Logo block placeholder state smaller
- Site Editor Sidebar: Add line-height for template/parts name and update width for edit button
- Style Book: Focus the Style Book when opened, and enable ESCAPE key to close
- [Site Editor]: Set html block as freeform fallback block
- Make the performance tests more stable
- Adds all allowed innerblocks to the inspector animation experiment
- Revert Link control UX changes for WP 6.2
- Fix Site Editor perf tests
- Playwright: fix request utils for non Docker envs

See #57471.
Props Mamaduka, ntsekouras.

Changes include:

• Prevent distracting focused back button on site editor load (See Gutenberg ​Issue 48561 | ​PR 48472)
• Site Editor Sidebar: Add line-height for template/parts name and update width for edit button (See Gutenberg ​Issue 48155 | ​PR 48160)

[hellofromTonya]

The individual commits made for this enhancement need to be copied here from the @wordpress package updates #57471. That'll wire the changes to the feature.

As RC1 is happening in a few hours, closing this ticket.