From 030c7cb389408f57e933c8896768887d8b9755fb Mon Sep 17 00:00:00 2001 From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com> Date: Fri, 27 Jan 2023 10:01:23 +1000 Subject: [PATCH 1/3] Block Inspector: Avoid advanced panel only tab --- .../use-inspector-controls-tabs.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js b/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js index 65677506893034..42b0474af1b0ef 100644 --- a/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js +++ b/packages/block-editor/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js @@ -62,12 +62,17 @@ export default function useInspectorControlsTabs( blockName ) { tabs.push( TAB_STYLES ); } - // Settings Tab: If there are any fills for the general InspectorControls - // or Advanced Controls slot, then add this tab. + // Settings Tab: If we don't already have multiple tabs to display + // (i.e. both list view and styles), check only the default and position + // InspectorControls slots. If we have multiple tabs, we'll need to check + // the advanced controls slot as well to ensure they are rendered. + const advancedFills = + useSlotFills( InspectorAdvancedControls.slotName ) || []; + const settingsFills = [ ...( useSlotFills( defaultGroup.Slot.__unstableName ) || [] ), ...( useSlotFills( positionGroup.Slot.__unstableName ) || [] ), - ...( useSlotFills( InspectorAdvancedControls.slotName ) || [] ), + ...( tabs.length > 1 ? advancedFills : [] ), ]; if ( settingsFills.length ) { From f5f793bfeefd7a703e0a1d29ce72fc530cdbd79a Mon Sep 17 00:00:00 2001 From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com> Date: Fri, 27 Jan 2023 11:51:29 +1000 Subject: [PATCH 2/3] Update playwright e2es to match tab changes --- test/e2e/specs/editor/blocks/table.spec.js | 12 +++--------- .../specs/site-editor/push-to-global-styles.spec.js | 10 +--------- 2 files changed, 4 insertions(+), 18 deletions(-) diff --git a/test/e2e/specs/editor/blocks/table.spec.js b/test/e2e/specs/editor/blocks/table.spec.js index 6ce830a847e1fe..c8730984488159 100644 --- a/test/e2e/specs/editor/blocks/table.spec.js +++ b/test/e2e/specs/editor/blocks/table.spec.js @@ -77,9 +77,6 @@ test.describe( 'Table', () => { } ) => { await editor.insertBlock( { name: 'core/table' } ); await editor.openDocumentSettingsSidebar(); - await page.click( - `role=region[name="Editor settings"i] >> role=tab[name="Settings"i]` - ); const headerSwitch = page.locator( 'role=checkbox[name="Header section"i]' @@ -135,9 +132,6 @@ test.describe( 'Table', () => { } ) => { await editor.insertBlock( { name: 'core/table' } ); await editor.openDocumentSettingsSidebar(); - await page.click( - `role=region[name="Editor settings"i] >> role=tab[name="Settings"i]` - ); // Create the table. await page.click( 'role=button[name="Create Table"i]' ); @@ -211,14 +205,14 @@ test.describe( 'Table', () => { } ) => { await editor.insertBlock( { name: 'core/table' } ); await editor.openDocumentSettingsSidebar(); - await page.click( - `role=region[name="Editor settings"i] >> role=tab[name="Settings"i]` - ); // Create the table. await page.click( 'role=button[name="Create Table"i]' ); // Enable fixed width as it exacerbates the amount of empty space around the RichText. + await page.click( + `role=region[name="Editor settings"i] >> role=tab[name="Settings"i]` + ); await page .locator( 'role=checkbox[name="Fixed width table cells"i]' ) .check(); diff --git a/test/e2e/specs/site-editor/push-to-global-styles.spec.js b/test/e2e/specs/site-editor/push-to-global-styles.spec.js index b3863ca67d026c..d51ce41dc3ea8e 100644 --- a/test/e2e/specs/site-editor/push-to-global-styles.spec.js +++ b/test/e2e/specs/site-editor/push-to-global-styles.spec.js @@ -42,9 +42,8 @@ test.describe( 'Push to Global Styles button', () => { page.getByRole( 'button', { name: 'Uppercase' } ) ).toHaveAttribute( 'aria-pressed', 'false' ); - // Go to block settings, select inner tab, and open the Advanced panel + // Go to block settings and open the Advanced panel await page.getByRole( 'button', { name: 'Settings' } ).click(); - await page.getByRole( 'tab', { name: 'Settings' } ).click(); await page.getByRole( 'button', { name: 'Advanced' } ).click(); // Push button should be disabled @@ -54,16 +53,9 @@ test.describe( 'Push to Global Styles button', () => { } ) ).toBeDisabled(); - // Switch back to the Styles inspector tab to check typography style - await page.getByRole( 'tab', { name: 'Styles' } ).click(); - // Make the Heading block uppercase await page.getByRole( 'button', { name: 'Uppercase' } ).click(); - // Switch back to the Settings inspector tab to check for enabled button - await page.getByRole( 'tab', { name: 'Settings' } ).click(); - await page.getByRole( 'button', { name: 'Advanced' } ).click(); - // Push button should now be enabled await expect( page.getByRole( 'button', { From 0426466b8fe8d9d329828ed38d1ed902bf9c43b2 Mon Sep 17 00:00:00 2001 From: Aaron Robertshaw <60436221+aaronrobertshaw@users.noreply.github.com> Date: Fri, 27 Jan 2023 18:22:21 +1000 Subject: [PATCH 3/3] Fix remaining table e2e spec failure --- test/e2e/specs/editor/blocks/table.spec.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/test/e2e/specs/editor/blocks/table.spec.js b/test/e2e/specs/editor/blocks/table.spec.js index c8730984488159..d206089e3f4e3f 100644 --- a/test/e2e/specs/editor/blocks/table.spec.js +++ b/test/e2e/specs/editor/blocks/table.spec.js @@ -93,6 +93,9 @@ test.describe( 'Table', () => { await page.click( 'role=button[name="Create Table"i]' ); // Expect the header and footer switches to be present now that the table has been created. + await page.click( + `role=region[name="Editor settings"i] >> role=tab[name="Settings"i]` + ); await expect( headerSwitch ).toBeVisible(); await expect( footerSwitch ).toBeVisible();