3 سال پیش · 91c9c0cec3
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 
				 **/node_modules/
			
 
				 **/out/
			
 
				 **/release/
			
 
				+/test/manual/generated/**
			
--- a/.prettierignore
+++ b/.prettierignore
@@ -11,6 +11,6 @@
 
				 /samples/browser-esm-webpack-typescript-react/dist/*.js
			
 
				 /src/typescript/lib/
			
 
				 /test/manual/samples-all.generated.js
			
 
				-/test/manual/playground.generated/
			
 
				+/test/manual/generated/
			
 
				 /website/lib/
			
 
				 /website/typedoc/monaco.d.ts
			
--- a/build/simpleserver.js
+++ b/build/simpleserver.js
@@ -9,7 +9,7 @@ const fs = require('fs');
 
				 const path = require('path');
			
 
				 const http = require('http');
			
 
				 const yaserver = require('yaserver');
			
 
				-const { REPO_ROOT } = require('./utils');
			
 
				+const { REPO_ROOT, ensureDir } = require('./utils');
			
 
				 
			
 
				 const WEBSITE_GENERATED_PATH = path.join(REPO_ROOT, 'website/playground/new-samples');
			
 
				 
			
@@ -73,7 +73,7 @@ function generateTestSamplesTask() {
 
				 			'<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->',
			
 
				 			'<html>',
			
 
				 			'<head>',
			
 
				-			'	<base href="..">',
			
 
				+			'	<base href="../..">',
			
 
				 			'	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />',
			
 
				 			'</head>',
			
 
				 			'<body>',
			
@@ -84,7 +84,7 @@ function generateTestSamplesTask() {
 
				 			'',
			
 
				 			'/*----------------------------------------SAMPLE CSS END*/',
			
 
				 			'</style>',
			
 
				-			'<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>',
			
 
				+			'<a class="loading-opts" href="generated/playground/index.html">[&lt;&lt; BACK]</a> <br/>',
			
 
				 			'THIS IS A GENERATED FILE VIA `npm run simpleserver`',
			
 
				 			'',
			
 
				 			'<div id="bar" style="margin-bottom: 6px;"></div>',
			
@@ -113,10 +113,13 @@ function generateTestSamplesTask() {
 
				 			'</body>',
			
 
				 			'</html>'
			
 
				 		];
			
 
				-		fs.writeFileSync(
			
 
				-			path.join(REPO_ROOT, 'test/manual/playground.generated/' + sampleId + '.html'),
			
 
				-			result.join('\n')
			
 
				+
			
 
				+		const destination = path.join(
			
 
				+			REPO_ROOT,
			
 
				+			'test/manual/generated/playground/' + sampleId + '.html'
			
 
				 		);
			
 
				+		ensureDir(path.dirname(destination));
			
 
				+		fs.writeFileSync(destination, result.join('\n'));
			
 
				 		locations.push({
			
 
				 			path: sampleId + '.html',
			
 
				 			name: sample.chapter + ' &gt; ' + sample.name
			
@@ -128,7 +131,7 @@ function generateTestSamplesTask() {
 
				 		'<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->',
			
 
				 		'<html>',
			
 
				 		'<head>',
			
 
				-		'	<base href="..">',
			
 
				+		'	<base href="../..">',
			
 
				 		'</head>',
			
 
				 		'<body>',
			
 
				 		'<a class="loading-opts" href="index.html">[&lt;&lt; BACK]</a><br/>',
			
@@ -136,7 +139,7 @@ function generateTestSamplesTask() {
 
				 		locations
			
 
				 			.map(function (location) {
			
 
				 				return (
			
 
				-					'<a class="loading-opts" href="playground.generated/' +
			
 
				+					'<a class="loading-opts" href="generated/playground/' +
			
 
				 					location.path +
			
 
				 					'">' +
			
 
				 					location.name +
			
@@ -150,7 +153,7 @@ function generateTestSamplesTask() {
 
				 		'</html>'
			
 
				 	];
			
 
				 	fs.writeFileSync(
			
 
				-		path.join(REPO_ROOT, 'test/manual/playground.generated/index.html'),
			
 
				+		path.join(REPO_ROOT, 'test/manual/generated/playground/index.html'),
			
 
				 		index.join('\n')
			
 
				 	);
			
 
				 }
			
--- a/test/manual/index.html
+++ b/test/manual/index.html
@@ -6,7 +6,7 @@
 
				 	</head>
			
 
				 	<body>
			
 
				 		Jump to:
			
 
				-		<a class="loading-opts" href="./playground.generated/index.html">[PLAYGROUND]</a>
			
 
				+		<a class="loading-opts" href="./generated/playground/index.html">[PLAYGROUND]</a>
			
 
				 		&#160;|&#160;
			
 
				 		<a class="loading-opts" href="./mouse-fixed.html">[fixed element]</a>
			
 
				 		&#160;|&#160;
			
--- a/test/manual/playground.generated/creating-the-diffeditor-hello-diff-world.html
+++ b/test/manual/playground.generated/creating-the-diffeditor-hello-diff-world.html
@@ -1,52 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var originalModel = monaco.editor.createModel('heLLo world!', 'text/plain');
			
 
				-var modifiedModel = monaco.editor.createModel('hello orlando!', 'text/plain');
			
 
				-
			
 
				-var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'));
			
 
				-diffEditor.setModel({
			
 
				-	original: originalModel,
			
 
				-	modified: modifiedModel
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-diffeditor-inline-diff-example.html
+++ b/test/manual/playground.generated/creating-the-diffeditor-inline-diff-example.html
@@ -1,64 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var originalModel = monaco.editor.createModel(
			
 
				-	'This line is removed on the right.\njust some text\nabcd\nefgh\nSome more text',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-var modifiedModel = monaco.editor.createModel(
			
 
				-	'just some text\nabcz\nzzzzefgh\nSome more text\nThis line is removed on the left.',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-
			
 
				-var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'), {
			
 
				-	// You can optionally disable the resizing
			
 
				-	enableSplitViewResizing: false,
			
 
				-
			
 
				-	// Render the diff inline
			
 
				-	renderSideBySide: false
			
 
				-});
			
 
				-diffEditor.setModel({
			
 
				-	original: originalModel,
			
 
				-	modified: modifiedModel
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-diffeditor-multi-line-example.html
+++ b/test/manual/playground.generated/creating-the-diffeditor-multi-line-example.html
@@ -1,61 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var originalModel = monaco.editor.createModel(
			
 
				-	'This line is removed on the right.\njust some text\nabcd\nefgh\nSome more text',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-var modifiedModel = monaco.editor.createModel(
			
 
				-	'just some text\nabcz\nzzzzefgh\nSome more text.\nThis line is removed on the left.',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-
			
 
				-var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'), {
			
 
				-	// You can optionally disable the resizing
			
 
				-	enableSplitViewResizing: false
			
 
				-});
			
 
				-diffEditor.setModel({
			
 
				-	original: originalModel,
			
 
				-	modified: modifiedModel
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-diffeditor-navigating-a-diff.html
+++ b/test/manual/playground.generated/creating-the-diffeditor-navigating-a-diff.html
@@ -1,68 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// The diff editor offers a navigator to jump between changes. Once the diff is computed the <em>next()</em> and <em>previous()</em> method allow navigation. By default setting the selection in the editor manually resets the navigation state.
			
 
				-var originalModel = monaco.editor.createModel(
			
 
				-	'just some text\n\nHello World\n\nSome more text',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-var modifiedModel = monaco.editor.createModel(
			
 
				-	'just some Text\n\nHello World\n\nSome more changes',
			
 
				-	'text/plain'
			
 
				-);
			
 
				-
			
 
				-var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'));
			
 
				-diffEditor.setModel({
			
 
				-	original: originalModel,
			
 
				-	modified: modifiedModel
			
 
				-});
			
 
				-
			
 
				-var navi = monaco.editor.createDiffNavigator(diffEditor, {
			
 
				-	followsCaret: true, // resets the navigator state when the user selects something in the editor
			
 
				-	ignoreCharChanges: true // jump from line to line
			
 
				-});
			
 
				-
			
 
				-window.setInterval(function () {
			
 
				-	navi.next();
			
 
				-}, 2000);
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-editor-editor-basic-options.html
+++ b/test/manual/playground.generated/creating-the-editor-editor-basic-options.html
@@ -1,63 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Through the options literal, the behaviour of the editor can be easily customized.
			
 
				-// Here are a few examples of config options that can be passed to the editor.
			
 
				-// You can also call editor.updateOptions at any time to change the options.
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: "// First line\nfunction hello() {\n\talert('Hello world!');\n}\n// Last line",
			
 
				-	language: 'javascript',
			
 
				-
			
 
				-	lineNumbers: 'off',
			
 
				-	roundedSelection: false,
			
 
				-	scrollBeyondLastLine: false,
			
 
				-	readOnly: false,
			
 
				-	theme: 'vs-dark'
			
 
				-});
			
 
				-setTimeout(function () {
			
 
				-	editor.updateOptions({
			
 
				-		lineNumbers: 'on'
			
 
				-	});
			
 
				-}, 2000);
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-editor-hard-wrapping.html
+++ b/test/manual/playground.generated/creating-the-editor-hard-wrapping.html
--- a/test/manual/playground.generated/creating-the-editor-hello-world.html
+++ b/test/manual/playground.generated/creating-the-editor-hello-world.html
@@ -1,53 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// The Monaco Editor can be easily created, given an
			
 
				-// empty container and an options literal.
			
 
				-// Two members of the literal are "value" and "language".
			
 
				-// The editor takes the full size of its container.
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: "function hello() {\n\talert('Hello world!');\n}",
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/creating-the-editor-syntax-highlighting-for-html-elements.html
+++ b/test/manual/playground.generated/creating-the-editor-syntax-highlighting-for-html-elements.html
@@ -1,82 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<pre id="code" data-lang="text/css" style="width: 500px">
			
 
				-/* Some example CSS */
			
 
				-
			
 
				-@import url("something.css");
			
 
				-
			
 
				-body {
			
 
				-  margin: 0;
			
 
				-  padding: 3em 6em;
			
 
				-  font-family: tahoma, arial, sans-serif;
			
 
				-  color: #000;
			
 
				-}
			
 
				-
			
 
				-#navigation a {
			
 
				-  font-weight: bold;
			
 
				-  text-decoration: none !important;
			
 
				-}
			
 
				-
			
 
				-h1 {
			
 
				-  font-size: 2.5em;
			
 
				-}
			
 
				-
			
 
				-h2 {
			
 
				-  font-size: 1.7em;
			
 
				-}
			
 
				-
			
 
				-h1:before, h2:before {
			
 
				-  content: "some contents";
			
 
				-}
			
 
				-
			
 
				-code {
			
 
				-  font-family: courier, monospace;
			
 
				-  font-size: 80%;
			
 
				-  color: #418A8A;
			
 
				-}
			
 
				-</pre>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// The colorizeElement-function will read the data-lang-attribute
			
 
				-// from the element to select the correct language mode. In this
			
 
				-// sample it is text/css.
			
 
				-monaco.editor.colorizeElement(document.getElementById('code'));
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/customizing-the-appearence-exposed-colors.html
+++ b/test/manual/playground.generated/customizing-the-appearence-exposed-colors.html
@@ -1,194 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// The editor colors can be customized through CSS or through JS
			
 
				-
			
 
				-monaco.editor.defineTheme('myTheme', {
			
 
				-	base: 'vs',
			
 
				-	inherit: true,
			
 
				-	rules: [{ background: 'EDF9FA' }],
			
 
				-	colors: {
			
 
				-		'editor.foreground': '#000000',
			
 
				-		'editor.background': '#EDF9FA',
			
 
				-		'editorCursor.foreground': '#8B0000',
			
 
				-		'editor.lineHighlightBackground': '#0000FF20',
			
 
				-		'editorLineNumber.foreground': '#008800',
			
 
				-		'editor.selectionBackground': '#88000030',
			
 
				-		'editor.inactiveSelectionBackground': '#88000015'
			
 
				-	}
			
 
				-});
			
 
				-monaco.editor.setTheme('myTheme');
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: 'My to-do list:\n* buy milk\n* buy coffee\n* write awesome code',
			
 
				-	language: 'text/plain',
			
 
				-	fontFamily: 'Arial',
			
 
				-	fontSize: 20
			
 
				-});
			
 
				-
			
 
				-// A list of color names:
			
 
				-('foreground'); // Overall foreground color. This color is only used if not overridden by a component.
			
 
				-('errorForeground'); // Overall foreground color for error messages. This color is only used if not overridden by a component.
			
 
				-('descriptionForeground'); // Foreground color for description text providing additional information, for example for a label.
			
 
				-('focusBorder'); // Overall border color for focused elements. This color is only used if not overridden by a component.
			
 
				-('contrastBorder'); // An extra border around elements to separate them from others for greater contrast.
			
 
				-('contrastActiveBorder'); // An extra border around active elements to separate them from others for greater contrast.
			
 
				-('selection.background'); // The background color of text selections in the workbench (e.g. for input fields or text areas). Note that this does not apply to selections within the editor.
			
 
				-('textSeparator.foreground'); // Color for text separators.
			
 
				-('textLink.foreground'); // Foreground color for links in text.
			
 
				-('textLink.activeForeground'); // Foreground color for active links in text.
			
 
				-('textPreformat.foreground'); // Foreground color for preformatted text segments.
			
 
				-('textBlockQuote.background'); // Background color for block quotes in text.
			
 
				-('textBlockQuote.border'); // Border color for block quotes in text.
			
 
				-('textCodeBlock.background'); // Background color for code blocks in text.
			
 
				-('widget.shadow'); // Shadow color of widgets such as find/replace inside the editor.
			
 
				-('input.background'); // Input box background.
			
 
				-('input.foreground'); // Input box foreground.
			
 
				-('input.border'); // Input box border.
			
 
				-('inputOption.activeBorder'); // Border color of activated options in input fields.
			
 
				-('input.placeholderForeground'); // Input box foreground color for placeholder text.
			
 
				-('inputValidation.infoBackground'); // Input validation background color for information severity.
			
 
				-('inputValidation.infoBorder'); // Input validation border color for information severity.
			
 
				-('inputValidation.warningBackground'); // Input validation background color for information warning.
			
 
				-('inputValidation.warningBorder'); // Input validation border color for warning severity.
			
 
				-('inputValidation.errorBackground'); // Input validation background color for error severity.
			
 
				-('inputValidation.errorBorder'); // Input validation border color for error severity.
			
 
				-('dropdown.background'); // Dropdown background.
			
 
				-('dropdown.foreground'); // Dropdown foreground.
			
 
				-('dropdown.border'); // Dropdown border.
			
 
				-('list.focusBackground'); // List/Tree background color for the focused item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.focusForeground'); // List/Tree foreground color for the focused item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.activeSelectionBackground'); // List/Tree background color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.activeSelectionForeground'); // List/Tree foreground color for the selected item when the list/tree is active. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.inactiveSelectionBackground'); // List/Tree background color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.inactiveSelectionForeground'); // List/Tree foreground color for the selected item when the list/tree is inactive. An active list/tree has keyboard focus, an inactive does not.
			
 
				-('list.hoverBackground'); // List/Tree background when hovering over items using the mouse.
			
 
				-('list.hoverForeground'); // List/Tree foreground when hovering over items using the mouse.
			
 
				-('list.dropBackground'); // List/Tree drag and drop background when moving items around using the mouse.
			
 
				-('list.highlightForeground'); // List/Tree foreground color of the match highlights when searching inside the list/tree.
			
 
				-('pickerGroup.foreground'); // Quick picker color for grouping labels.
			
 
				-('pickerGroup.border'); // Quick picker color for grouping borders.
			
 
				-('button.foreground'); // Button foreground color.
			
 
				-('button.background'); // Button background color.
			
 
				-('button.hoverBackground'); // Button background color when hovering.
			
 
				-('badge.background'); // Badge background color. Badges are small information labels, e.g. for search results count.
			
 
				-('badge.foreground'); // Badge foreground color. Badges are small information labels, e.g. for search results count.
			
 
				-('scrollbar.shadow'); // Scrollbar shadow to indicate that the view is scrolled.
			
 
				-('scrollbarSlider.background'); // Slider background color.
			
 
				-('scrollbarSlider.hoverBackground'); // Slider background color when hovering.
			
 
				-('scrollbarSlider.activeBackground'); // Slider background color when active.
			
 
				-('progressBar.background'); // Background color of the progress bar that can show for long running operations.
			
 
				-('editor.background'); // Editor background color.
			
 
				-('editor.foreground'); // Editor default foreground color.
			
 
				-('editorWidget.background'); // Background color of editor widgets, such as find/replace.
			
 
				-('editorWidget.border'); // Border color of editor widgets. The color is only used if the widget chooses to have a border and if the color is not overridden by a widget.
			
 
				-('editor.selectionBackground'); // Color of the editor selection.
			
 
				-('editor.selectionForeground'); // Color of the selected text for high contrast.
			
 
				-('editor.inactiveSelectionBackground'); // Color of the selection in an inactive editor.
			
 
				-('editor.selectionHighlightBackground'); // Color for regions with the same content as the selection.
			
 
				-('editor.findMatchBackground'); // Color of the current search match.
			
 
				-('editor.findMatchHighlightBackground'); // Color of the other search matches.
			
 
				-('editor.findRangeHighlightBackground'); // Color the range limiting the search.
			
 
				-('editor.hoverHighlightBackground'); // Highlight below the word for which a hover is shown.
			
 
				-('editorHoverWidget.background'); // Background color of the editor hover.
			
 
				-('editorHoverWidget.border'); // Border color of the editor hover.
			
 
				-('editorLink.activeForeground'); // Color of active links.
			
 
				-('diffEditor.insertedTextBackground'); // Background color for text that got inserted.
			
 
				-('diffEditor.removedTextBackground'); // Background color for text that got removed.
			
 
				-('diffEditor.insertedTextBorder'); // Outline color for the text that got inserted.
			
 
				-('diffEditor.removedTextBorder'); // Outline color for text that got removed.
			
 
				-('editorOverviewRuler.currentContentForeground'); // Current overview ruler foreground for inline merge-conflicts.
			
 
				-('editorOverviewRuler.incomingContentForeground'); // Incoming overview ruler foreground for inline merge-conflicts.
			
 
				-('editorOverviewRuler.commonContentForeground'); // Common ancestor overview ruler foreground for inline merge-conflicts.
			
 
				-('editor.lineHighlightBackground'); // Background color for the highlight of line at the cursor position.
			
 
				-('editor.lineHighlightBorder'); // Background color for the border around the line at the cursor position.
			
 
				-('editor.rangeHighlightBackground'); // Background color of highlighted ranges, like by quick open and find features.
			
 
				-('editorCursor.foreground'); // Color of the editor cursor.
			
 
				-('editorWhitespace.foreground'); // Color of whitespace characters in the editor.
			
 
				-('editorIndentGuide.background'); // Color of the editor indentation guides.
			
 
				-('editorLineNumber.foreground'); // Color of editor line numbers.
			
 
				-('editorLineNumber.activeForeground'); // Color of editor active line number.
			
 
				-('editorRuler.foreground'); // Color of the editor rulers.
			
 
				-('editorCodeLens.foreground'); // Foreground color of editor code lenses
			
 
				-('editorInlayHint.foreground'); // Foreground color of editor inlay hints
			
 
				-('editorInlayHint.background'); // Background color of editor inlay hints
			
 
				-('editorBracketMatch.background'); // Background color behind matching brackets
			
 
				-('editorBracketMatch.border'); // Color for matching brackets boxes
			
 
				-('editorOverviewRuler.border'); // Color of the overview ruler border.
			
 
				-('editorGutter.background'); // Background color of the editor gutter. The gutter contains the glyph margins and the line numbers.
			
 
				-('editorError.foreground'); // Foreground color of error squigglies in the editor.
			
 
				-('editorError.border'); // Border color of error squigglies in the editor.
			
 
				-('editorWarning.foreground'); // Foreground color of warning squigglies in the editor.
			
 
				-('editorWarning.border'); // Border color of warning squigglies in the editor.
			
 
				-('editorMarkerNavigationError.background'); // Editor marker navigation widget error color.
			
 
				-('editorMarkerNavigationWarning.background'); // Editor marker navigation widget warning color.
			
 
				-('editorMarkerNavigation.background'); // Editor marker navigation widget background.
			
 
				-('editorSuggestWidget.background'); // Background color of the suggest widget.
			
 
				-('editorSuggestWidget.border'); // Border color of the suggest widget.
			
 
				-('editorSuggestWidget.foreground'); // Foreground color of the suggest widget.
			
 
				-('editorSuggestWidget.selectedBackground'); // Background color of the selected entry in the suggest widget.
			
 
				-('editorSuggestWidget.highlightForeground'); // Color of the match highlights in the suggest widget.
			
 
				-('editor.wordHighlightBackground'); // Background color of a symbol during read-access, like reading a variable.
			
 
				-('editor.wordHighlightStrongBackground'); // Background color of a symbol during write-access, like writing to a variable.
			
 
				-('peekViewTitle.background'); // Background color of the peek view title area.
			
 
				-('peekViewTitleLabel.foreground'); // Color of the peek view title.
			
 
				-('peekViewTitleDescription.foreground'); // Color of the peek view title info.
			
 
				-('peekView.border'); // Color of the peek view borders and arrow.
			
 
				-('peekViewResult.background'); // Background color of the peek view result list.
			
 
				-('peekViewResult.lineForeground'); // Foreground color for line nodes in the peek view result list.
			
 
				-('peekViewResult.fileForeground'); // Foreground color for file nodes in the peek view result list.
			
 
				-('peekViewResult.selectionBackground'); // Background color of the selected entry in the peek view result list.
			
 
				-('peekViewResult.selectionForeground'); // Foreground color of the selected entry in the peek view result list.
			
 
				-('peekViewEditor.background'); // Background color of the peek view editor.
			
 
				-('peekViewEditorGutter.background'); // Background color of the gutter in the peek view editor.
			
 
				-('peekViewResult.matchHighlightBackground'); // Match highlight color in the peek view result list.
			
 
				-('peekViewEditor.matchHighlightBackground'); // Match highlight color in the peek view editor.
			
 
				-
			
 
				-/*
			
 
				-var colors = require('vs/platform/registry/common/platform').Registry.data.get('base.contributions.colors').colorSchema.properties
			
 
				-Object.keys(colors).forEach(function(key) {
			
 
				-    var val = colors[key];
			
 
				-    console.log( '//' + val.description + '\n' + key);
			
 
				-})
			
 
				-*/
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/customizing-the-appearence-scrollbars.html
+++ b/test/manual/playground.generated/customizing-the-appearence-scrollbars.html
@@ -1,86 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-/* Make horizontal scrollbar, decorations overview ruler and vertical scrollbar arrows opaque */
			
 
				-.monaco-editor .monaco-scrollable-element .scrollbar.horizontal,
			
 
				-.monaco-editor .decorationsOverviewRuler,
			
 
				-.monaco-editor .monaco-scrollable-element .scrollbar.vertical .arrow-background {
			
 
				-	background: rgba(230, 230, 230, 255);
			
 
				-}
			
 
				-/* Make vertical scrollbar transparent to allow decorations overview ruler to be visible */
			
 
				-.monaco-editor .monaco-scrollable-element .scrollbar.vertical {
			
 
				-	background: rgba(0, 0, 0, 0);
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Remember to check out the CSS too!
			
 
				-var htmlCode =
			
 
				-	'<html><!--long linelong linelong linelong linelong linelong linelong linelong linelong linelong line-->\n<head>\n	<!-- HTML comment -->\n	<style type="text/css">\n		/* CSS comment */\n	</style>\n	<script type="javascript">\n		// JavaScript comment\n	</' +
			
 
				-	'script>\n</head>\n<body></body>\n</html>';
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: htmlCode,
			
 
				-	language: 'text/html',
			
 
				-	theme: 'vs',
			
 
				-	scrollbar: {
			
 
				-		// Subtle shadows to the left & top. Defaults to true.
			
 
				-		useShadows: false,
			
 
				-
			
 
				-		// Render vertical arrows. Defaults to false.
			
 
				-		verticalHasArrows: true,
			
 
				-		// Render horizontal arrows. Defaults to false.
			
 
				-		horizontalHasArrows: true,
			
 
				-
			
 
				-		// Render vertical scrollbar.
			
 
				-		// Accepted values: 'auto', 'visible', 'hidden'.
			
 
				-		// Defaults to 'auto'
			
 
				-		vertical: 'visible',
			
 
				-		// Render horizontal scrollbar.
			
 
				-		// Accepted values: 'auto', 'visible', 'hidden'.
			
 
				-		// Defaults to 'auto'
			
 
				-		horizontal: 'visible',
			
 
				-
			
 
				-		verticalScrollbarSize: 17,
			
 
				-		horizontalScrollbarSize: 17,
			
 
				-		arrowSize: 30
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/customizing-the-appearence-tokens-and-colors.html
+++ b/test/manual/playground.generated/customizing-the-appearence-tokens-and-colors.html
@@ -1,77 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Theme matching (i.e. applying a style to a token) happens in JavaScript.
			
 
				-// We must therefore register the theme rules in JavaScript.
			
 
				-
			
 
				-// A custom theme must name its base theme (i.e. 'vs', 'vs-dark' or 'hc-black')
			
 
				-// It can then choose to inherit the rules from the base theme or not
			
 
				-// A rule token matching is prefix based: e.g.
			
 
				-//  - string will match a token with type: string, string.double.js or string.html
			
 
				-//  - string.double will match a token with type string.double but will not match string or string.html
			
 
				-
			
 
				-// !!! Tokens can be inspected using F1 > Developer: Inspect Tokens !!!
			
 
				-
			
 
				-monaco.editor.defineTheme('myCustomTheme', {
			
 
				-	base: 'vs', // can also be vs-dark or hc-black
			
 
				-	inherit: true, // can also be false to completely replace the builtin rules
			
 
				-	rules: [
			
 
				-		{ token: 'comment', foreground: 'ffa500', fontStyle: 'italic underline' },
			
 
				-		{ token: 'comment.js', foreground: '008800', fontStyle: 'bold' },
			
 
				-		{ token: 'comment.css', foreground: '0000ff' } // will inherit fontStyle from `comment` above
			
 
				-	]
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: getCode(),
			
 
				-	language: 'text/html',
			
 
				-	theme: 'myCustomTheme'
			
 
				-});
			
 
				-
			
 
				-function getCode() {
			
 
				-	return (
			
 
				-		'<html><!-- // !!! Tokens can be inspected using F1 > Developer: Inspect Tokens !!! -->\n<head>\n	<!-- HTML comment -->\n	<style type="text/css">\n		/* CSS comment */\n	</style>\n	<script type="javascript">\n		// JavaScript comment\n	</' +
			
 
				-		'script>\n</head>\n<body></body>\n</html>'
			
 
				-	);
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-codelens-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-codelens-provider-example.html
@@ -1,83 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: '{\n\t"dependencies": {\n\t\t\n\t}\n}\n',
			
 
				-	language: 'json'
			
 
				-});
			
 
				-
			
 
				-var commandId = editor.addCommand(
			
 
				-	0,
			
 
				-	function () {
			
 
				-		// services available in `ctx`
			
 
				-		alert('my command is executing!');
			
 
				-	},
			
 
				-	''
			
 
				-);
			
 
				-
			
 
				-monaco.languages.registerCodeLensProvider('json', {
			
 
				-	provideCodeLenses: function (model, token) {
			
 
				-		return {
			
 
				-			lenses: [
			
 
				-				{
			
 
				-					range: {
			
 
				-						startLineNumber: 1,
			
 
				-						startColumn: 1,
			
 
				-						endLineNumber: 2,
			
 
				-						endColumn: 1
			
 
				-					},
			
 
				-					id: 'First Line',
			
 
				-					command: {
			
 
				-						id: commandId,
			
 
				-						title: 'First Line'
			
 
				-					}
			
 
				-				}
			
 
				-			],
			
 
				-			dispose: () => {}
			
 
				-		};
			
 
				-	},
			
 
				-	resolveCodeLens: function (model, codeLens, token) {
			
 
				-		return codeLens;
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-color-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-color-provider-example.html
@@ -1,106 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-monaco.languages.register({
			
 
				-	id: 'colorLanguage'
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: 'red\nblue\ngreen',
			
 
				-	language: 'colorLanguage',
			
 
				-	colorDecorators: true
			
 
				-});
			
 
				-
			
 
				-monaco.languages.registerColorProvider('colorLanguage', {
			
 
				-	provideColorPresentations: (model, colorInfo) => {
			
 
				-		var color = colorInfo.color;
			
 
				-		var red256 = Math.round(color.red * 255);
			
 
				-		var green256 = Math.round(color.green * 255);
			
 
				-		var blue256 = Math.round(color.blue * 255);
			
 
				-		var label;
			
 
				-		if (color.alpha === 1) {
			
 
				-			label = 'rgb(' + red256 + ', ' + green256 + ', ' + blue256 + ')';
			
 
				-		} else {
			
 
				-			label = 'rgba(' + red256 + ', ' + green256 + ', ' + blue256 + ', ' + color.alpha + ')';
			
 
				-		}
			
 
				-
			
 
				-		return [
			
 
				-			{
			
 
				-				label: label
			
 
				-			}
			
 
				-		];
			
 
				-	},
			
 
				-
			
 
				-	provideDocumentColors: () => {
			
 
				-		return [
			
 
				-			{
			
 
				-				color: { red: 1, blue: 0, green: 0, alpha: 1 },
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 0,
			
 
				-					endLineNumber: 1,
			
 
				-					endColumn: 0
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				color: { red: 0, blue: 1, green: 0, alpha: 1 },
			
 
				-				range: {
			
 
				-					startLineNumber: 2,
			
 
				-					startColumn: 0,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 0
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				color: { red: 0, blue: 0, green: 1, alpha: 1 },
			
 
				-				range: {
			
 
				-					startLineNumber: 3,
			
 
				-					startColumn: 0,
			
 
				-					endLineNumber: 3,
			
 
				-					endColumn: 0
			
 
				-				}
			
 
				-			}
			
 
				-		];
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-completion-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-completion-provider-example.html
@@ -1,112 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-function createDependencyProposals(range) {
			
 
				-	// returning a static list of proposals, not even looking at the prefix (filtering is done by the Monaco editor),
			
 
				-	// here you could do a server side lookup
			
 
				-	return [
			
 
				-		{
			
 
				-			label: '"lodash"',
			
 
				-			kind: monaco.languages.CompletionItemKind.Function,
			
 
				-			documentation: 'The Lodash library exported as Node.js modules.',
			
 
				-			insertText: '"lodash": "*"',
			
 
				-			range: range
			
 
				-		},
			
 
				-		{
			
 
				-			label: '"express"',
			
 
				-			kind: monaco.languages.CompletionItemKind.Function,
			
 
				-			documentation: 'Fast, unopinionated, minimalist web framework',
			
 
				-			insertText: '"express": "*"',
			
 
				-			range: range
			
 
				-		},
			
 
				-		{
			
 
				-			label: '"mkdirp"',
			
 
				-			kind: monaco.languages.CompletionItemKind.Function,
			
 
				-			documentation: 'Recursively mkdir, like <code>mkdir -p</code>',
			
 
				-			insertText: '"mkdirp": "*"',
			
 
				-			range: range
			
 
				-		},
			
 
				-		{
			
 
				-			label: '"my-third-party-library"',
			
 
				-			kind: monaco.languages.CompletionItemKind.Function,
			
 
				-			documentation: 'Describe your library here',
			
 
				-			insertText: '"${1:my-third-party-library}": "${2:1.2.3}"',
			
 
				-			insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
			
 
				-			range: range
			
 
				-		}
			
 
				-	];
			
 
				-}
			
 
				-
			
 
				-monaco.languages.registerCompletionItemProvider('json', {
			
 
				-	provideCompletionItems: function (model, position) {
			
 
				-		// find out if we are completing a property in the 'dependencies' object.
			
 
				-		var textUntilPosition = model.getValueInRange({
			
 
				-			startLineNumber: 1,
			
 
				-			startColumn: 1,
			
 
				-			endLineNumber: position.lineNumber,
			
 
				-			endColumn: position.column
			
 
				-		});
			
 
				-		var match = textUntilPosition.match(
			
 
				-			/"dependencies"\s*:\s*\{\s*("[^"]*"\s*:\s*"[^"]*"\s*,\s*)*([^"]*)?$/
			
 
				-		);
			
 
				-		if (!match) {
			
 
				-			return { suggestions: [] };
			
 
				-		}
			
 
				-		var word = model.getWordUntilPosition(position);
			
 
				-		var range = {
			
 
				-			startLineNumber: position.lineNumber,
			
 
				-			endLineNumber: position.lineNumber,
			
 
				-			startColumn: word.startColumn,
			
 
				-			endColumn: word.endColumn
			
 
				-		};
			
 
				-		return {
			
 
				-			suggestions: createDependencyProposals(range)
			
 
				-		};
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: '{\n\t"dependencies": {\n\t\t\n\t}\n}\n',
			
 
				-	language: 'json'
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-configure-javascript-defaults.html
+++ b/test/manual/playground.generated/extending-language-services-configure-javascript-defaults.html
@@ -1,90 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Add additional d.ts files to the JavaScript language service and change.
			
 
				-// Also change the default compilation options.
			
 
				-// The sample below shows how a class Facts is declared and introduced
			
 
				-// to the system and how the compiler is told to use ES6 (target=2).
			
 
				-
			
 
				-// validation settings
			
 
				-monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
			
 
				-	noSemanticValidation: true,
			
 
				-	noSyntaxValidation: false
			
 
				-});
			
 
				-
			
 
				-// compiler options
			
 
				-monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
			
 
				-	target: monaco.languages.typescript.ScriptTarget.ES6,
			
 
				-	allowNonTsExtensions: true
			
 
				-});
			
 
				-
			
 
				-// extra libraries
			
 
				-var libSource = [
			
 
				-	'declare class Facts {',
			
 
				-	'    /**',
			
 
				-	'     * Returns the next fact',
			
 
				-	'     */',
			
 
				-	'    static next():string',
			
 
				-	'}'
			
 
				-].join('\n');
			
 
				-var libUri = 'ts:filename/facts.d.ts';
			
 
				-monaco.languages.typescript.javascriptDefaults.addExtraLib(libSource, libUri);
			
 
				-// When resolving definitions and references, the editor will try to use created models.
			
 
				-// Creating a model for the library allows "peek definition/references" commands to work with the library.
			
 
				-monaco.editor.createModel(libSource, 'typescript', monaco.Uri.parse(libUri));
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'',
			
 
				-	'class Chuck {',
			
 
				-	'    greet() {',
			
 
				-	'        return Facts.next();',
			
 
				-	'    }',
			
 
				-	'}'
			
 
				-].join('\n');
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-configure-json-defaults.html
+++ b/test/manual/playground.generated/extending-language-services-configure-json-defaults.html
@@ -1,86 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Configures two JSON schemas, with references.
			
 
				-
			
 
				-var jsonCode = ['{', '    "p1": "v3",', '    "p2": false', '}'].join('\n');
			
 
				-var modelUri = monaco.Uri.parse('a://b/foo.json'); // a made up unique URI for our model
			
 
				-var model = monaco.editor.createModel(jsonCode, 'json', modelUri);
			
 
				-
			
 
				-// configure the JSON language support with schemas and schema associations
			
 
				-monaco.languages.json.jsonDefaults.setDiagnosticsOptions({
			
 
				-	validate: true,
			
 
				-	schemas: [
			
 
				-		{
			
 
				-			uri: 'http://myserver/foo-schema.json', // id of the first schema
			
 
				-			fileMatch: [modelUri.toString()], // associate with our model
			
 
				-			schema: {
			
 
				-				type: 'object',
			
 
				-				properties: {
			
 
				-					p1: {
			
 
				-						enum: ['v1', 'v2']
			
 
				-					},
			
 
				-					p2: {
			
 
				-						$ref: 'http://myserver/bar-schema.json' // reference the second schema
			
 
				-					}
			
 
				-				}
			
 
				-			}
			
 
				-		},
			
 
				-		{
			
 
				-			uri: 'http://myserver/bar-schema.json', // id of the second schema
			
 
				-			schema: {
			
 
				-				type: 'object',
			
 
				-				properties: {
			
 
				-					q1: {
			
 
				-						enum: ['x1', 'x2']
			
 
				-					}
			
 
				-				}
			
 
				-			}
			
 
				-		}
			
 
				-	]
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	model: model
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-custom-languages.html
+++ b/test/manual/playground.generated/extending-language-services-custom-languages.html
@@ -1,158 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-// Register a new language
			
 
				-monaco.languages.register({ id: 'mySpecialLanguage' });
			
 
				-
			
 
				-// Register a tokens provider for the language
			
 
				-monaco.languages.setMonarchTokensProvider('mySpecialLanguage', {
			
 
				-	tokenizer: {
			
 
				-		root: [
			
 
				-			[/\[error.*/, 'custom-error'],
			
 
				-			[/\[notice.*/, 'custom-notice'],
			
 
				-			[/\[info.*/, 'custom-info'],
			
 
				-			[/\[[a-zA-Z 0-9:]+\]/, 'custom-date']
			
 
				-		]
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-// Define a new theme that contains only rules that match this language
			
 
				-monaco.editor.defineTheme('myCoolTheme', {
			
 
				-	base: 'vs',
			
 
				-	inherit: false,
			
 
				-	rules: [
			
 
				-		{ token: 'custom-info', foreground: '808080' },
			
 
				-		{ token: 'custom-error', foreground: 'ff0000', fontStyle: 'bold' },
			
 
				-		{ token: 'custom-notice', foreground: 'FFA500' },
			
 
				-		{ token: 'custom-date', foreground: '008800' }
			
 
				-	]
			
 
				-});
			
 
				-
			
 
				-// Register a completion item provider for the new language
			
 
				-monaco.languages.registerCompletionItemProvider('mySpecialLanguage', {
			
 
				-	provideCompletionItems: () => {
			
 
				-		var suggestions = [
			
 
				-			{
			
 
				-				label: 'simpleText',
			
 
				-				kind: monaco.languages.CompletionItemKind.Text,
			
 
				-				insertText: 'simpleText'
			
 
				-			},
			
 
				-			{
			
 
				-				label: 'testing',
			
 
				-				kind: monaco.languages.CompletionItemKind.Keyword,
			
 
				-				insertText: 'testing(${1:condition})',
			
 
				-				insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
			
 
				-			},
			
 
				-			{
			
 
				-				label: 'ifelse',
			
 
				-				kind: monaco.languages.CompletionItemKind.Snippet,
			
 
				-				insertText: ['if (${1:condition}) {', '\t$0', '} else {', '\t', '}'].join('\n'),
			
 
				-				insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet,
			
 
				-				documentation: 'If-Else Statement'
			
 
				-			}
			
 
				-		];
			
 
				-		return { suggestions: suggestions };
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	theme: 'myCoolTheme',
			
 
				-	value: getCode(),
			
 
				-	language: 'mySpecialLanguage'
			
 
				-});
			
 
				-
			
 
				-function getCode() {
			
 
				-	return [
			
 
				-		'[Sun Mar 7 16:02:00 2004] [notice] Apache/1.3.29 (Unix) configured -- resuming normal operations',
			
 
				-		'[Sun Mar 7 16:02:00 2004] [info] Server built: Feb 27 2004 13:56:37',
			
 
				-		'[Sun Mar 7 16:02:00 2004] [notice] Accept mutex: sysvsem (Default: sysvsem)',
			
 
				-		'[Sun Mar 7 16:05:49 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 16:45:56 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 17:13:50 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 17:21:44 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 17:23:53 2004] statistics: Use of uninitialized value in concatenation (.) or string at /home/httpd/twiki/lib/TWiki.pm line 528.',
			
 
				-		"[Sun Mar 7 17:23:53 2004] statistics: Can't create file /home/httpd/twiki/data/Main/WebStatistics.txt - Permission denied",
			
 
				-		'[Sun Mar 7 17:27:37 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 17:31:39 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 17:58:00 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:00:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:10:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:19:01 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:42:29 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:52:30 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 18:58:52 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 19:03:58 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 19:08:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:04:35 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:11:33 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:12:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:25:31 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:44:48 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 20:58:27 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 21:16:17 2004] [error] [client xx.xx.xx.xx] File does not exist: /home/httpd/twiki/view/Main/WebHome',
			
 
				-		'[Sun Mar 7 21:20:14 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 21:31:12 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 21:39:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Sun Mar 7 21:44:10 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 01:35:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 01:47:06 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 01:59:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 02:12:24 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 02:54:54 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 03:46:27 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 03:48:18 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 03:52:17 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 03:55:09 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 04:22:55 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 04:24:47 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 04:40:32 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 04:55:40 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 04:59:13 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 05:22:57 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 05:24:29 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'[Mon Mar 8 05:31:47 2004] [info] [client xx.xx.xx.xx] (104)Connection reset by peer: client stopped connection before send body completed',
			
 
				-		'<11>httpd[31628]: [error] [client xx.xx.xx.xx] File does not exist: /usr/local/installed/apache/htdocs/squirrelmail/_vti_inf.html in 29-Mar 15:18:20.50 from xx.xx.xx.xx',
			
 
				-		'<11>httpd[25859]: [error] [client xx.xx.xx.xx] File does not exist: /usr/local/installed/apache/htdocs/squirrelmail/_vti_bin/shtml.exe/_vti_rpc in 29-Mar 15:18:20.54 from xx.xx.xx.xx'
			
 
				-	].join('\n');
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-folding-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-folding-provider-example.html
@@ -1,118 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-monaco.languages.register({
			
 
				-	id: 'foldLanguage'
			
 
				-});
			
 
				-
			
 
				-var value = `1. Hit F1 to bring up the Command Palette
			
 
				-2. Type 'fold'
			
 
				-3. Choose 'Fold All Block Comments' or 'Fold All Regions'
			
 
				-
			
 
				-5. comment1
			
 
				-6. comment1
			
 
				-7. comment1
			
 
				-
			
 
				-9. unfoldable text
			
 
				-10. unfoldable text
			
 
				-11. unfoldable text
			
 
				-
			
 
				-13. comment2
			
 
				-14. comment2
			
 
				-15. comment2
			
 
				-16. comment2
			
 
				-17. comment2
			
 
				-
			
 
				-19. foldable text
			
 
				-20. foldable text
			
 
				-21. foldable text
			
 
				-
			
 
				-23. region1
			
 
				-24. region1
			
 
				-25. region1
			
 
				-
			
 
				-27. region2
			
 
				-28. region2
			
 
				-29. region2`;
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: value,
			
 
				-	language: 'foldLanguage'
			
 
				-});
			
 
				-
			
 
				-monaco.languages.registerFoldingRangeProvider('foldLanguage', {
			
 
				-	provideFoldingRanges: function (model, context, token) {
			
 
				-		return [
			
 
				-			// comment1
			
 
				-			{
			
 
				-				start: 5,
			
 
				-				end: 7,
			
 
				-				kind: monaco.languages.FoldingRangeKind.Comment
			
 
				-			},
			
 
				-			// comment2
			
 
				-			{
			
 
				-				start: 13,
			
 
				-				end: 17,
			
 
				-				kind: monaco.languages.FoldingRangeKind.Comment
			
 
				-			},
			
 
				-			// foldable text
			
 
				-			{
			
 
				-				start: 19,
			
 
				-				end: 21
			
 
				-			},
			
 
				-			// region1
			
 
				-			{
			
 
				-				start: 23,
			
 
				-				end: 25,
			
 
				-				kind: monaco.languages.FoldingRangeKind.Region
			
 
				-			},
			
 
				-			// region2
			
 
				-			{
			
 
				-				start: 27,
			
 
				-				end: 29,
			
 
				-				kind: monaco.languages.FoldingRangeKind.Region
			
 
				-			}
			
 
				-		];
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-hover-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-hover-provider-example.html
@@ -1,101 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-monaco.languages.register({ id: 'mySpecialLanguage' });
			
 
				-
			
 
				-monaco.languages.registerHoverProvider('mySpecialLanguage', {
			
 
				-	provideHover: function (model, position) {
			
 
				-		return xhr('../playground.html').then(function (res) {
			
 
				-			return {
			
 
				-				range: new monaco.Range(
			
 
				-					1,
			
 
				-					1,
			
 
				-					model.getLineCount(),
			
 
				-					model.getLineMaxColumn(model.getLineCount())
			
 
				-				),
			
 
				-				contents: [
			
 
				-					{ value: '**SOURCE**' },
			
 
				-					{ value: '```html\n' + res.responseText.substring(0, 200) + '\n```' }
			
 
				-				]
			
 
				-			};
			
 
				-		});
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: '\n\nHover over this text',
			
 
				-	language: 'mySpecialLanguage'
			
 
				-});
			
 
				-
			
 
				-function xhr(url) {
			
 
				-	var req = null;
			
 
				-	return new Promise(
			
 
				-		function (c, e) {
			
 
				-			req = new XMLHttpRequest();
			
 
				-			req.onreadystatechange = function () {
			
 
				-				if (req._canceled) {
			
 
				-					return;
			
 
				-				}
			
 
				-
			
 
				-				if (req.readyState === 4) {
			
 
				-					if ((req.status >= 200 && req.status < 300) || req.status === 1223) {
			
 
				-						c(req);
			
 
				-					} else {
			
 
				-						e(req);
			
 
				-					}
			
 
				-					req.onreadystatechange = function () {};
			
 
				-				}
			
 
				-			};
			
 
				-
			
 
				-			req.open('GET', url, true);
			
 
				-			req.responseType = '';
			
 
				-
			
 
				-			req.send(null);
			
 
				-		},
			
 
				-		function () {
			
 
				-			req._canceled = true;
			
 
				-			req.abort();
			
 
				-		}
			
 
				-	);
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-semantic-tokens-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-semantic-tokens-provider-example.html
@@ -1,210 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-/** @type {monaco.languages.SemanticTokensLegend} */
			
 
				-const legend = {
			
 
				-	tokenTypes: [
			
 
				-		'comment',
			
 
				-		'string',
			
 
				-		'keyword',
			
 
				-		'number',
			
 
				-		'regexp',
			
 
				-		'operator',
			
 
				-		'namespace',
			
 
				-		'type',
			
 
				-		'struct',
			
 
				-		'class',
			
 
				-		'interface',
			
 
				-		'enum',
			
 
				-		'typeParameter',
			
 
				-		'function',
			
 
				-		'member',
			
 
				-		'macro',
			
 
				-		'variable',
			
 
				-		'parameter',
			
 
				-		'property',
			
 
				-		'label'
			
 
				-	],
			
 
				-	tokenModifiers: [
			
 
				-		'declaration',
			
 
				-		'documentation',
			
 
				-		'readonly',
			
 
				-		'static',
			
 
				-		'abstract',
			
 
				-		'deprecated',
			
 
				-		'modification',
			
 
				-		'async'
			
 
				-	]
			
 
				-};
			
 
				-
			
 
				-/** @type {(type: string)=>number} */
			
 
				-function getType(type) {
			
 
				-	return legend.tokenTypes.indexOf(type);
			
 
				-}
			
 
				-
			
 
				-/** @type {(modifier: string[]|string|null)=>number} */
			
 
				-function getModifier(modifiers) {
			
 
				-	if (typeof modifiers === 'string') {
			
 
				-		modifiers = [modifiers];
			
 
				-	}
			
 
				-	if (Array.isArray(modifiers)) {
			
 
				-		let nModifiers = 0;
			
 
				-		for (let modifier of modifiers) {
			
 
				-			const nModifier = legend.tokenModifiers.indexOf(modifier);
			
 
				-			if (nModifier > -1) {
			
 
				-				nModifiers |= (1 << nModifier) >>> 0;
			
 
				-			}
			
 
				-		}
			
 
				-		return nModifiers;
			
 
				-	} else {
			
 
				-		return 0;
			
 
				-	}
			
 
				-}
			
 
				-
			
 
				-const tokenPattern = new RegExp('([a-zA-Z]+)((?:\\.[a-zA-Z]+)*)', 'g');
			
 
				-
			
 
				-monaco.languages.registerDocumentSemanticTokensProvider('plaintext', {
			
 
				-	getLegend: function () {
			
 
				-		return legend;
			
 
				-	},
			
 
				-	provideDocumentSemanticTokens: function (model, lastResultId, token) {
			
 
				-		const lines = model.getLinesContent();
			
 
				-
			
 
				-		/** @type {number[]} */
			
 
				-		const data = [];
			
 
				-
			
 
				-		let prevLine = 0;
			
 
				-		let prevChar = 0;
			
 
				-
			
 
				-		for (let i = 0; i < lines.length; i++) {
			
 
				-			const line = lines[i];
			
 
				-
			
 
				-			for (let match = null; (match = tokenPattern.exec(line)); ) {
			
 
				-				// translate token and modifiers to number representations
			
 
				-				let type = getType(match[1]);
			
 
				-				if (type === -1) {
			
 
				-					continue;
			
 
				-				}
			
 
				-				let modifier = match[2].length ? getModifier(match[2].split('.').slice(1)) : 0;
			
 
				-
			
 
				-				data.push(
			
 
				-					// translate line to deltaLine
			
 
				-					i - prevLine,
			
 
				-					// for the same line, translate start to deltaStart
			
 
				-					prevLine === i ? match.index - prevChar : match.index,
			
 
				-					match[0].length,
			
 
				-					type,
			
 
				-					modifier
			
 
				-				);
			
 
				-
			
 
				-				prevLine = i;
			
 
				-				prevChar = match.index;
			
 
				-			}
			
 
				-		}
			
 
				-		return {
			
 
				-			data: new Uint32Array(data),
			
 
				-			resultId: null
			
 
				-		};
			
 
				-	},
			
 
				-	releaseDocumentSemanticTokens: function (resultId) {}
			
 
				-});
			
 
				-
			
 
				-// add some missing tokens
			
 
				-monaco.editor.defineTheme('myCustomTheme', {
			
 
				-	base: 'vs',
			
 
				-	inherit: true,
			
 
				-	colors: {},
			
 
				-	rules: [
			
 
				-		{ token: 'comment', foreground: 'aaaaaa', fontStyle: 'italic' },
			
 
				-		{ token: 'keyword', foreground: 'ce63eb' },
			
 
				-		{ token: 'operator', foreground: '000000' },
			
 
				-		{ token: 'namespace', foreground: '66afce' },
			
 
				-
			
 
				-		{ token: 'type', foreground: '1db010' },
			
 
				-		{ token: 'struct', foreground: '0000ff' },
			
 
				-		{ token: 'class', foreground: '0000ff', fontStyle: 'bold' },
			
 
				-		{ token: 'interface', foreground: '007700', fontStyle: 'bold' },
			
 
				-		{ token: 'enum', foreground: '0077ff', fontStyle: 'bold' },
			
 
				-		{ token: 'typeParameter', foreground: '1db010' },
			
 
				-		{ token: 'function', foreground: '94763a' },
			
 
				-
			
 
				-		{ token: 'member', foreground: '94763a' },
			
 
				-		{ token: 'macro', foreground: '615a60' },
			
 
				-		{ token: 'variable', foreground: '3e5bbf' },
			
 
				-		{ token: 'parameter', foreground: '3e5bbf' },
			
 
				-		{ token: 'property', foreground: '3e5bbf' },
			
 
				-		{ token: 'label', foreground: '615a60' },
			
 
				-
			
 
				-		{ token: 'type.static', fontStyle: 'bold' },
			
 
				-		{ token: 'class.static', foreground: 'ff0000', fontStyle: 'bold' }
			
 
				-	]
			
 
				-});
			
 
				-
			
 
				-const editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: [
			
 
				-		'Available token types:',
			
 
				-		'    [comment] [string] [keyword] [number] [regexp] [operator] [namespace]',
			
 
				-		'    [type] [struct] [class] [interface] [enum] [typeParameter] [function]',
			
 
				-		'    [member] [macro] [variable] [parameter] [property] [label]',
			
 
				-		'',
			
 
				-		'Available token modifiers:',
			
 
				-		'    [type.declaration] [type.documentation] [type.member] [type.static]',
			
 
				-		'    [type.abstract] [type.deprecated] [type.modification] [type.async]',
			
 
				-		'',
			
 
				-		'Some examples:',
			
 
				-		'    [class.static.token]     [type.static.abstract]',
			
 
				-		'    [class.static.token]     [type.static]',
			
 
				-		'',
			
 
				-		'    [struct]',
			
 
				-		'',
			
 
				-		'    [function.private]',
			
 
				-		'',
			
 
				-		'An error case:',
			
 
				-		'    [notInLegend]'
			
 
				-	].join('\n'),
			
 
				-	language: 'plaintext',
			
 
				-	theme: 'myCustomTheme',
			
 
				-	// semantic tokens provider is disabled by default
			
 
				-	'semanticHighlighting.enabled': true
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/extending-language-services-symbols-provider-example.html
+++ b/test/manual/playground.generated/extending-language-services-symbols-provider-example.html
@@ -1,524 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-monaco.languages.registerDocumentSymbolProvider('json', {
			
 
				-	provideDocumentSymbols: function (model, token) {
			
 
				-		return [
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'File',
			
 
				-				kind: 0,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Module',
			
 
				-				kind: 1,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Namespace',
			
 
				-				kind: 2,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Package',
			
 
				-				kind: 3,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Class',
			
 
				-				kind: 4,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Method',
			
 
				-				kind: 5,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Property',
			
 
				-				kind: 6,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Field',
			
 
				-				kind: 7,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Constructor',
			
 
				-				kind: 8,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Enum',
			
 
				-				kind: 9,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Interface',
			
 
				-				kind: 10,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Function',
			
 
				-				kind: 11,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Variable',
			
 
				-				kind: 12,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Constant',
			
 
				-				kind: 13,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'String',
			
 
				-				kind: 14,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Number',
			
 
				-				kind: 15,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Boolean',
			
 
				-				kind: 16,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Array',
			
 
				-				kind: 17,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Object',
			
 
				-				kind: 18,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Key',
			
 
				-				kind: 19,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Null',
			
 
				-				kind: 20,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'EnumMember',
			
 
				-				kind: 21,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Struct',
			
 
				-				kind: 22,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Event',
			
 
				-				kind: 23,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'Operator',
			
 
				-				kind: 24,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			},
			
 
				-			{
			
 
				-				range: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				},
			
 
				-				name: 'TypeParameter',
			
 
				-				kind: 25,
			
 
				-				detail: '',
			
 
				-				tags: [],
			
 
				-				selectionRange: {
			
 
				-					startLineNumber: 1,
			
 
				-					startColumn: 1,
			
 
				-					endLineNumber: 2,
			
 
				-					endColumn: 1
			
 
				-				}
			
 
				-			}
			
 
				-		];
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-// press Ctrl+Shift+O to show the symbols in the editor
			
 
				-monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: '{\n\t"dependencies": {\n\t\t\n\t}\n}\n',
			
 
				-	language: 'json'
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/index.html
+++ b/test/manual/playground.generated/index.html
@@ -1,42 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-</head>
			
 
				-<body>
			
 
				-<a class="loading-opts" href="index.html">[&lt;&lt; BACK]</a><br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`<br/><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-editor-hello-world.html">Creating the editor &gt; Hello world!</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-editor-editor-basic-options.html">Creating the editor &gt; Editor basic options</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-editor-hard-wrapping.html">Creating the editor &gt; Hard wrapping</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-editor-syntax-highlighting-for-html-elements.html">Creating the editor &gt; Syntax highlighting for HTML elements</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-adding-a-command-to-an-editor-instance.html">Interacting with the editor &gt; Adding a command to an editor instance</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-adding-an-action-to-an-editor-instance.html">Interacting with the editor &gt; Adding an action to an editor instance</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-revealing-a-position.html">Interacting with the editor &gt; Revealing a position</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-rendering-glyphs-in-the-margin.html">Interacting with the editor &gt; Rendering glyphs in the margin</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-line-and-inline-decorations.html">Interacting with the editor &gt; Line and Inline decorations</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-customizing-the-line-numbers.html">Interacting with the editor &gt; Customizing the line numbers</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-listening-to-mouse-events.html">Interacting with the editor &gt; Listening to mouse events</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/interacting-with-the-editor-listening-to-key-events.html">Interacting with the editor &gt; Listening to key events</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/customizing-the-appearence-exposed-colors.html">Customizing the appearence &gt; Exposed colors</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/customizing-the-appearence-scrollbars.html">Customizing the appearence &gt; Scrollbars</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/customizing-the-appearence-tokens-and-colors.html">Customizing the appearence &gt; Tokens and colors</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-diffeditor-hello-diff-world.html">Creating the DiffEditor &gt; Hello diff world!</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-diffeditor-multi-line-example.html">Creating the DiffEditor &gt; Multi-line example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-diffeditor-inline-diff-example.html">Creating the DiffEditor &gt; Inline Diff Example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/creating-the-diffeditor-navigating-a-diff.html">Creating the DiffEditor &gt; Navigating a Diff</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-custom-languages.html">Extending Language Services &gt; Custom languages</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-completion-provider-example.html">Extending Language Services &gt; Completion provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-codelens-provider-example.html">Extending Language Services &gt; Codelens provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-color-provider-example.html">Extending Language Services &gt; Color provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-symbols-provider-example.html">Extending Language Services &gt; Symbols provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-folding-provider-example.html">Extending Language Services &gt; Folding provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-hover-provider-example.html">Extending Language Services &gt; Hover provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-semantic-tokens-provider-example.html">Extending Language Services &gt; Semantic tokens provider example</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-configure-javascript-defaults.html">Extending Language Services &gt; Configure JavaScript defaults</a><br/>
			
 
				-<a class="loading-opts" href="playground.generated/extending-language-services-configure-json-defaults.html">Extending Language Services &gt; Configure JSON defaults</a>
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-adding-a-command-to-an-editor-instance.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-adding-a-command-to-an-editor-instance.html
@@ -1,80 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};'
			
 
				-].join('\n');
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-var myCondition1 = editor.createContextKey(/*key name*/ 'myCondition1', /*default value*/ false);
			
 
				-var myCondition2 = editor.createContextKey(/*key name*/ 'myCondition2', /*default value*/ false);
			
 
				-
			
 
				-editor.addCommand(
			
 
				-	monaco.KeyCode.Tab,
			
 
				-	function () {
			
 
				-		// services available in `ctx`
			
 
				-		alert('my command is executing!');
			
 
				-	},
			
 
				-	'myCondition1 && myCondition2'
			
 
				-);
			
 
				-
			
 
				-myCondition1.set(true);
			
 
				-
			
 
				-setTimeout(function () {
			
 
				-	alert('now enabling also myCondition2, try pressing Tab!');
			
 
				-	myCondition2.set(true);
			
 
				-	// you can use myCondition2.reset() to go back to the default
			
 
				-}, 2000);
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-adding-an-action-to-an-editor-instance.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-adding-an-action-to-an-editor-instance.html
@@ -1,96 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: [
			
 
				-		'',
			
 
				-		'class Example {',
			
 
				-		'\tprivate m:number;',
			
 
				-		'',
			
 
				-		'\tpublic met(): string {',
			
 
				-		'\t\treturn "Hello world!";',
			
 
				-		'\t}',
			
 
				-		'}'
			
 
				-	].join('\n'),
			
 
				-	language: 'typescript'
			
 
				-});
			
 
				-
			
 
				-// Explanation:
			
 
				-// Press F1 => the action will appear and run if it is enabled
			
 
				-// Press Ctrl-F10 => the action will run if it is enabled
			
 
				-// Press Chord Ctrl-K, Ctrl-M => the action will run if it is enabled
			
 
				-
			
 
				-editor.addAction({
			
 
				-	// An unique identifier of the contributed action.
			
 
				-	id: 'my-unique-id',
			
 
				-
			
 
				-	// A label of the action that will be presented to the user.
			
 
				-	label: 'My Label!!!',
			
 
				-
			
 
				-	// An optional array of keybindings for the action.
			
 
				-	keybindings: [
			
 
				-		monaco.KeyMod.CtrlCmd | monaco.KeyCode.F10,
			
 
				-		// chord
			
 
				-		monaco.KeyMod.chord(
			
 
				-			monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyK,
			
 
				-			monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyM
			
 
				-		)
			
 
				-	],
			
 
				-
			
 
				-	// A precondition for this action.
			
 
				-	precondition: null,
			
 
				-
			
 
				-	// A rule to evaluate on top of the precondition in order to dispatch the keybindings.
			
 
				-	keybindingContext: null,
			
 
				-
			
 
				-	contextMenuGroupId: 'navigation',
			
 
				-
			
 
				-	contextMenuOrder: 1.5,
			
 
				-
			
 
				-	// Method that will be executed when the action is triggered.
			
 
				-	// @param editor The editor instance is passed in as a convenience
			
 
				-	run: function (ed) {
			
 
				-		alert("i'm running => " + ed.getPosition());
			
 
				-	}
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-customizing-the-line-numbers.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-customizing-the-line-numbers.html
@@ -1,69 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-function lineNumbersFunc(originalLineNumber) {
			
 
				-	var map = ['O', 'I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', 'X'];
			
 
				-	if (originalLineNumber < map.length) {
			
 
				-		return map[originalLineNumber];
			
 
				-	}
			
 
				-	return originalLineNumber;
			
 
				-}
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};'
			
 
				-].join('\n');
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript',
			
 
				-	lineNumbers: lineNumbersFunc
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-line-and-inline-decorations.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-line-and-inline-decorations.html
@@ -1,90 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-.myInlineDecoration {
			
 
				-	color: red !important;
			
 
				-	cursor: pointer;
			
 
				-	text-decoration: underline;
			
 
				-	font-weight: bold;
			
 
				-	font-style: oblique;
			
 
				-}
			
 
				-
			
 
				-.myLineDecoration {
			
 
				-	background: lightblue;
			
 
				-	width: 5px !important;
			
 
				-	margin-left: 3px;
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};'
			
 
				-].join('\n');
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-var decorations = editor.deltaDecorations(
			
 
				-	[],
			
 
				-	[
			
 
				-		{
			
 
				-			range: new monaco.Range(3, 1, 5, 1),
			
 
				-			options: {
			
 
				-				isWholeLine: true,
			
 
				-				linesDecorationsClassName: 'myLineDecoration'
			
 
				-			}
			
 
				-		},
			
 
				-		{
			
 
				-			range: new monaco.Range(7, 1, 7, 24),
			
 
				-			options: { inlineClassName: 'myInlineDecoration' }
			
 
				-		}
			
 
				-	]
			
 
				-);
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-listening-to-key-events.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-listening-to-key-events.html
@@ -1,55 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: "function hello() {\n\talert('Hello world!');\n}",
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-var myBinding = editor.addCommand(monaco.KeyCode.F9, function () {
			
 
				-	alert('F9 pressed!');
			
 
				-});
			
 
				-
			
 
				-// You can't dispose `addCommand`
			
 
				-// If you need to dispose it you might use `addAction` or `registerCommand`
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-listening-to-mouse-events.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-listening-to-mouse-events.html
@@ -1,171 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-.myGlyphMarginClass {
			
 
				-	background: red;
			
 
				-}
			
 
				-.myContentClass {
			
 
				-	background: lightblue;
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="output" style="height: 29%; font-family: 'Courier New', monospace">
			
 
				-	Last 3 events:<br />
			
 
				-</div>
			
 
				-<div style="background: #ccc; height: 1%"></div>
			
 
				-<div id="container" style="height: 70%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};'
			
 
				-].join('\n');
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript',
			
 
				-	glyphMargin: true,
			
 
				-	contextmenu: false
			
 
				-});
			
 
				-
			
 
				-var decorations = editor.deltaDecorations(
			
 
				-	[],
			
 
				-	[
			
 
				-		{
			
 
				-			range: new monaco.Range(3, 1, 3, 1),
			
 
				-			options: {
			
 
				-				isWholeLine: true,
			
 
				-				className: 'myContentClass',
			
 
				-				glyphMarginClassName: 'myGlyphMarginClass'
			
 
				-			}
			
 
				-		}
			
 
				-	]
			
 
				-);
			
 
				-
			
 
				-// Add a zone to make hit testing more interesting
			
 
				-var viewZoneId = null;
			
 
				-editor.changeViewZones(function (changeAccessor) {
			
 
				-	var domNode = document.createElement('div');
			
 
				-	domNode.style.background = 'lightgreen';
			
 
				-	viewZoneId = changeAccessor.addZone({
			
 
				-		afterLineNumber: 3,
			
 
				-		heightInLines: 3,
			
 
				-		domNode: domNode
			
 
				-	});
			
 
				-});
			
 
				-
			
 
				-// Add a content widget (scrolls inline with text)
			
 
				-var contentWidget = {
			
 
				-	domNode: null,
			
 
				-	getId: function () {
			
 
				-		return 'my.content.widget';
			
 
				-	},
			
 
				-	getDomNode: function () {
			
 
				-		if (!this.domNode) {
			
 
				-			this.domNode = document.createElement('div');
			
 
				-			this.domNode.innerHTML = 'My content widget';
			
 
				-			this.domNode.style.background = 'grey';
			
 
				-		}
			
 
				-		return this.domNode;
			
 
				-	},
			
 
				-	getPosition: function () {
			
 
				-		return {
			
 
				-			position: {
			
 
				-				lineNumber: 7,
			
 
				-				column: 8
			
 
				-			},
			
 
				-			preference: [
			
 
				-				monaco.editor.ContentWidgetPositionPreference.ABOVE,
			
 
				-				monaco.editor.ContentWidgetPositionPreference.BELOW
			
 
				-			]
			
 
				-		};
			
 
				-	}
			
 
				-};
			
 
				-editor.addContentWidget(contentWidget);
			
 
				-
			
 
				-// Add an overlay widget
			
 
				-var overlayWidget = {
			
 
				-	domNode: null,
			
 
				-	getId: function () {
			
 
				-		return 'my.overlay.widget';
			
 
				-	},
			
 
				-	getDomNode: function () {
			
 
				-		if (!this.domNode) {
			
 
				-			this.domNode = document.createElement('div');
			
 
				-			this.domNode.innerHTML = 'My overlay widget';
			
 
				-			this.domNode.style.background = 'grey';
			
 
				-			this.domNode.style.right = '30px';
			
 
				-			this.domNode.style.top = '50px';
			
 
				-		}
			
 
				-		return this.domNode;
			
 
				-	},
			
 
				-	getPosition: function () {
			
 
				-		return null;
			
 
				-	}
			
 
				-};
			
 
				-editor.addOverlayWidget(overlayWidget);
			
 
				-
			
 
				-var output = document.getElementById('output');
			
 
				-function showEvent(str) {
			
 
				-	while (output.childNodes.length > 6) {
			
 
				-		output.removeChild(output.firstChild.nextSibling.nextSibling);
			
 
				-	}
			
 
				-	output.appendChild(document.createTextNode(str));
			
 
				-	output.appendChild(document.createElement('br'));
			
 
				-}
			
 
				-
			
 
				-editor.onMouseMove(function (e) {
			
 
				-	showEvent('mousemove - ' + e.target.toString());
			
 
				-});
			
 
				-editor.onMouseDown(function (e) {
			
 
				-	showEvent('mousedown - ' + e.target.toString());
			
 
				-});
			
 
				-editor.onContextMenu(function (e) {
			
 
				-	showEvent('contextmenu - ' + e.target.toString());
			
 
				-});
			
 
				-editor.onMouseLeave(function (e) {
			
 
				-	showEvent('mouseleave');
			
 
				-});
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-rendering-glyphs-in-the-margin.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-rendering-glyphs-in-the-margin.html
@@ -1,83 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-.myGlyphMarginClass {
			
 
				-	background: red;
			
 
				-}
			
 
				-.myContentClass {
			
 
				-	background: lightblue;
			
 
				-}
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var jsCode = [
			
 
				-	'"use strict";',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};'
			
 
				-].join('\n');
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCode,
			
 
				-	language: 'javascript',
			
 
				-	glyphMargin: true
			
 
				-});
			
 
				-
			
 
				-var decorations = editor.deltaDecorations(
			
 
				-	[],
			
 
				-	[
			
 
				-		{
			
 
				-			range: new monaco.Range(3, 1, 3, 1),
			
 
				-			options: {
			
 
				-				isWholeLine: true,
			
 
				-				className: 'myContentClass',
			
 
				-				glyphMarginClassName: 'myGlyphMarginClass'
			
 
				-			}
			
 
				-		}
			
 
				-	]
			
 
				-);
			
 
				-
			
 
				-// You can now use `decorations` to change or remove the decoration
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>
			
--- a/test/manual/playground.generated/interacting-with-the-editor-revealing-a-position.html
+++ b/test/manual/playground.generated/interacting-with-the-editor-revealing-a-position.html
@@ -1,85 +0,0 @@
 
				-<!DOCTYPE html>
			
 
				-<!-- THIS IS A GENERATED FILE VIA `npm run simpleserver` -->
			
 
				-<html>
			
 
				-<head>
			
 
				-	<base href="..">
			
 
				-	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
			
 
				-</head>
			
 
				-<body>
			
 
				-<style>
			
 
				-/*----------------------------------------SAMPLE CSS START*/
			
 
				-
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE CSS END*/
			
 
				-</style>
			
 
				-<a class="loading-opts" href="playground.generated/index.html">[&lt;&lt; BACK]</a> <br/>
			
 
				-THIS IS A GENERATED FILE VIA `npm run simpleserver`
			
 
				-
			
 
				-<div id="bar" style="margin-bottom: 6px;"></div>
			
 
				-
			
 
				-<div style="clear:both"></div>
			
 
				-<div id="outer-container" style="width:800px;height:450px;border: 1px solid grey">
			
 
				-<!-- ----------------------------------------SAMPLE HTML START-->
			
 
				-
			
 
				-<div id="container" style="height: 100%"></div>
			
 
				-
			
 
				-
			
 
				-<!-- ----------------------------------------SAMPLE HTML END-->
			
 
				-</div>
			
 
				-<div style="clear:both"></div>
			
 
				-
			
 
				-<script src="../../metadata.js"></script>
			
 
				-<script src="dev-setup.js"></script>
			
 
				-<script>
			
 
				-loadEditor(function() {
			
 
				-/*----------------------------------------SAMPLE JS START*/
			
 
				-
			
 
				-var jsCodeArr = [
			
 
				-	'// ------------------------------',
			
 
				-	'// ------------------------------',
			
 
				-	'function Person(age) {',
			
 
				-	'	if (age) {',
			
 
				-	'		this.age = age;',
			
 
				-	'	}',
			
 
				-	'}',
			
 
				-	'Person.prototype.getAge = function () {',
			
 
				-	'	return this.age;',
			
 
				-	'};',
			
 
				-	'',
			
 
				-	''
			
 
				-];
			
 
				-
			
 
				-jsCodeArr = jsCodeArr.concat(jsCodeArr.slice(0));
			
 
				-jsCodeArr = jsCodeArr.concat(jsCodeArr.slice(0));
			
 
				-jsCodeArr = jsCodeArr.concat(jsCodeArr.slice(0));
			
 
				-
			
 
				-jsCodeArr[49] +=
			
 
				-	'And this is some long line. And this is some long line. And this is some long line. And this is some long line. And this is some long line. ';
			
 
				-
			
 
				-var editor = monaco.editor.create(document.getElementById('container'), {
			
 
				-	value: jsCodeArr.join('\n'),
			
 
				-	language: 'javascript'
			
 
				-});
			
 
				-
			
 
				-editor.revealPositionInCenter({ lineNumber: 50, column: 120 });
			
 
				-// Also see:
			
 
				-// - editor.revealLine
			
 
				-// - editor.revealLineInCenter
			
 
				-// - editor.revealLineInCenterIfOutsideViewport
			
 
				-// - editor.revealLines
			
 
				-// - editor.revealLinesInCenter
			
 
				-// - editor.revealLinesInCenterIfOutsideViewport
			
 
				-// - editor.revealPosition
			
 
				-// - editor.revealPositionInCenter
			
 
				-// - editor.revealPositionInCenterIfOutsideViewport
			
 
				-// - editor.revealRange
			
 
				-// - editor.revealRangeInCenter
			
 
				-// - editor.revealRangeInCenterIfOutsideViewport
			
 
				-
			
 
				-
			
 
				-/*----------------------------------------SAMPLE JS END*/
			
 
				-});
			
 
				-</script>
			
 
				-</body>
			
 
				-</html>