View file modules/syntaxhighlighter/tests/syntaxhighlighter_tests.html

File size: 6.44Kb
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>SyntaxHighlighter Highlight Tests</title>

	<!-- jQuery & QUnit -->
	<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
	<script type="text/javascript" src="js/qunit.js"></script>
	<link type="text/css" rel="stylesheet" href="js/qunit.css"/>

	<!-- SyntaxHighlighter -->
	<script type="text/javascript" src="/sh/scripts/XRegExp.js"></script> <!-- XRegExp is bundled with the final shCore.js during build -->
	<script type="text/javascript" src="/sh/scripts/shCore.js"></script>
	<script type="text/javascript" src="/sh/scripts/shLegacy.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushAppleScript.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushAS3.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushBash.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushColdFusion.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushCpp.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushCSharp.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushCss.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushDelphi.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushDiff.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushErlang.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushGroovy.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushJava.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushJavaFx.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushJScript.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushPerl.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushPhp.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushPlain.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushPowerShell.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushPython.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushRuby.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushSass.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushScala.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushSql.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushVb.js"></script>
	<script type="text/javascript" src="/sh/scripts/shBrushXml.js"></script>

	<link type="text/css" rel="stylesheet" href="/sh/styles/shCoreDefault.css"/>
</head>

<body>

<h1 id="qunit-header">SyntaxHighlighter Highlight Lines Test</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>

<button id="interaction">Run interaction tests</button>

<div id="output">
</div>

<style>
body {
	background: white;
}

#interaction {
	margin-top: 1em;
	padding: 1em;
	font-size: 1.5em;
}

.test-wrap {
	width: 45%;
	height: 400px;
	overflow: auto;
	float: left;
	margin: 1em 1em 0 0;
	border: 5px solid silver;
	background: gray;
	font-family: Helvetica;
}

.test-wrap h3 {
	margin: 1em 0 0 1em;
	color: white;
	font-size: 1em;
	font-weight: normal;
}
</style>

<script type="text/javascript">
var testQueue = [],
	renderTests = [
		'001_basic',
		'002_brushes',
		'003_script_tag',
		'004_url_parsing',
		'005_no_gutter',
		'006_pad_line_numbers',
		'007_collapse',
		'008_first_line',
		'009_class_name',
		'010_highlight',
		'011_smart_tabs',
		'012_server_side',
		'013_html_script',
		'014_legacy'
	],
	interactionTests = [
		'007_collapse_interaction'
	]
	;

function queue(func)
{
	testQueue.push(func);
};

function ok_sh($sh)
{
	ok($sh.length > 0, 'Element present');
	ok($sh.is('div'), 'Element is DIV');
	ok($sh.find('> div').is('.syntaxhighlighter'), 'Nested DIV is a .syntaxhighlighter');
};

function ok_toolbar($sh)
{
	var $target = $sh.find('> .syntaxhighlighter > .toolbar');
	ok($target.length > 0, 'Toolbar present');
	ok($target.is(':visible'), 'Toolbar visible');
};

function ok_caption($sh, value)
{
	var $target = $sh.find('> .syntaxhighlighter > table > caption');
	ok($target.length > 0, 'Caption present');
	ok($target.is(':visible'), 'Caption visible');
	
	if (value != null)
		equals($target.text(), value, 'Caption text');
};

function ok_gutter($sh)
{
	var $target = $sh.find('> .syntaxhighlighter > table > tbody > tr > .gutter');
	ok($target.length > 0, 'Gutter present');
	ok($target.is(':visible'), 'Gutter visible');
};

function ok_code($sh)
{
	var $target = $sh.find('> .syntaxhighlighter > table > tbody > tr > .code');
	ok($target.length > 0, 'Code present');
	ok($target.is(':visible'), 'Code visible');
};

function ok_collapsed($sh)
{
	ok($sh.find('> .syntaxhighlighter.collapsed').length == 1, '.collapsed present');
};

function loadTests(tests, addHtml)
{
	var html = '';
	
	$.each(tests, function(index)
	{
		var name = this;
		
		if (addHtml != false)
		{
			html += '<div class="test-wrap">\n'
			html += '<h3>' + name + '</h3>\n';
		}
		
		$.ajax({
			url: 'cases/' + name + '.html',
			type: 'GET',
			dataType: 'text',
			async: false,
			success: function(data)
			{
				html += data;
			},
			error: function()
			{
				html += '<p>Not found...</p>';
			}
		});
		
		if (addHtml != false)
		{
			html += '</div>\n';
		
			if (index % 2 != 0)
				html += '<div style="clear:both"></div>\n';
		}
	});

	//
	// Looks like .html() is producing different results when it comes to
	// content that has <script /> which type is NOT "text/javascript".
	// $('#output').html(html);
	//
	$('#output')[0].innerHTML += html;
		
	//
	// However, if HTML assigned to to .innerHTML container <script/> tags,
	// they are not executed, so we have to manually walk all of them and
	// eval() the content.
	//
	$('#output script[type="text/javascript"][class!="executed"]').each(function()
	{
		eval($(this).text() || $(this).html());
		$(this).addClass('executed')
	});
};

function runTestQueue()
{
	
	$.each(testQueue, function()
	{
		this.apply(null);
	});
	
	testQueue = [];
};

$(document).ready(function()
{
	loadTests(renderTests);
	SyntaxHighlighter.highlight();
	runTestQueue();
	
	$('#interaction').click(function()
	{
		loadTests(interactionTests, false /* addHtml */);
		runTestQueue();
	});
});
</script>

</body>
</html>