Page MenuHomePhabricator

Refactor: Consolidate preview template outer container
Closed, ResolvedPublic5 Estimated Story Points


Note: Parent task T186129 may require a larger refactor so depending on timeline we may want to wait until that has happened before working on this task.

The Popup's empty / generic / error / disambiguation "preview" and page preview templates have similar outer divs and LESS. This task encompasses the work to make a new popup template that accepts an unescaped HTML "children" string and update the LESS so that empty / generic / error / disambiguation LESS is in preview.less, page preview LESS is in pagePreview.less, and generic popup LESS is in popup.less.

	<div class='mwe-popups mwe-popups-type-${ type }' role='tooltip' aria-hidden>
		<div class='mwe-popups-container'>
			<div class='mw-ui-icon mw-ui-icon-element mw-ui-icon-preview-${ type }'></div>
			${ showTitle ? `<strong class='mwe-popups-title'>${ title }</strong>` : '' }
			<a href='${ url }' class='mwe-popups-extract'>
					<span class='mwe-popups-message'>${ extractMsg }</span>
				<a href='${ url }' class='mwe-popups-read-link'>${ linkMsg }</a>
		<div class='mwe-popups' role='tooltip' aria-hidden>
			<div class='mwe-popups-container'>
				${ hasThumbnail ? `<a href='${ url }' class='mwe-popups-discreet'></a>` : '' }
				<a dir='${ languageDirection }' lang='${ languageCode }' class='mwe-popups-extract' href='${ url }'></a>
					<a class='mwe-popups-settings-icon mw-ui-icon mw-ui-icon-element mw-ui-icon-popups-settings'></a>


  • A generic popup container element is extracted
  • The generic popup accepts an unescaped HTML string
  • LESS is reorgnaized into three files: popup.less for the generic container, preview.less for empty / generic / error / disambiguation LESS, pagePreview.less for page preveiw LESS.


  • Verify that no regressions are introduced by checking page previews, disambiguation previews, and error previews in LTR, RTL, and mixed locales in each of the four orientations for portrait and landscape.

Event Timeline

I wonder if this would happen naturally as part of T186129? Can we fold this into that task or make this a subtask? I'd like to understand how we are planning to provide that support before doing this, in case we realise a drastic change is needed.

Jdlrobson renamed this task from Consolidate preview template outer container to Refactor: Consolidate preview template outer container.Apr 12 2018, 3:40 PM
Jdlrobson triaged this task as Medium priority.
Jdlrobson updated the task description. (Show Details)
Niedzielski set the point value for this task to 5.

@Niedzielski to add AC and QA points. Primary objective is to create a common popup container.

Change 440025 had a related patch set uploaded (by Niedzielski; owner: Stephen Niedzielski):
[mediawiki/extensions/Popups@master] Hygiene: refactor common popup template code

Change 440025 merged by jenkins-bot:
[mediawiki/extensions/Popups@master] Hygiene: refactor common popup template code

Olga will verify page previews is working correctly (quick general QA)

Looks good, resolving.