diff --git a/includes/SkinVector.php b/includes/SkinVector.php index e957db7..139fb69 100644 --- a/includes/SkinVector.php +++ b/includes/SkinVector.php @@ -284,22 +284,15 @@ class SkinVector extends SkinMustache { ) : array { $portletData = $this->getPortletData( $label, $urls ); $extraClasses = [ - self::MENU_TYPE_DROPDOWN => 'vector-menu vector-menu-dropdown vectorMenu', - self::MENU_TYPE_TABS => 'vector-menu vector-menu-tabs vectorTabs', + self::MENU_TYPE_DROPDOWN => 'vector-menu vector-menu-dropdown', + self::MENU_TYPE_TABS => 'vector-menu vector-menu-tabs', self::MENU_TYPE_PORTAL => 'vector-menu vector-menu-portal portal', self::MENU_TYPE_DEFAULT => 'vector-menu', ]; - // A list of classes to apply the list element and override the default behavior. - $listClasses = [ - // `.menu` is on the portal for historic reasons. - // It should not be applied elsewhere per T253329. - self::MENU_TYPE_DROPDOWN => 'menu vector-menu-content-list', - ]; $isPortal = $type === self::MENU_TYPE_PORTAL; $props = $portletData + [ 'label-id' => "p-{$label}-label", - 'list-classes' => $listClasses[$type] ?? 'vector-menu-content-list', 'is-dropdown' => $type === self::MENU_TYPE_DROPDOWN, ]; diff --git a/includes/templates/Menu.mustache b/includes/templates/Menu.mustache index 55114df..d810c9e 100644 --- a/includes/templates/Menu.mustache +++ b/includes/templates/Menu.mustache @@ -3,20 +3,16 @@ }} {{! `role` is unnecessary but kept to support selectors in any gadgets or user styles. }} - diff --git a/resources/skins.vector.styles/Menu.less b/resources/skins.vector.styles/Menu.less index 4a61a69..b5434bd 100644 --- a/resources/skins.vector.styles/Menu.less +++ b/resources/skins.vector.styles/Menu.less @@ -2,7 +2,7 @@ @import 'mediawiki.mixins.less'; /* Personal */ -.vector-menu { +.mw-portlet { // Hidden by default, but displayed by certain menus // e.g. MenuPortal h3 { diff --git a/resources/skins.vector.styles/MenuDropdown.less b/resources/skins.vector.styles/MenuDropdown.less index 6a869f8..0c528c8 100644 --- a/resources/skins.vector.styles/MenuDropdown.less +++ b/resources/skins.vector.styles/MenuDropdown.less @@ -115,8 +115,8 @@ } // Tab Separators -// `.vectorTabs`: Outer start border (left in LTR) of tab row. -// `.vectorTabs a`: Border between tabs and outer end (right in LTR) border. +// `.vector-menu-tabs`: Outer start border (left in LTR) of tab row. +// `.vector-menu-tabs a`: Border between tabs and outer end (right in LTR) border. // `#mw-head .vector-menu-dropdown h3`: // Outer end (right in LTR) border of "Actions" menu. .vector-menu-tabs, .vector-menu-tabs a, diff --git a/resources/skins.vector.styles/MenuPortal.less b/resources/skins.vector.styles/MenuPortal.less index 4112399..a36f3df 100644 --- a/resources/skins.vector.styles/MenuPortal.less +++ b/resources/skins.vector.styles/MenuPortal.less @@ -22,7 +22,9 @@ cursor: default; } - .body { + // FIXME: Remove .body after 1 week + .body, + .vector-menu-content { margin-left: @margin-start-portal-body; padding-top: 0; diff --git a/resources/skins.vector.styles/legacy/Sidebar.less b/resources/skins.vector.styles/legacy/Sidebar.less index 0da66c4..702b3ff 100644 --- a/resources/skins.vector.styles/legacy/Sidebar.less +++ b/resources/skins.vector.styles/legacy/Sidebar.less @@ -11,7 +11,9 @@ display: none; } - .body { + // FIXME: Remove .body after 1 week + .body, + .vector-menu-content { margin-left: @margin-start-nav-main-body; } } diff --git a/stories/Menu.stories.data.js b/stories/Menu.stories.data.js index 9edaae4..c60987f 100644 --- a/stories/Menu.stories.data.js +++ b/stories/Menu.stories.data.js @@ -13,8 +13,6 @@ import { htmlUserLanguageAttributes } from './utils'; const loggedOut = { id: 'p-personal', class: 'vector-menu', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-personal-label', label: 'Personal tools', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Not logged in
  • Talk
  • Contributions
  • Create account
  • Log in
    • ` @@ -26,8 +24,6 @@ const loggedOut = { const loggedInWithEcho = { id: 'p-personal', class: 'vector-menu', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-personal-label', label: 'Personal tools', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Jdlrobson
  • Alerts (0)
  • Notices (3)
  • Talk
  • Sandbox
  • Preferences
  • Beta
  • Watchlist
  • Contributions
  • Log out
    • ` @@ -41,8 +37,6 @@ const ULS_LANGUAGE_SELECTOR = '
  • Englis const defaultMenu = { id: 'p-generic', class: 'vector-menu', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-generic-label', label: 'Menu label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Item 1
    • @@ -56,8 +50,6 @@ const defaultMenu = { const loggedInWithULS = { id: 'p-personal', class: 'vector-menu', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-personal-label', label: 'Personal tools', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `${ULS_LANGUAGE_SELECTOR}
  • Jdlrobson
  • Alerts (0)
  • Notices (3)
  • Talk
  • Sandbox
  • Preferences
  • Beta
  • Watchlist
  • Contributions
  • Log out
    • ` diff --git a/stories/MenuDropdown.stories.data.js b/stories/MenuDropdown.stories.data.js index 0be7c33..123283d 100644 --- a/stories/MenuDropdown.stories.data.js +++ b/stories/MenuDropdown.stories.data.js @@ -13,10 +13,8 @@ export { vectorMenuTemplate }; export const moreData = { 'is-dropdown': true, class: 'vector-menu-dropdown', - 'list-classes': 'vector-menu-content-list', label: 'More', id: 'p-cactions', - 'label-id': 'p-cactions-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • A list of links
    • @@ -53,10 +51,8 @@ export const PORTALS = { navigation: { id: 'p-navigation', class: 'vector-menu-portal portal portal-first', - 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-navigation must exist for this to appear', label: 'Navigation', - 'label-id': 'p-navigation-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Main page
  • Contents
  • Featured content
  • Current events
  • Random page
  • Donate
    • @@ -66,10 +62,8 @@ export const PORTALS = { toolbox: { id: 'p-tb', class: 'vector-menu-portal portal', - 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-tb must exist for this to appear', label: 'Tools', - 'label-id': 'p-tb-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • What links here
  • Related changes
  • Upload file
  • Special pages
  • Page information
  • Wikidata item
  • Cite this page
    • @@ -79,10 +73,8 @@ export const PORTALS = { langlinks: { id: 'p-lang', class: 'vector-menu-portal portal', - 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-lang must exist for this to appear', label: 'In other languages', - 'label-id': 'p-lang-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • @@ -98,10 +90,8 @@ ${placeholder( `

    Further hook output possible (lang)

    `, 60 )}` otherProjects: { id: 'p-wikibase-otherprojects', class: 'vector-menu-portal portal', - 'list-classes': 'vector-menu-content-list', 'html-tooltip': 'A message tooltip-p-wikibase-otherprojects must exist for this to appear', label: 'In other projects', - 'label-id': 'p-wikibase-otherprojects-label', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': ` diff --git a/stories/MenuTabs.stories.data.js b/stories/MenuTabs.stories.data.js index 7ef8d41..3b9f02c 100644 --- a/stories/MenuTabs.stories.data.js +++ b/stories/MenuTabs.stories.data.js @@ -9,9 +9,7 @@ import { htmlUserLanguageAttributes } from './utils'; */ export const pageActionsData = { id: 'p-views', - class: 'vector-menu-tabs vectorTabs', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-views-label', + class: 'vector-menu-tabs', label: 'Views', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • @@ -32,9 +30,7 @@ You can view its source [⌃⌥e]" accesskey="e">View source
    • */ export const namespaceTabsData = { id: 'p-namespaces', - class: 'vector-menu-tabs vectorTabs', - 'list-classes': 'vector-menu-content-list', - 'label-id': 'p-namespaces-label', + class: 'vector-menu-tabs', label: 'Namespaces', 'html-user-language-attributes': htmlUserLanguageAttributes, 'html-items': `
  • Main page
    • diff --git a/stories/types.js b/stories/types.js index 9ae080d..8e03958 100644 --- a/stories/types.js +++ b/stories/types.js @@ -52,12 +52,10 @@ /** * @typedef {Object} MenuDefinition * @property {string} id - * @property {string} label-id * @property {string} label * @property {string} html-items * @property {string} [html-tooltip] * @property {string} [class] of menu - * @property {string} list-classes of the unordered list element inside the menu * @property {string} [html-user-language-attributes] * @property {boolean} [is-dropdown] * @property {string} [html-after-portal] Additional HTML specific to portal menus. diff --git a/tests/phpunit/integration/SkinVectorTest.php b/tests/phpunit/integration/SkinVectorTest.php index 75c0e40..35143bd 100644 --- a/tests/phpunit/integration/SkinVectorTest.php +++ b/tests/phpunit/integration/SkinVectorTest.php @@ -55,15 +55,23 @@ class SkinVectorTest extends MediaWikiIntegrationTestCase { $vectorTemplate = $this->provideVectorTemplateObject(); $this->setTemporaryHook( 'PersonalUrls', [ function ( &$personal_urls, &$title, $skin ) { - $personal_urls = []; + $personal_urls = [ + 'pt-1' => [ 'text' => 'pt1' ], + ]; } ] ); $this->setTemporaryHook( 'SkinTemplateNavigation', [ function ( &$skinTemplate, &$content_navigation ) { $content_navigation = [ - 'actions' => [], - 'namespaces' => [], - 'variants' => [], + 'actions' => [ + 'action-1' => [] + ], + 'namespaces' => [ + 'ns-1' => [] + ], + 'variants' => [ + 'variant-1' => [] + ], 'views' => [], ]; } @@ -78,15 +86,12 @@ class SkinVectorTest extends MediaWikiIntegrationTestCase { [ // Provided by core 'id' => 'p-views', - 'class' => 'mw-portlet mw-portlet-views emptyPortlet vector-menu vector-menu-tabs vectorTabs', + 'class' => 'mw-portlet mw-portlet-views emptyPortlet vector-menu vector-menu-tabs', 'html-tooltip' => '', 'html-items' => '', 'html-after-portal' => '', 'label' => $context->msg( 'views' )->text(), - - // provided by VECTOR 'label-id' => 'p-views-label', - 'list-classes' => 'vector-menu-content-list', 'is-dropdown' => false, ], $views @@ -95,19 +100,19 @@ class SkinVectorTest extends MediaWikiIntegrationTestCase { $variants = $props['data-variants']; $actions = $props['data-page-actions-more']; $this->assertSame( - 'mw-portlet mw-portlet-namespaces emptyPortlet vector-menu vector-menu-tabs vectorTabs', + 'mw-portlet mw-portlet-namespaces vector-menu vector-menu-tabs', $namespaces['class'] ); $this->assertSame( - 'mw-portlet mw-portlet-variants emptyPortlet vector-menu vector-menu-dropdown vectorMenu', + 'mw-portlet mw-portlet-variants vector-menu vector-menu-dropdown', $variants['class'] ); $this->assertSame( - 'mw-portlet mw-portlet-cactions emptyPortlet vector-menu vector-menu-dropdown vectorMenu', + 'mw-portlet mw-portlet-cactions vector-menu vector-menu-dropdown', $actions['class'] ); $this->assertSame( - 'mw-portlet mw-portlet-personal emptyPortlet vector-menu', + 'mw-portlet mw-portlet-personal vector-menu', $props['data-personal-menu']['class'] ); }