Snippets/Preview any page as a template

How to use Snippets
List of Snippets

Preview any page as a template
Language(s):	JavaScript
Compatible with:	MediaWiki 1.37+ (vector)

Description

The Extension:TemplateSandbox extension provides a "Preview page with this template" box on the edit page of any template page (including Lua modules, and TemplateStyles CSS pages). However, if a different page is transcluded or otherwise used elsewhere, then this box does not appear.

This snippet can be used to edit a regular called "Foo", and preview the page "Bar" that transcludes it. For example to preview the output of {{:Foo}} as used on page "Bar".

Code

/**
 * Preview any page as a template
 *
 * Required modules: mediawiki.util
 *
 * @source https://www.mediawiki.org/wiki/Snippets/Preview_any_page_as_a_template
 * @author Jackmcbarn
 * @author Krinkle
 * @version 2010-07-10
 */
var $tplTemplate = $('#wpTemplateSandboxTemplate');
var $tplPage = $('#wpTemplateSandboxPage');
if ($tplTemplate.prop('type') === 'hidden') {
	$('#templatesandbox-editform').prepend('<legend>Preview page with this template</legend>');
	$tplTemplate
		.attr({
			type: 'text',
			size: '60',
			spellcheck: 'true'
		})
		.wrap('<label>Template name: </label>')
		.after('<br>');
	$tplPage
		.attr({
			type: 'text',
			size: '60',
			'data-mw-searchsuggest': '{"wrapAsLink":false}',
			class: 'mw-searchInput'
		})
		.wrap('<label>Page title: </label>')
		.after(' <input name="wpTemplateSandboxPreview" value="Show preview" type="submit">');
}