Merge "Class names with hyphens preferred over camel case"

includes/VectorTemplate.php

@@ -460,10 +460,12 @@ class VectorTemplate extends BaseTemplate {
 		bool $setLabelToSelected = false
 	) : array {
 		$class = ( count( $urls ) == 0 ) ? 'emptyPortlet' : '';
+		// FIXME: All menus should carry vector-menu, but this can only be done when
+		// Menu.less CSS has been generalised to not include layout.
 		$extraClasses = [
-			self::MENU_TYPE_DROPDOWN => 'vectorMenu-dropdown vectorMenu',
+			self::MENU_TYPE_DROPDOWN => 'vector-menu-dropdown vectorMenu',
-			self::MENU_TYPE_TABS => 'vectorMenu-tabs vectorTabs',
+			self::MENU_TYPE_TABS => 'vector-menu-tabs vectorTabs',
-			self::MENU_TYPE_DEFAULT => 'vectorMenu-default',
+			self::MENU_TYPE_DEFAULT => 'vector-menu',
 		];
 
 		$props = [

resources/skins.vector.styles/Menu.less

@@ -2,7 +2,7 @@
 @import 'mediawiki.mixins.less';
 
 /* Personal */
-.vectorMenu-default,
+.vector-menu,
 /* FIXME: Remove p-personal selector when cache has cleared. */
 #p-personal {
 	position: absolute;

resources/skins.vector.styles/MenuDropdown.less

@@ -4,7 +4,7 @@
 /* Variants and Actions */
 // FIXME: For cached HTML
 .vectorMenu,
-.vectorMenu-dropdown {
+.vector-menu-dropdown {
 	direction: ltr;
 	float: left;
 	cursor: pointer;

resources/skins.vector.styles/MenuTabs.less

@@ -8,7 +8,7 @@
 /* Namespaces and Views */
 // FIXME: For cached HTML
 .vectorTabs,
-.vectorMenu-tabs {
+.vector-menu-tabs {
 	// Tab separator: Outer start border (left in LTR) of tab row.
 	background-position: left bottom;
 	float: left;

stories/Menu.stories.data.js

@@ -6,7 +6,7 @@ import { htmluserlangattributes } from './utils';
  */
 const loggedOut = {
 	id: 'p-personal',
-	class: 'vectorMenu-default',
+	class: 'vector-menu',
 	'label-id': 'p-personal-label',
 	label: 'Personal tools',
 	'html-userlangattributes': htmluserlangattributes,
@@ -18,7 +18,7 @@ const loggedOut = {
  */
 const loggedInWithEcho = {
 	id: 'p-personal',
-	class: 'vectorMenu-default',
+	class: 'vector-menu',
 	'label-id': 'p-personal-label',
 	label: 'Personal tools',
 	'html-userlangattributes': htmluserlangattributes,
@@ -32,7 +32,7 @@ const ULS_LANGUAGE_SELECTOR = '<li class="uls-trigger active"><a href="#">Englis
  */
 const defaultMenu = {
 	id: 'p-generic',
-	class: 'vectorMenu-default',
+	class: 'vector-menu',
 	'label-id': 'p-generic-label',
 	label: 'Menu label',
 	'html-userlangattributes': htmluserlangattributes,
@@ -46,7 +46,7 @@ const defaultMenu = {
  */
 const loggedInWithULS = {
 	id: 'p-personal',
-	class: 'vectorMenu-default',
+	class: 'vector-menu',
 	'label-id': 'p-personal-label',
 	label: 'Personal tools',
 	'html-userlangattributes': htmluserlangattributes,

stories/MenuDropdown.stories.data.js

@@ -8,7 +8,7 @@ export { vectorMenuTemplate };
  */
 export const moreData = {
 	'is-dropdown': true,
-	class: 'vectorMenu-dropdown vectorMenu',
+	class: 'vector-menu-dropdown',
 	label: 'More',
 	id: 'p-cactions',
 	'label-id': 'p-cactions-label',
@@ -32,7 +32,7 @@ export const moreData = {
  */
 export const variantsData = {
 	'is-dropdown': true,
-	class: 'vectorMenu-dropdown vectorMenu',
+	class: 'vector-menu-dropdown',
 	label: '新加坡简体',
 	id: 'p-variants',
 	'label-id': 'p-variants-label',

stories/MenuTabs.stories.data.js

@@ -5,7 +5,7 @@ import { htmluserlangattributes } from './utils';
  */
 export const pageActionsData = {
 	id: 'p-views',
-	class: 'vectorMenu-tabs vectorTabs',
+	class: 'vector-menu-tabs vectorTabs',
 	'label-id': 'p-views-label',
 	label: 'Views',
 	'html-userlangattributes': htmluserlangattributes,
@@ -27,7 +27,7 @@ You can view its source [⌃⌥e]" accesskey="e">View source</a></li>
  */
 export const namespaceTabsData = {
 	id: 'p-namespaces',
-	class: 'vectorMenu-tabs vectorTabs',
+	class: 'vector-menu-tabs vectorTabs',
 	'label-id': 'p-namespaces-label',
 	label: 'Namespaces',
 	'html-userlangattributes': htmluserlangattributes,

tests/phpunit/integration/VectorTemplateTest.php

@@ -154,25 +154,25 @@ class VectorTemplateTest extends MediaWikiIntegrationTestCase {
 
 		$this->assertSame( $views, [
 			'id' => 'p-views',
-			'class' => 'emptyPortlet vectorMenu-tabs vectorTabs',
+			'class' => 'emptyPortlet vector-menu-tabs vectorTabs',
 			'label-id' => 'p-views-label',
 			'label' => 'Views',
 			'html-userlangattributes' => $langAttrs,
 			'html-items' => '',
-			'class' => 'emptyPortlet vectorMenu-tabs vectorTabs',
+			'class' => 'emptyPortlet vector-menu-tabs vectorTabs',
 			'is-dropdown' => false,
 		] );
 
 		$variants = $props['data-variants'];
 		$actions = $props['data-page-actions-more'];
 		$this->assertSame( $namespaces['class'],
-			'emptyPortlet vectorMenu-tabs vectorTabs' );
+			'emptyPortlet vector-menu-tabs vectorTabs' );
 		$this->assertSame( $variants['class'],
-			'emptyPortlet vectorMenu-dropdown vectorMenu' );
+			'emptyPortlet vector-menu-dropdown vectorMenu' );
 		$this->assertSame( $actions['class'],
-			'emptyPortlet vectorMenu-dropdown vectorMenu' );
+			'emptyPortlet vector-menu-dropdown vectorMenu' );
 		$this->assertSame( $props['data-personal-menu']['class'],
-			'emptyPortlet vectorMenu-default' );
+			'emptyPortlet vector-menu' );
 	}
 
 }