SearchBox: Add data-search-loc attribute

The mediawiki.searchSuggest protocol part of the SearchSatisfaction
instrumentation reads the value of an element with the "data-search-loc"
attribute and sets the event's inputLocation property accordingly.

Set the appropriate value for the attribute in
SkinVector::getTemplateData and render the attribute in
the SearchBox.mustache template.

Bug: T256100
Change-Id: I0edbd8906a042072b2055adc2889b083b2c6cac4

includes/Constants.php

@@ -133,6 +133,31 @@ final class Constants {
 	 */
 	public const QUERY_PARAM_SKIN_VERSION = 'useskinversion';
 
+	/**
+	 * The `mediawiki.searchSuggest` protocol piece of the SearchSatisfaction instrumention reads
+	 * the value of an element with the "data-search-loc" attribute and set the event's
+	 * `inputLocation` property accordingly.
+	 *
+	 * When the search widget is moved as part of the "Search 1: Search widget move" feature, the
+	 * "data-search-loc" attribute is set to this value.
+	 *
+	 * See also:
+	 * - https://www.mediawiki.org/wiki/Reading/Web/Desktop_Improvements/Features#Search_1:_Search_widget_move
+	 * - https://phabricator.wikimedia.org/T261636 and https://phabricator.wikimedia.org/T256100
+	 * - https://gerrit.wikimedia.org/g/mediawiki/core/+/61d36def2d7adc15c88929c824b444f434a0511a/resources/src/mediawiki.searchSuggest/searchSuggest.js#106
+	 *
+	 * @var string
+	 */
+	public const SEARCH_BOX_INPUT_LOCATION_MOVED = 'header-moved';
+
+	/**
+	 * Similar to `Constants::SEARCH_BOX_INPUT_LOCATION_MOVED`, when the search widget hasn't been
+	 * moved, the "data-search-loc" attribute is set to this value.
+	 *
+	 * @var string
+	 */
+	public const SEARCH_BOX_INPUT_LOCATION_DEFAULT = 'header-navigation';
+
 	/**
 	 * This class is for namespacing constants only. Forbid construction.
 	 * @throws FatalError

includes/SkinVector.php

@@ -122,6 +122,11 @@ class SkinVector extends SkinMustache {
 		// From Skin::getNewtalks(). Always returns string, cast to null if empty.
 		$newTalksHtml = $skin->getNewtalks() ?: null;
 
+		$isSearchInHeader = $featureManager->isFeatureEnabled( Constants::FEATURE_SEARCH_IN_HEADER );
+		$inputLocation = $isSearchInHeader
+			? Constants::SEARCH_BOX_INPUT_LOCATION_MOVED
+			: Constants::SEARCH_BOX_INPUT_LOCATION_DEFAULT;
+
 		$commonSkinData = parent::getTemplateData() + [
 			'page-langcode' => $title->getPageViewLanguage()->getHtmlCode(),
 			'page-isarticle' => (bool)$out->isArticle(),
@@ -133,7 +138,9 @@ class SkinVector extends SkinMustache {
 
 			'html-categories' => $skin->getCategories(),
 			'data-footer' => $this->getFooterData(),
-			'is-search-in-header' => $featureManager->isFeatureEnabled( Constants::FEATURE_SEARCH_IN_HEADER ),
+
+			'is-search-in-header' => $isSearchInHeader,
+			'input-location' => $inputLocation,
 
 			// Header
 			'data-logos' => ResourceLoaderSkinModule::getAvailableLogos( $this->getConfig() ),

includes/templates/SearchBox.mustache

@@ -6,7 +6,7 @@
 		<label for="searchInput">{{msg-search}}</label>
 	</h3>
 	<form action="{{form-action}}" id="searchform">
-		<div id="simpleSearch">
+		<div id="simpleSearch"{{#input-location}} data-search-loc="{{.}}"{{/input-location}}>
 			{{{html-input}}}
 			<input type="hidden" name="title" value="{{page-title}}">
 			{{!	We construct two buttons (for 'go' and 'fulltext' search modes), but only one will be

stories/types.js

@@ -45,6 +45,8 @@
  * @property {string|null} page-title the title of the search page
  * @property {string|null} html-button-search-fallback
  * @property {string|null} html-button-search
+ * @property {string} [input-location] An identifier corresponding the position of the search
+ *  widget on the page, e.g. "header-navigation"
  */
 
 /**