SystemSh0cker/monaco-editor
1
0
Fork 0
mirror of https://github.com/microsoft/monaco-editor.git synced 2025-12-22 07:00:11 +01:00
Code Issues Projects Releases Packages Activity

run prettier

Browse source
This commit is contained in:
Alex Dima 2021-11-06 00:15:13 +01:00
parent b4178b1190
commit 84bdc31efe
No known key found for this signature in database
GPG key ID: 39563C1504FDD0C9
217 changed files with 22439 additions and 198788 deletions
Download patch file Download diff file Expand all files Collapse all files

23
.prettierignore Normal file
View file

@ -0,0 +1,23 @@
/monaco-css/out/
/monaco-css/release/
/monaco-editor-samples/browser-esm-parcel/.cache/
/monaco-editor-samples/browser-esm-parcel/dist/
/monaco-editor-samples/browser-esm-webpack/dist/*.js
/monaco-editor-samples/browser-esm-webpack-monaco-plugin/dist/*.js
/monaco-editor-samples/browser-esm-webpack-small/dist/*.js
/monaco-editor-samples/browser-esm-webpack-typescript/dist/*.js
/monaco-editor-samples/browser-esm-webpack-typescript-react/dist/*.js
/monaco-editor/test/samples-all.generated.js
/monaco-editor/test/playground.generated/
/monaco-editor/typedoc/theme/
/monaco-editor/typedoc/monaco.d.ts
/monaco-editor/website/lib/
/monaco-html/out/
/monaco-html/release/
/monaco-json/out/
/monaco-json/release/
/monaco-languages/out/
/monaco-languages/release/
/monaco-typescript/out/
/monaco-typescript/release/
/monaco-typescript/src/lib/

0
monaco-css/.prettierrc → .prettierrc
View file

1336
CHANGELOG.md
View file

File diff suppressed because it is too large Load diff

125
CONTRIBUTING.md
View file

@ -6,21 +6,20 @@ This repository contains no source code, it only contains the scripts to package
These packages are described in the root file called `metadata.js` and it is possible to create an editor distribution that contains only certain plugins by editing that file. These packages are described in the root file called `metadata.js` and it is possible to create an editor distribution that contains only certain plugins by editing that file.
| repository | npm module | explanation | | repository | npm module | explanation |
|------------|------------|-------------| | ------------------------------------------------------------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------- |
| [vscode](https://github.com/Microsoft/vscode) | [monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core) | editor core functionality (language agnostic) is shipped out of vscode. | | [vscode](https://github.com/Microsoft/vscode) | [monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core) | editor core functionality (language agnostic) is shipped out of vscode. |
| [monaco-languages](https://github.com/Microsoft/monaco-languages) | [monaco-languages](https://www.npmjs.com/package/monaco-languages) | plugin that adds colorization and basic supports for dozens of languages. | | [monaco-languages](https://github.com/Microsoft/monaco-languages) | [monaco-languages](https://www.npmjs.com/package/monaco-languages) | plugin that adds colorization and basic supports for dozens of languages. |
| [monaco-typescript](https://github.com/Microsoft/monaco-typescript) | [monaco-typescript](https://www.npmjs.com/package/monaco-typescript) | plugin that adds rich language support for JavaScript and TypeScript. | | [monaco-typescript](https://github.com/Microsoft/monaco-typescript) | [monaco-typescript](https://www.npmjs.com/package/monaco-typescript) | plugin that adds rich language support for JavaScript and TypeScript. |
| [monaco-css](https://github.com/Microsoft/monaco-css) | [monaco-css](https://www.npmjs.com/package/monaco-css) | plugin that adds rich language support for CSS, LESS and SCSS. | | [monaco-css](https://github.com/Microsoft/monaco-css) | [monaco-css](https://www.npmjs.com/package/monaco-css) | plugin that adds rich language support for CSS, LESS and SCSS. |
| [monaco-json](https://github.com/Microsoft/monaco-json) | [monaco-json](https://www.npmjs.com/package/monaco-json) | plugin that adds rich language support for JSON. | | [monaco-json](https://github.com/Microsoft/monaco-json) | [monaco-json](https://www.npmjs.com/package/monaco-json) | plugin that adds rich language support for JSON. |
| [monaco-html](https://github.com/Microsoft/monaco-html) | [monaco-html](https://www.npmjs.com/package/monaco-html) | plugin that adds rich language support for HTML. | | [monaco-html](https://github.com/Microsoft/monaco-html) | [monaco-html](https://www.npmjs.com/package/monaco-html) | plugin that adds rich language support for HTML. |
## Running the editor from source ## Running the editor from source
You need to have all the build setup of VS Code to be able to build the Monaco Editor. You need to have all the build setup of VS Code to be able to build the Monaco Editor.
* Install all the [prerequisites](https://github.com/Microsoft/vscode/wiki/How-to-Contribute#prerequisites) - Install all the [prerequisites](https://github.com/Microsoft/vscode/wiki/How-to-Contribute#prerequisites)
### OS X and Linux ### OS X and Linux
@ -50,7 +49,7 @@ You need to have all the build setup of VS Code to be able to build the Monaco E
/src/vscode> yarn run watch /src/vscode> yarn run watch
``` ```
* For the monaco editor test pages: - For the monaco editor test pages:
```bash ```bash
# clone monaco-editor (note the folders must be siblings!) # clone monaco-editor (note the folders must be siblings!)
@ -90,7 +89,7 @@ Open [http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src
> Tip: All folders must be cloned as siblings. > Tip: All folders must be cloned as siblings.
> Tip: When running the test pages, use the control panel in the top right corner to switch between running from source, running from npm or running from the local release: > Tip: When running the test pages, use the control panel in the top right corner to switch between running from source, running from npm or running from the local release:
![image](https://cloud.githubusercontent.com/assets/5047891/19599080/eb0d7622-979e-11e6-96ce-dde98cd95dc1.png) > ![image](https://cloud.githubusercontent.com/assets/5047891/19599080/eb0d7622-979e-11e6-96ce-dde98cd95dc1.png)
## Running the website locally ## Running the website locally
@ -113,72 +112,76 @@ Open [http://localhost:8080/monaco-editor/test/?editor=src&monaco-typescript=src
## Shipping a new monaco-editor npm module ## Shipping a new monaco-editor npm module
#### 0. #### 0.
* make sure you have `https://github.com/microsoft/vscode-loc` checked out next to the `vscode` folder.
- make sure you have `https://github.com/microsoft/vscode-loc` checked out next to the `vscode` folder.
#### 1. Ship a new `monaco-editor-core` npm module #### 1. Ship a new `monaco-editor-core` npm module
* bump version in `/src/vscode/build/monaco/package.json`
* **[important]** push all local changes to the remote to get a good public commit id. - bump version in `/src/vscode/build/monaco/package.json`
* generate npm package `/src/vscode> node_modules/.bin/gulp editor-distro` - **[important]** push all local changes to the remote to get a good public commit id.
* publish npm package `/src/vscode/out-monaco-editor-core> npm publish` - generate npm package `/src/vscode> node_modules/.bin/gulp editor-distro`
- publish npm package `/src/vscode/out-monaco-editor-core> npm publish`
#### 2. Adopt new `monaco-editor-core` in plugins #### 2. Adopt new `monaco-editor-core` in plugins
* if there are breaking API changes that affect the language plugins, adopt the new API in:
* [repo - monaco-typescript](https://github.com/Microsoft/monaco-typescript) - if there are breaking API changes that affect the language plugins, adopt the new API in:
* [repo - monaco-languages](https://github.com/Microsoft/monaco-languages) - [repo - monaco-typescript](https://github.com/Microsoft/monaco-typescript)
* [repo - monaco-css](https://github.com/Microsoft/monaco-css) - [repo - monaco-languages](https://github.com/Microsoft/monaco-languages)
* [repo - monaco-json](https://github.com/Microsoft/monaco-json) - [repo - monaco-css](https://github.com/Microsoft/monaco-css)
* [repo - monaco-html](https://github.com/Microsoft/monaco-html) - [repo - monaco-json](https://github.com/Microsoft/monaco-json)
* publish new versions of those plugins to npm as necessary. - [repo - monaco-html](https://github.com/Microsoft/monaco-html)
- publish new versions of those plugins to npm as necessary.
#### 3. Update package.json #### 3. Update package.json
* edit `/src/monaco-editor/package.json` and update the version (as necessary):
* [npm - monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core) - edit `/src/monaco-editor/package.json` and update the version (as necessary):
* [npm - monaco-typescript](https://www.npmjs.com/package/monaco-typescript) - [npm - monaco-editor-core](https://www.npmjs.com/package/monaco-editor-core)
* [npm - monaco-languages](https://www.npmjs.com/package/monaco-languages) - [npm - monaco-typescript](https://www.npmjs.com/package/monaco-typescript)
* [npm - monaco-css](https://www.npmjs.com/package/monaco-css) - [npm - monaco-languages](https://www.npmjs.com/package/monaco-languages)
* [npm - monaco-json](https://www.npmjs.com/package/monaco-json) - [npm - monaco-css](https://www.npmjs.com/package/monaco-css)
* [npm - monaco-html](https://www.npmjs.com/package/monaco-html) - [npm - monaco-json](https://www.npmjs.com/package/monaco-json)
* **[important]** fetch latest deps by running `/src/monaco-editor> npm install .` - [npm - monaco-html](https://www.npmjs.com/package/monaco-html)
- **[important]** fetch latest deps by running `/src/monaco-editor> npm install .`
#### 4. Generate and try out the local release #### 4. Generate and try out the local release
* `/src/monaco-editor> npm run release` - `/src/monaco-editor> npm run release`
* try as many test pages as you think are relevant. e.g.: - try as many test pages as you think are relevant. e.g.:
* open `http://localhost:8080/monaco-editor/test/?editor=releaseDev` - open `http://localhost:8080/monaco-editor/test/?editor=releaseDev`
* open `http://localhost:8080/monaco-editor/test/?editor=releaseMin` - open `http://localhost:8080/monaco-editor/test/?editor=releaseMin`
* open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseDev` - open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseDev`
* open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseMin` - open `http://localhost:8080/monaco-editor/test/smoketest.html?editor=releaseMin`
#### 5. Update release note. #### 5. Update release note.
* API Change/Breaking Change/New and noteworthy
* Thank you ([use this tool](https://vscode-tools.azurewebsites.net/)) - API Change/Breaking Change/New and noteworthy
- Thank you ([use this tool](https://vscode-tools.azurewebsites.net/))
#### 6. Publish #### 6. Publish
* `/src/monaco-editor> npm version minor` - `/src/monaco-editor> npm version minor`
* `/src/monaco-editor> npm run release` - `/src/monaco-editor> npm run release`
* `/src/monaco-editor/release> npm publish` - `/src/monaco-editor/release> npm publish`
* `/src/monaco-editor> git push --tags` - `/src/monaco-editor> git push --tags`
#### 7. Update Website #### 7. Update Website
* `/src/monaco-editor> npm run website` - `/src/monaco-editor> npm run website`
#### 8. Publish new webpack plugin #### 8. Publish new webpack plugin
* https://github.com/microsoft/monaco-editor-webpack-plugin - https://github.com/microsoft/monaco-editor-webpack-plugin
* update to latest `monaco-editor` - update to latest `monaco-editor`
* `npm install .` - `npm install .`
* `npm run import-editor` - `npm run import-editor`
* if there are no changes generated after the script: - if there are no changes generated after the script:
* update the peer dependency in `package.json` and use the `||` format e.g. `"monaco-editor": "0.27.x || 0.28.x"` - update the peer dependency in `package.json` and use the `||` format e.g. `"monaco-editor": "0.27.x || 0.28.x"`
* update the version matrix in the README.md and add the new editor version to the plugin's current major version - update the version matrix in the README.md and add the new editor version to the plugin's current major version
* use `npm version minor` - use `npm version minor`
* publish using `npm publish` - publish using `npm publish`
* if there are any changes generated after the script: - if there are any changes generated after the script:
* update the peer dependency in `package.json` e.g. `"monaco-editor": "0.29.x"` - update the peer dependency in `package.json` e.g. `"monaco-editor": "0.29.x"`
* update the version matrix in the README.md and add a new row with the new major version - update the version matrix in the README.md and add a new row with the new major version
* use `npm version major` - use `npm version major`
* publish using `npm publish` - publish using `npm publish`
* remember to push tags upstream - remember to push tags upstream

35
README.md
View file

@ -19,25 +19,26 @@ $ npm install monaco-editor
``` ```
You will get: You will get:
* inside `esm`: ESM version of the editor (compatible with e.g. webpack)
* inside `dev`: AMD bundled, not minified - inside `esm`: ESM version of the editor (compatible with e.g. webpack)
* inside `min`: AMD bundled, and minified - inside `dev`: AMD bundled, not minified
* inside `min-maps`: source maps for `min` - inside `min`: AMD bundled, and minified
* `monaco.d.ts`: this specifies the API of the editor (this is what is actually versioned, everything else is considered private and might break with any release). - inside `min-maps`: source maps for `min`
- `monaco.d.ts`: this specifies the API of the editor (this is what is actually versioned, everything else is considered private and might break with any release).
It is recommended to develop against the `dev` version, and in production to use the `min` version. It is recommended to develop against the `dev` version, and in production to use the `min` version.
## Documentation ## Documentation
* Learn how to integrate the editor with these [complete samples](https://github.com/Microsoft/monaco-editor-samples/). - Learn how to integrate the editor with these [complete samples](https://github.com/Microsoft/monaco-editor-samples/).
* [Integrate the AMD version](./monaco-editor/docs/integrate-amd.md). - [Integrate the AMD version](./monaco-editor/docs/integrate-amd.md).
* [Integrate the AMD version cross-domain](./monaco-editor/docs/integrate-amd-cross.md) - [Integrate the AMD version cross-domain](./monaco-editor/docs/integrate-amd-cross.md)
* [Integrate the ESM version](./monaco-editor/docs/integrate-esm.md) - [Integrate the ESM version](./monaco-editor/docs/integrate-esm.md)
* Learn how to use the editor API and try out your own customizations in the [playground](https://microsoft.github.io/monaco-editor/playground.html). - Learn how to use the editor API and try out your own customizations in the [playground](https://microsoft.github.io/monaco-editor/playground.html).
* Explore the [API docs](https://microsoft.github.io/monaco-editor/api/index.html) or read them straight from [`monaco.d.ts`](https://github.com/Microsoft/monaco-editor/blob/master/website/playground/monaco.d.ts.txt). - Explore the [API docs](https://microsoft.github.io/monaco-editor/api/index.html) or read them straight from [`monaco.d.ts`](https://github.com/Microsoft/monaco-editor/blob/master/website/playground/monaco.d.ts.txt).
* Read [this guide](https://github.com/Microsoft/monaco-editor/wiki/Accessibility-Guide-for-Integrators) to ensure the editor is accessible to all your users! - Read [this guide](https://github.com/Microsoft/monaco-editor/wiki/Accessibility-Guide-for-Integrators) to ensure the editor is accessible to all your users!
* Create a Monarch tokenizer for a new programming language [in the Monarch playground](https://microsoft.github.io/monaco-editor/monarch.html). - Create a Monarch tokenizer for a new programming language [in the Monarch playground](https://microsoft.github.io/monaco-editor/monarch.html).
* Ask questions on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor)! Search open and closed issues, there are a lot of tips in there! - Ask questions on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor)! Search open and closed issues, there are a lot of tips in there!
## Issues ## Issues
@ -77,11 +78,11 @@ No.
❓ **Why doesn't the editor support TextMate grammars?** ❓ **Why doesn't the editor support TextMate grammars?**
* Please see https://github.com/bolinfest/monaco-tm which puts together `monaco-editor`, `vscode-oniguruma` and `vscode-textmate` to get TM grammar support in the editor. - Please see https://github.com/bolinfest/monaco-tm which puts together `monaco-editor`, `vscode-oniguruma` and `vscode-textmate` to get TM grammar support in the editor.
❓ **What about IE 11 support?** ❓ **What about IE 11 support?**
* The Monaco Editor no longer supports IE 11. The last version that was tested on IE 11 is `0.18.1`. - The Monaco Editor no longer supports IE 11. The last version that was tested on IE 11 is `0.18.1`.
## Development setup ## Development setup
@ -91,6 +92,6 @@ Please see [CONTRIBUTING](./CONTRIBUTING.md)
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments. This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
## License ## License
Licensed under the [MIT](https://github.com/Microsoft/monaco-editor/blob/master/LICENSE.md) License. Licensed under the [MIT](https://github.com/Microsoft/monaco-editor/blob/master/LICENSE.md) License.

18
SECURITY.md
View file

@ -4,7 +4,7 @@
Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/). Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)), please report it to us as described below. If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](<https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)>), please report it to us as described below.
## Reporting Security Issues ## Reporting Security Issues
@ -12,19 +12,19 @@ If you believe you have found a security vulnerability in any Microsoft-owned re
Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report). Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report).
If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc). If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc).
You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc). You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc).
Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue: Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
* Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.) - Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
* Full paths of source file(s) related to the manifestation of the issue - Full paths of source file(s) related to the manifestation of the issue
* The location of the affected source code (tag/branch/commit or direct URL) - The location of the affected source code (tag/branch/commit or direct URL)
* Any special configuration required to reproduce the issue - Any special configuration required to reproduce the issue
* Step-by-step instructions to reproduce the issue - Step-by-step instructions to reproduce the issue
* Proof-of-concept or exploit code (if possible) - Proof-of-concept or exploit code (if possible)
* Impact of the issue, including how an attacker might exploit the issue - Impact of the issue, including how an attacker might exploit the issue
This information will help us triage your report more quickly. This information will help us triage your report more quickly.

2
monaco-css/.prettierignore
View file

@ -1,2 +0,0 @@
/out/
/release/

2
monaco-css/monaco.d.ts vendored
View file

@ -3,7 +3,7 @@
* Licensed under the MIT License. See License.txt in the project root for license information. * Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/ *--------------------------------------------------------------------------------------------*/
/// <reference path="node_modules/monaco-editor-core/monaco.d.ts" /> /// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />
declare namespace monaco.languages.css { declare namespace monaco.languages.css {
export interface Options { export interface Options {

3
monaco-css/package.json
View file

@ -2,7 +2,6 @@
"scripts": { "scripts": {
"compile": "../node_modules/.bin/mrmdir ./out && ../node_modules/.bin/tsc -p ./src/tsconfig.json && ../node_modules/.bin/tsc -p ./src/tsconfig.esm.json && node ./scripts/dts && ../node_modules/.bin/prettier --write ./monaco.d.ts", "compile": "../node_modules/.bin/mrmdir ./out && ../node_modules/.bin/tsc -p ./src/tsconfig.json && ../node_modules/.bin/tsc -p ./src/tsconfig.esm.json && node ./scripts/dts && ../node_modules/.bin/prettier --write ./monaco.d.ts",
"watch": "../node_modules/.bin/tsc -p ./src --watch", "watch": "../node_modules/.bin/tsc -p ./src --watch",
"prepublishOnly": "../node_modules/.bin/mrmdir ./release && npm run compile && node ./scripts/release.js && node ./scripts/bundle && ../node_modules/.bin/mcopy ./monaco.d.ts ./release/monaco.d.ts && ../node_modules/.bin/mcopy ./out/esm/monaco.contribution.d.ts ./release/esm/monaco.contribution.d.ts && ../node_modules/.bin/mcopy ./out/esm/fillers/monaco-editor-core.d.ts ./release/esm/fillers/monaco-editor-core.d.ts", "prepublishOnly": "../node_modules/.bin/mrmdir ./release && npm run compile && node ./scripts/release.js && node ./scripts/bundle && ../node_modules/.bin/mcopy ./monaco.d.ts ./release/monaco.d.ts && ../node_modules/.bin/mcopy ./out/esm/monaco.contribution.d.ts ./release/esm/monaco.contribution.d.ts && ../node_modules/.bin/mcopy ./out/esm/fillers/monaco-editor-core.d.ts ./release/esm/fillers/monaco-editor-core.d.ts"
"prettier": "../node_modules/.bin/prettier --write ."
} }
} }

2
monaco-css/scripts/dts.js
View file

@ -20,7 +20,7 @@ let result = [
` * Licensed under the MIT License. See License.txt in the project root for license information.`, ` * Licensed under the MIT License. See License.txt in the project root for license information.`,
` *--------------------------------------------------------------------------------------------*/`, ` *--------------------------------------------------------------------------------------------*/`,
``, ``,
`/// <reference path="node_modules/monaco-editor-core/monaco.d.ts" />`, `/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" />`,
``, ``,
`declare namespace monaco.languages.css {` `declare namespace monaco.languages.css {`
]; ];

7
monaco-css/src/cssWorker.ts
View file

@ -29,7 +29,10 @@ export class CSSWorker {
customDataProviders.push(cssService.newCSSDataProvider(data.dataProviders[id])); customDataProviders.push(cssService.newCSSDataProvider(data.dataProviders[id]));
} }
} }
const lsOptions: cssService.LanguageServiceOptions = { customDataProviders, useDefaultDataProvider }; const lsOptions: cssService.LanguageServiceOptions = {
customDataProviders,
useDefaultDataProvider
};
switch (this._languageId) { switch (this._languageId) {
case 'css': case 'css':
@ -173,7 +176,7 @@ export class CSSWorker {
export interface ICreateData { export interface ICreateData {
languageId: string; languageId: string;
options: Options options: Options;
} }
export function create(ctx: worker.IWorkerContext, createData: ICreateData): CSSWorker { export function create(ctx: worker.IWorkerContext, createData: ICreateData): CSSWorker {

4
monaco-css/src/languageFeatures.ts
View file

@ -240,7 +240,9 @@ function toTextEdit(textEdit: cssService.TextEdit): editor.ISingleEditOperation
} }
function toCommand(c: cssService.Command | undefined): languages.Command { function toCommand(c: cssService.Command | undefined): languages.Command {
return c && c.command === 'editor.action.triggerSuggest' ? { id: c.command, title: c.title, arguments: c.arguments } : undefined return c && c.command === 'editor.action.triggerSuggest'
? { id: c.command, title: c.title, arguments: c.arguments }
: undefined;
} }
export class CompletionAdapter implements languages.CompletionItemProvider { export class CompletionAdapter implements languages.CompletionItemProvider {

11
monaco-css/src/monaco.contribution.ts
View file

@ -117,11 +117,7 @@ class LanguageServiceDefaultsImpl implements LanguageServiceDefaults {
private _modeConfiguration: ModeConfiguration; private _modeConfiguration: ModeConfiguration;
private _languageId: string; private _languageId: string;
constructor( constructor(languageId: string, options: Options, modeConfiguration: ModeConfiguration) {
languageId: string,
options: Options,
modeConfiguration: ModeConfiguration
) {
this._languageId = languageId; this._languageId = languageId;
this.setOptions(options); this.setOptions(options);
this.setModeConfiguration(modeConfiguration); this.setModeConfiguration(modeConfiguration);
@ -238,7 +234,6 @@ languages.onLanguage('css', () => {
getMode().then((mode) => mode.setupMode(cssDefaults)); getMode().then((mode) => mode.setupMode(cssDefaults));
}); });
// CSS Data // CSS Data
export interface CSSDataConfiguration { export interface CSSDataConfiguration {
@ -312,7 +307,7 @@ export interface IValueData {
references?: IReference[]; references?: IReference[];
} }
export interface MarkupContent { export interface MarkupContent {
kind: MarkupKind; kind: MarkupKind;
value: string; value: string;
} }
export declare type MarkupKind = 'plaintext' | 'markdown'; export declare type MarkupKind = 'plaintext' | 'markdown';

2
monaco-editor-samples/.npmignore
View file

@ -1,2 +0,0 @@
/.gitignore
/.vscode/

7
monaco-editor-samples/.prettierignore
View file

@ -1,7 +0,0 @@
/browser-esm-parcel/.cache/
/browser-esm-parcel/dist/
/browser-esm-webpack/dist/*.js
/browser-esm-webpack-monaco-plugin/dist/*.js
/browser-esm-webpack-small/dist/*.js
/browser-esm-webpack-typescript/dist/*.js
/browser-esm-webpack-typescript-react/dist/*.js

8
monaco-editor-samples/.prettierrc
View file

@ -1,8 +0,0 @@
{
"arrowParens": "always",
"singleQuote": true,
"trailingComma": "none",
"semi": true,
"useTabs": true,
"printWidth": 100
}

21
monaco-editor-samples/LICENSE.md
View file

@ -1,21 +0,0 @@
The MIT License (MIT)
Copyright (c) 2016 Microsoft Corporation
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

41
monaco-editor-samples/SECURITY.md
View file

@ -1,41 +0,0 @@
<!-- BEGIN MICROSOFT SECURITY.MD V0.0.5 BLOCK -->
## Security
Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](<https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)>), please report it to us as described below.
## Reporting Security Issues
**Please do not report security vulnerabilities through public GitHub issues.**
Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report).
If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc).
You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc).
Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
- Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
- Full paths of source file(s) related to the manifestation of the issue
- The location of the affected source code (tag/branch/commit or direct URL)
- Any special configuration required to reproduce the issue
- Step-by-step instructions to reproduce the issue
- Proof-of-concept or exploit code (if possible)
- Impact of the issue, including how an attacker might exploit the issue
This information will help us triage your report more quickly.
If you are reporting for a bug bounty, more complete reports can contribute to a higher bounty award. Please visit our [Microsoft Bug Bounty Program](https://microsoft.com/msrc/bounty) page for more details about our active programs.
## Preferred Languages
We prefer all communications to be in English.
## Policy
Microsoft follows the principle of [Coordinated Vulnerability Disclosure](https://www.microsoft.com/en-us/msrc/cvd).
<!-- END MICROSOFT SECURITY.MD BLOCK -->

119
monaco-editor-webpack-plugin/.github/commands.yml vendored
View file

@ -1,62 +1,63 @@
{ {
perform: true, perform: true,
commands: [ commands:
{ [
type: 'comment', {
name: 'question', type: 'comment',
allowUsers: [], name: 'question',
action: 'updateLabels', allowUsers: [],
addLabel: '*question' action: 'updateLabels',
}, addLabel: '*question'
{ },
type: 'label', {
name: '*question', type: 'label',
allowTriggerByBot: true, name: '*question',
action: 'close', allowTriggerByBot: true,
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'label', {
name: '*out-of-scope', type: 'label',
allowTriggerByBot: true, name: '*out-of-scope',
action: 'close', allowTriggerByBot: true,
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!" action: 'close',
}, comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
{ },
type: 'label', {
name: '*as-designed', type: 'label',
allowTriggerByBot: true, name: '*as-designed',
action: 'close', allowTriggerByBot: true,
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'label', {
name: '*english-please', type: 'label',
allowTriggerByBot: true, name: '*english-please',
action: 'close', allowTriggerByBot: true,
comment: "This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful." action: 'close',
}, comment: 'This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful.'
{ },
type: 'comment', {
name: 'duplicate', type: 'comment',
allowUsers: [], name: 'duplicate',
action: 'updateLabels', allowUsers: [],
addLabel: '*duplicate' action: 'updateLabels',
}, addLabel: '*duplicate'
{ },
type: 'label', {
name: '*duplicate', type: 'label',
allowTriggerByBot: true, name: '*duplicate',
action: 'close', allowTriggerByBot: true,
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'comment', {
name: 'needsMoreInfo', type: 'comment',
allowUsers: [], name: 'needsMoreInfo',
action: 'updateLabels', allowUsers: [],
addLabel: 'needs more info', action: 'updateLabels',
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!" addLabel: 'needs more info',
}, comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
}
] ]
} }

7
monaco-editor-webpack-plugin/.github/locker.yml vendored
View file

@ -1,6 +1 @@
{ { daysAfterClose: 45, daysSinceLastUpdate: 3, ignoredLabels: ['*out-of-scope'], perform: true }
daysAfterClose: 45,
daysSinceLastUpdate: 3,
ignoredLabels: ['*out-of-scope'],
perform: true
}

8
monaco-editor-webpack-plugin/.github/needs_more_info.yml vendored
View file

@ -1,6 +1,6 @@
{ {
daysUntilClose: 7, daysUntilClose: 7,
needsMoreInfoLabel: 'needs more info', needsMoreInfoLabel: 'needs more info',
perform: true, perform: true,
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
} }

31
monaco-editor-webpack-plugin/.vscode/launch.json vendored
View file

@ -1,19 +1,16 @@
{ {
// Use IntelliSense to learn about possible attributes. // Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes. // Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [
{ {
"type": "node", "type": "node",
"request": "launch", "request": "launch",
"cwd": "${workspaceFolder}/test/", "cwd": "${workspaceFolder}/test/",
"name": "Launch Program", "name": "Launch Program",
"program": "${workspaceFolder}/node_modules/.bin/webpack", "program": "${workspaceFolder}/node_modules/.bin/webpack",
"args": [ "args": ["--config", "webpack.config.js"]
"--config", }
"webpack.config.js" ]
],
}
]
} }

8
monaco-editor-webpack-plugin/.vscode/settings.json vendored
View file

@ -1,6 +1,6 @@
{ {
"files.trimTrailingWhitespace": true, "files.trimTrailingWhitespace": true,
"files.insertFinalNewline": true, "files.insertFinalNewline": true,
"editor.tabSize": 2, "editor.tabSize": 2,
"editor.insertSpaces": true "editor.insertSpaces": true
} }

105
monaco-editor-webpack-plugin/README.md
View file

@ -3,46 +3,51 @@
A plugin to simplify loading the [Monaco Editor](https://github.com/Microsoft/monaco-editor) with [webpack](https://webpack.js.org/). A plugin to simplify loading the [Monaco Editor](https://github.com/Microsoft/monaco-editor) with [webpack](https://webpack.js.org/).
## Installing ## Installing
```sh ```sh
npm install monaco-editor-webpack-plugin npm install monaco-editor-webpack-plugin
``` ```
## Using ## Using
* `webpack.config.js`:
- `webpack.config.js`:
```js ```js
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const path = require('path'); const path = require('path');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'app.js' filename: 'app.js'
}, },
module: { module: {
rules: [{ rules: [
test: /\.css$/, {
use: ['style-loader', 'css-loader'] test: /\.css$/,
}, { use: ['style-loader', 'css-loader']
test: /\.ttf$/, },
use: ['file-loader'] {
}] test: /\.ttf$/,
}, use: ['file-loader']
plugins: [ }
new MonacoWebpackPlugin() ]
] },
plugins: [new MonacoWebpackPlugin()]
}; };
``` ```
* `index.js`: - `index.js`:
```js ```js
import * as monaco from 'monaco-editor' import * as monaco from 'monaco-editor';
// or import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'; // or import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
// if shipping only a subset of the features & languages is desired // if shipping only a subset of the features & languages is desired
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: 'console.log("Hello, world")', value: 'console.log("Hello, world")',
language: 'javascript' language: 'javascript'
}); });
``` ```
@ -50,46 +55,46 @@ monaco.editor.create(document.getElementById('container'), {
Options can be passed in to `MonacoWebpackPlugin`. They can be used to generate a smaller editor bundle by selecting only certain languages or only certain editor features: Options can be passed in to `MonacoWebpackPlugin`. They can be used to generate a smaller editor bundle by selecting only certain languages or only certain editor features:
* `filename` (`string`) - custom filename template for worker scripts, respects the same options as [loader-utils' interpolateName](https://github.com/webpack/loader-utils#interpolatename). Useful for adding content-based hashes so that files can be served with long-lived caching headers. - `filename` (`string`) - custom filename template for worker scripts, respects the same options as [loader-utils' interpolateName](https://github.com/webpack/loader-utils#interpolatename). Useful for adding content-based hashes so that files can be served with long-lived caching headers.
* default value: `'[name].worker.js'`. - default value: `'[name].worker.js'`.
* `publicPath` (`string`) - custom public path for worker scripts, overrides the public path from which files generated by this plugin will be served. This wins out over Webpack's dynamic runtime path and can be useful to avoid attempting to load workers cross-origin when using a CDN for other static resources. Use e.g. '/' if you want to load your resources from the current origin.. - `publicPath` (`string`) - custom public path for worker scripts, overrides the public path from which files generated by this plugin will be served. This wins out over Webpack's dynamic runtime path and can be useful to avoid attempting to load workers cross-origin when using a CDN for other static resources. Use e.g. '/' if you want to load your resources from the current origin..
* default value: `''`. - default value: `''`.
* `languages` (`string[]`) - include only a subset of the languages supported. - `languages` (`string[]`) - include only a subset of the languages supported.
* default value: <!-- LANGUAGES_BEGIN -->`['abap', 'apex', 'azcli', 'bat', 'bicep', 'cameligo', 'clojure', 'coffee', 'cpp', 'csharp', 'csp', 'css', 'dart', 'dockerfile', 'ecl', 'elixir', 'flow9', 'fsharp', 'go', 'graphql', 'handlebars', 'hcl', 'html', 'ini', 'java', 'javascript', 'json', 'julia', 'kotlin', 'less', 'lexon', 'liquid', 'lua', 'm3', 'markdown', 'mips', 'msdax', 'mysql', 'objective-c', 'pascal', 'pascaligo', 'perl', 'pgsql', 'php', 'pla', 'postiats', 'powerquery', 'powershell', 'protobuf', 'pug', 'python', 'qsharp', 'r', 'razor', 'redis', 'redshift', 'restructuredtext', 'ruby', 'rust', 'sb', 'scala', 'scheme', 'scss', 'shell', 'solidity', 'sophia', 'sparql', 'sql', 'st', 'swift', 'systemverilog', 'tcl', 'twig', 'typescript', 'vb', 'xml', 'yaml']`<!-- LANGUAGES_END -->.
- default value: <!-- LANGUAGES_BEGIN -->`['abap', 'apex', 'azcli', 'bat', 'bicep', 'cameligo', 'clojure', 'coffee', 'cpp', 'csharp', 'csp', 'css', 'dart', 'dockerfile', 'ecl', 'elixir', 'flow9', 'fsharp', 'go', 'graphql', 'handlebars', 'hcl', 'html', 'ini', 'java', 'javascript', 'json', 'julia', 'kotlin', 'less', 'lexon', 'liquid', 'lua', 'm3', 'markdown', 'mips', 'msdax', 'mysql', 'objective-c', 'pascal', 'pascaligo', 'perl', 'pgsql', 'php', 'pla', 'postiats', 'powerquery', 'powershell', 'protobuf', 'pug', 'python', 'qsharp', 'r', 'razor', 'redis', 'redshift', 'restructuredtext', 'ruby', 'rust', 'sb', 'scala', 'scheme', 'scss', 'shell', 'solidity', 'sophia', 'sparql', 'sql', 'st', 'swift', 'systemverilog', 'tcl', 'twig', 'typescript', 'vb', 'xml', 'yaml']`<!-- LANGUAGES_END -->.
Some languages share the same web worker. If one of the following languages is included, you must also include the language responsible for instantiating their shared worker: Some languages share the same web worker. If one of the following languages is included, you must also include the language responsible for instantiating their shared worker:
| Language | Instantiator | | Language | Instantiator |
| ------------- | ------------- | | ---------- | ------------ |
| javascript | typescript | | javascript | typescript |
| handlebars | html | | handlebars | html |
| scss, less | css | | scss, less | css |
- `features` (`string[]`) - include only a subset of the editor features.
- default value: <!-- FEATURES_BEGIN -->`['accessibilityHelp', 'anchorSelect', 'bracketMatching', 'caretOperations', 'clipboard', 'codeAction', 'codelens', 'colorPicker', 'comment', 'contextmenu', 'coreCommands', 'cursorUndo', 'dnd', 'documentSymbols', 'find', 'folding', 'fontZoom', 'format', 'gotoError', 'gotoLine', 'gotoSymbol', 'hover', 'iPadShowKeyboard', 'inPlaceReplace', 'indentation', 'inlayHints', 'inlineCompletions', 'inspectTokens', 'linesOperations', 'linkedEditing', 'links', 'multicursor', 'parameterHints', 'quickCommand', 'quickHelp', 'quickOutline', 'referenceSearch', 'rename', 'smartSelect', 'snippets', 'suggest', 'toggleHighContrast', 'toggleTabFocusMode', 'transpose', 'unusualLineTerminators', 'viewportSemanticTokens', 'wordHighlighter', 'wordOperations', 'wordPartOperations']`<!-- FEATURES_END -->.
- excluded features: It is also possible to exclude certain default features prefixing them with an exclamation mark '!'.
* `features` (`string[]`) - include only a subset of the editor features. - `globalAPI` (`boolean`) - specify whether the editor API should be exposed through a global `monaco` object or not. This option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM version of the monaco editor does no longer define a global `monaco` object unless `global.MonacoEnvironment = { globalAPI: true }` is set ([change log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)).
* default value: <!-- FEATURES_BEGIN -->`['accessibilityHelp', 'anchorSelect', 'bracketMatching', 'caretOperations', 'clipboard', 'codeAction', 'codelens', 'colorPicker', 'comment', 'contextmenu', 'coreCommands', 'cursorUndo', 'dnd', 'documentSymbols', 'find', 'folding', 'fontZoom', 'format', 'gotoError', 'gotoLine', 'gotoSymbol', 'hover', 'iPadShowKeyboard', 'inPlaceReplace', 'indentation', 'inlayHints', 'inlineCompletions', 'inspectTokens', 'linesOperations', 'linkedEditing', 'links', 'multicursor', 'parameterHints', 'quickCommand', 'quickHelp', 'quickOutline', 'referenceSearch', 'rename', 'smartSelect', 'snippets', 'suggest', 'toggleHighContrast', 'toggleTabFocusMode', 'transpose', 'unusualLineTerminators', 'viewportSemanticTokens', 'wordHighlighter', 'wordOperations', 'wordPartOperations']`<!-- FEATURES_END -->. - default value: `false`.
* excluded features: It is also possible to exclude certain default features prefixing them with an exclamation mark '!'.
* `globalAPI` (`boolean`) - specify whether the editor API should be exposed through a global `monaco` object or not. This option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM version of the monaco editor does no longer define a global `monaco` object unless `global.MonacoEnvironment = { globalAPI: true }` is set ([change log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)).
* default value: `false`.
## Version Matrix ## Version Matrix
| `monaco-editor-webpack-plugin` | `monaco-editor` | | `monaco-editor-webpack-plugin` | `monaco-editor` |
|---|---| | ------------------------------ | -------------------------------------- |
| `6.*.*` | `0.30.*` | | `6.*.*` | `0.30.*` |
| `5.*.*` | `0.29.*` | | `5.*.*` | `0.29.*` |
| `4.*.*` | `0.25.*`, `0.26.*`, `0.27.*`, `0.28.*` | | `4.*.*` | `0.25.*`, `0.26.*`, `0.27.*`, `0.28.*` |
| `3.*.*` | `0.22.*`, `0.23.*`, `0.24.*` | | `3.*.*` | `0.22.*`, `0.23.*`, `0.24.*` |
| `2.*.*` | `0.21.*` | | `2.*.*` | `0.21.*` |
| `1.9.*` | `0.20.*` | | `1.9.*` | `0.20.*` |
| `1.8.*` | `0.19.*` | | `1.8.*` | `0.19.*` |
| `1.7.*` | `0.18.*` | | `1.7.*` | `0.18.*` |
## Contributing ## Contributing
This project welcomes contributions and suggestions. Most contributions require you to agree to a This project welcomes contributions and suggestions. Most contributions require you to agree to a
Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us Contributor License Agreement (CLA) declaring that you have the right to, and actually do, grant us
the rights to use your contribution. For details, visit https://cla.microsoft.com. the rights to use your contribution. For details, visit https://cla.microsoft.com.

18
monaco-editor-webpack-plugin/SECURITY.md
View file

@ -4,7 +4,7 @@
Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/). Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/Microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)), please report it to us as described below. If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](<https://docs.microsoft.com/en-us/previous-versions/tn-archive/cc751383(v=technet.10)>), please report it to us as described below.
## Reporting Security Issues ## Reporting Security Issues
@ -12,19 +12,19 @@ If you believe you have found a security vulnerability in any Microsoft-owned re
Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report). Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://msrc.microsoft.com/create-report).
If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc). If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://www.microsoft.com/en-us/msrc/pgp-key-msrc).
You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc). You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://www.microsoft.com/msrc).
Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue: Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
* Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.) - Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
* Full paths of source file(s) related to the manifestation of the issue - Full paths of source file(s) related to the manifestation of the issue
* The location of the affected source code (tag/branch/commit or direct URL) - The location of the affected source code (tag/branch/commit or direct URL)
* Any special configuration required to reproduce the issue - Any special configuration required to reproduce the issue
* Step-by-step instructions to reproduce the issue - Step-by-step instructions to reproduce the issue
* Proof-of-concept or exploit code (if possible) - Proof-of-concept or exploit code (if possible)
* Impact of the issue, including how an attacker might exploit the issue - Impact of the issue, including how an attacker might exploit the issue
This information will help us triage your report more quickly. This information will help us triage your report more quickly.

2670
monaco-editor-webpack-plugin/package-lock.json generated
View file

File diff suppressed because it is too large Load diff

90
monaco-editor-webpack-plugin/package.json
View file

@ -1,47 +1,47 @@
{ {
"name": "monaco-editor-webpack-plugin", "name": "monaco-editor-webpack-plugin",
"version": "6.0.0", "version": "6.0.0",
"description": "A webpack plugin for the Monaco Editor", "description": "A webpack plugin for the Monaco Editor",
"main": "out/index.js", "main": "out/index.js",
"typings": "./out/index.d.ts", "typings": "./out/index.d.ts",
"scripts": { "scripts": {
"test": "node ./node_modules/webpack/bin/webpack.js --config test/webpack.config.js --progress", "test": "node ./node_modules/webpack/bin/webpack.js --config test/webpack.config.js --progress",
"test-cross-origin": "node ./node_modules/webpack/bin/webpack.js --config test/webpack-cross-origin.config.js --progress", "test-cross-origin": "node ./node_modules/webpack/bin/webpack.js --config test/webpack-cross-origin.config.js --progress",
"watch": "tsc -w -p tsconfig.json", "watch": "tsc -w -p tsconfig.json",
"import-editor": "node ./scripts/import-editor.js", "import-editor": "node ./scripts/import-editor.js",
"prepublishOnly": "tsc -p tsconfig.json" "prepublishOnly": "tsc -p tsconfig.json"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
"url": "git+https://github.com/microsoft/monaco-editor-webpack-plugin.git" "url": "git+https://github.com/microsoft/monaco-editor-webpack-plugin.git"
}, },
"keywords": [ "keywords": [
"webpack", "webpack",
"monaco", "monaco",
"editor", "editor",
"loader" "loader"
], ],
"author": "Microsoft Corporation", "author": "Microsoft Corporation",
"license": "MIT", "license": "MIT",
"bugs": { "bugs": {
"url": "https://github.com/microsoft/monaco-editor-webpack-plugin/issues" "url": "https://github.com/microsoft/monaco-editor-webpack-plugin/issues"
}, },
"homepage": "https://github.com/microsoft/monaco-editor-webpack-plugin#readme", "homepage": "https://github.com/microsoft/monaco-editor-webpack-plugin#readme",
"peerDependencies": { "peerDependencies": {
"webpack": "^4.5.0 || 5.x", "webpack": "^4.5.0 || 5.x",
"monaco-editor": "0.30.x" "monaco-editor": "0.30.x"
}, },
"devDependencies": { "devDependencies": {
"css-loader": "^5.1.1", "css-loader": "^5.1.1",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"glob": "^7.1.6", "glob": "^7.1.6",
"monaco-editor": "^0.30.0", "monaco-editor": "^0.30.0",
"style-loader": "^2.0.0", "style-loader": "^2.0.0",
"typescript": "^4.2.3", "typescript": "^4.2.3",
"webpack": "^5.24.3", "webpack": "^5.24.3",
"webpack-cli": "^4.5.0" "webpack-cli": "^4.5.0"
}, },
"dependencies": { "dependencies": {
"loader-utils": "^2.0.0" "loader-utils": "^2.0.0"
} }
} }

422
monaco-editor-webpack-plugin/scripts/import-editor.js
View file

@ -8,17 +8,17 @@ const path = require('path');
const fs = require('fs'); const fs = require('fs');
const customFeatureLabels = { const customFeatureLabels = {
'vs/editor/browser/controller/coreCommands': 'coreCommands', 'vs/editor/browser/controller/coreCommands': 'coreCommands',
'vs/editor/contrib/caretOperations/caretOperations': 'caretOperations', 'vs/editor/contrib/caretOperations/caretOperations': 'caretOperations',
'vs/editor/contrib/caretOperations/transpose': 'transpose', 'vs/editor/contrib/caretOperations/transpose': 'transpose',
'vs/editor/contrib/colorPicker/colorDetector': 'colorDetector', 'vs/editor/contrib/colorPicker/colorDetector': 'colorDetector',
'vs/editor/contrib/rename/onTypeRename': 'onTypeRename', 'vs/editor/contrib/rename/onTypeRename': 'onTypeRename',
'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition': 'gotoSymbol', 'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition': 'gotoSymbol',
'vs/editor/contrib/snippet/snippetController2': 'snippets', 'vs/editor/contrib/snippet/snippetController2': 'snippets',
'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess': 'gotoLine', 'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess': 'gotoLine',
'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess': 'quickCommand', 'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess': 'quickCommand',
'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess': 'quickOutline', 'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess': 'quickOutline',
'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess': 'quickHelp', 'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess': 'quickHelp'
}; };
generateLanguages(); generateLanguages();
@ -28,244 +28,264 @@ generateFeatures();
* @returns { Promise<{ label: string; entry: string; }[]> } * @returns { Promise<{ label: string; entry: string; }[]> }
*/ */
function getBasicLanguages() { function getBasicLanguages() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
glob('./node_modules/monaco-editor/esm/vs/basic-languages/*/*.contribution.js', { cwd: path.dirname(__dirname) }, (err, files) => { glob(
if (err) { './node_modules/monaco-editor/esm/vs/basic-languages/*/*.contribution.js',
reject(err); { cwd: path.dirname(__dirname) },
return; (err, files) => {
} if (err) {
reject(err);
return;
}
resolve(files.map((file) => { resolve(
const entry = file.substring('./node_modules/monaco-editor/esm/'.length).replace(/\.js$/, ''); files.map((file) => {
const label = path.basename(file).replace(/\.contribution\.js$/, ''); const entry = file
return { .substring('./node_modules/monaco-editor/esm/'.length)
label: label, .replace(/\.js$/, '');
entry: entry const label = path.basename(file).replace(/\.contribution\.js$/, '');
}; return {
})); label: label,
}); entry: entry
}); };
})
);
}
);
});
} }
/** /**
* @returns { Promise<string[]> } * @returns { Promise<string[]> }
*/ */
function readAdvancedLanguages() { function readAdvancedLanguages() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
glob('./node_modules/monaco-editor/esm/vs/language/*/monaco.contribution.js', { cwd: path.dirname(__dirname) }, (err, files) => { glob(
if (err) { './node_modules/monaco-editor/esm/vs/language/*/monaco.contribution.js',
reject(err); { cwd: path.dirname(__dirname) },
return; (err, files) => {
} if (err) {
reject(err);
return;
}
resolve( resolve(
files files
.map(file => file.substring('./node_modules/monaco-editor/esm/vs/language/'.length)) .map((file) => file.substring('./node_modules/monaco-editor/esm/vs/language/'.length))
.map(file => file.substring(0, file.length - '/monaco.contribution.js'.length)) .map((file) => file.substring(0, file.length - '/monaco.contribution.js'.length))
); );
}); }
}); );
});
} }
/** /**
* @returns { Promise<{ label: string; entry: string; worker: { id: string; entry: string; }; }[]> } * @returns { Promise<{ label: string; entry: string; worker: { id: string; entry: string; }; }[]> }
*/ */
function getAdvancedLanguages() { function getAdvancedLanguages() {
return readAdvancedLanguages().then((languages) => { return readAdvancedLanguages().then((languages) => {
let result = []; let result = [];
for (const lang of languages) { for (const lang of languages) {
let shortLang = (lang === 'typescript' ? 'ts' : lang); let shortLang = lang === 'typescript' ? 'ts' : lang;
const entry = `vs/language/${lang}/monaco.contribution`; const entry = `vs/language/${lang}/monaco.contribution`;
checkFileExists(entry); checkFileExists(entry);
const workerId = `vs/language/${lang}/${shortLang}Worker`; const workerId = `vs/language/${lang}/${shortLang}Worker`;
checkFileExists(workerId); checkFileExists(workerId);
const workerEntry = `vs/language/${lang}/${shortLang}.worker`; const workerEntry = `vs/language/${lang}/${shortLang}.worker`;
checkFileExists(workerEntry); checkFileExists(workerEntry);
result.push({ result.push({
label: lang, label: lang,
entry: entry, entry: entry,
worker: { worker: {
id: workerId, id: workerId,
entry: workerEntry entry: workerEntry
} }
}); });
} }
return result; return result;
}); });
function checkFileExists(moduleName) { function checkFileExists(moduleName) {
const filePath = path.join(__dirname, '..', 'node_modules/monaco-editor/esm', `${moduleName}.js`); const filePath = path.join(
if (!fs.existsSync(filePath)) { __dirname,
console.error(`Could not find ${filePath}.`); '..',
process.exit(1); 'node_modules/monaco-editor/esm',
} `${moduleName}.js`
} );
if (!fs.existsSync(filePath)) {
console.error(`Could not find ${filePath}.`);
process.exit(1);
}
}
} }
function generateLanguages() { function generateLanguages() {
return Promise.all([getBasicLanguages(), getAdvancedLanguages()]).then(([basicLanguages, advancedLanguages]) => { return Promise.all([getBasicLanguages(), getAdvancedLanguages()]).then(
basicLanguages.sort(strcmp); ([basicLanguages, advancedLanguages]) => {
advancedLanguages.sort(strcmp); basicLanguages.sort(strcmp);
advancedLanguages.sort(strcmp);
let i = 0, len = basicLanguages.length; let i = 0,
let j = 0, lenJ = advancedLanguages.length; len = basicLanguages.length;
let result = []; let j = 0,
while (i < len || j < lenJ) { lenJ = advancedLanguages.length;
if (i < len && j < lenJ) { let result = [];
if (basicLanguages[i].label === advancedLanguages[j].label) { while (i < len || j < lenJ) {
let entry = []; if (i < len && j < lenJ) {
entry.push(basicLanguages[i].entry); if (basicLanguages[i].label === advancedLanguages[j].label) {
entry.push(advancedLanguages[j].entry); let entry = [];
result.push({ entry.push(basicLanguages[i].entry);
label: basicLanguages[i].label, entry.push(advancedLanguages[j].entry);
entry: entry, result.push({
worker: advancedLanguages[j].worker label: basicLanguages[i].label,
}); entry: entry,
i++; worker: advancedLanguages[j].worker
j++; });
} else if (basicLanguages[i].label < advancedLanguages[j].label) { i++;
result.push(basicLanguages[i]); j++;
i++; } else if (basicLanguages[i].label < advancedLanguages[j].label) {
} else { result.push(basicLanguages[i]);
result.push(advancedLanguages[j]); i++;
j++; } else {
} result.push(advancedLanguages[j]);
} else if (i < len) { j++;
result.push(basicLanguages[i]); }
i++; } else if (i < len) {
} else { result.push(basicLanguages[i]);
result.push(advancedLanguages[j]); i++;
j++; } else {
} result.push(advancedLanguages[j]);
} j++;
}
}
const code = `// const code = `//
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY. // THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
// GENERATED USING node scripts/import-editor.js // GENERATED USING node scripts/import-editor.js
// //
import { IFeatureDefinition } from "./types"; import { IFeatureDefinition } from "./types";
export const languagesArr: IFeatureDefinition[] = ${ export const languagesArr: IFeatureDefinition[] = ${JSON.stringify(result, null, ' ')
JSON.stringify(result, null, ' ') .replace(/"label":/g, 'label:')
.replace(/"label":/g, 'label:') .replace(/"entry":/g, 'entry:')
.replace(/"entry":/g, 'entry:') .replace(/"worker":/g, 'worker:')
.replace(/"worker":/g, 'worker:') .replace(/"id":/g, 'id:')
.replace(/"id":/g, 'id:') .replace(/"/g, "'")};
.replace(/"/g, '\'')
};
export type EditorLanguage = ${ export type EditorLanguage = ${result.map((el) => `'${el.label}'`).join(' | ')};
result.map(el => `'${el.label}'`).join(' | ')
};
` `;
fs.writeFileSync(path.join(__dirname, '../src/languages.ts'), code.replace(/\r\n/g, '\n')); fs.writeFileSync(path.join(__dirname, '../src/languages.ts'), code.replace(/\r\n/g, '\n'));
const readmeLanguages = ( const readmeLanguages = JSON.stringify(result.map((r) => r.label))
JSON.stringify(result.map(r => r.label)) .replace(/"/g, "'")
.replace(/"/g, '\'') .replace(/','/g, "', '");
.replace(/','/g, '\', \'') let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
); readme = readme.replace(
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString(); /<!-- LANGUAGES_BEGIN -->([^<]+)<!-- LANGUAGES_END -->/,
readme = readme.replace(/<!-- LANGUAGES_BEGIN -->([^<]+)<!-- LANGUAGES_END -->/, `<!-- LANGUAGES_BEGIN -->\`${readmeLanguages}\`<!-- LANGUAGES_END -->`); `<!-- LANGUAGES_BEGIN -->\`${readmeLanguages}\`<!-- LANGUAGES_END -->`
fs.writeFileSync(path.join(__dirname, '../README.md'), readme); );
}); fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
}
);
} }
function strcmp(a, b) { function strcmp(a, b) {
if (a < b) { if (a < b) {
return -1; return -1;
} }
if (a > b) { if (a > b) {
return 1; return 1;
} }
return 0; return 0;
} }
/** /**
* @returns { string[] } * @returns { string[] }
*/ */
function generateFeatures() { function generateFeatures() {
const skipImports = [ const skipImports = [
'vs/editor/browser/widget/codeEditorWidget', 'vs/editor/browser/widget/codeEditorWidget',
'vs/editor/browser/widget/diffEditorWidget', 'vs/editor/browser/widget/diffEditorWidget',
'vs/editor/browser/widget/diffNavigator', 'vs/editor/browser/widget/diffNavigator',
'vs/editor/common/standaloneStrings', 'vs/editor/common/standaloneStrings',
'vs/editor/contrib/tokenization/tokenization', 'vs/editor/contrib/tokenization/tokenization',
'vs/editor/editor.all', 'vs/editor/editor.all',
'vs/base/browser/ui/codicons/codiconStyles', 'vs/base/browser/ui/codicons/codiconStyles',
'vs/editor/contrib/gotoSymbol/documentSymbols', 'vs/editor/contrib/gotoSymbol/documentSymbols'
]; ];
let features = []; let features = [];
const files = ( const files =
fs.readFileSync(path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/edcore.main.js')).toString() fs
+ fs.readFileSync(path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/editor.all.js')).toString() .readFileSync(
); path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/edcore.main.js')
files.split(/\r\n|\n/).forEach(line => { )
const m = line.match(/import '([^']+)'/); .toString() +
if (m) { fs
const tmp = path.posix.join('vs/editor', m[1]).replace(/\.js$/, ''); .readFileSync(
if (skipImports.indexOf(tmp) === -1) { path.join(__dirname, '../node_modules/monaco-editor/esm/vs/editor/editor.all.js')
features.push(tmp); )
} .toString();
} files.split(/\r\n|\n/).forEach((line) => {
}); const m = line.match(/import '([^']+)'/);
if (m) {
const tmp = path.posix.join('vs/editor', m[1]).replace(/\.js$/, '');
if (skipImports.indexOf(tmp) === -1) {
features.push(tmp);
}
}
});
let result = features.map((feature) => { let result = features.map((feature) => {
return { return {
label: customFeatureLabels[feature] || path.basename(path.dirname(feature)), label: customFeatureLabels[feature] || path.basename(path.dirname(feature)),
entry: feature entry: feature
}; };
}); });
result.sort((a, b) => { result.sort((a, b) => {
const labelCmp = strcmp(a.label, b.label); const labelCmp = strcmp(a.label, b.label);
if (labelCmp === 0) { if (labelCmp === 0) {
return strcmp(a.entry, b.entry); return strcmp(a.entry, b.entry);
} }
return labelCmp; return labelCmp;
}); });
for (let i = 0; i < result.length; i++) { for (let i = 0; i < result.length; i++) {
if (i + 1 < result.length && result[i].label === result[i + 1].label) { if (i + 1 < result.length && result[i].label === result[i + 1].label) {
if (typeof result[i].entry === 'string') { if (typeof result[i].entry === 'string') {
result[i].entry = [result[i].entry]; result[i].entry = [result[i].entry];
} }
result[i].entry.push(result[i + 1].entry); result[i].entry.push(result[i + 1].entry);
result.splice(i + 1, 1); result.splice(i + 1, 1);
} }
} }
const code = `// const code = `//
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY. // THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
// GENERATED USING node scripts/import-editor.js // GENERATED USING node scripts/import-editor.js
// //
import { IFeatureDefinition } from "./types"; import { IFeatureDefinition } from "./types";
export const featuresArr: IFeatureDefinition[] = ${ export const featuresArr: IFeatureDefinition[] = ${JSON.stringify(result, null, ' ')
JSON.stringify(result, null, ' ') .replace(/"label":/g, 'label:')
.replace(/"label":/g, 'label:') .replace(/"entry":/g, 'entry:')
.replace(/"entry":/g, 'entry:') .replace(/"/g, "'")};
.replace(/"/g, '\'')
};
export type EditorFeature = ${ export type EditorFeature = ${result.map((el) => `'${el.label}'`).join(' | ')};
result.map(el => `'${el.label}'`).join(' | ')
};
export type NegatedEditorFeature = ${ export type NegatedEditorFeature = ${result.map((el) => `'!${el.label}'`).join(' | ')};
result.map(el => `'!${el.label}'`).join(' | ') `;
}; fs.writeFileSync(path.join(__dirname, '../src/features.ts'), code.replace(/\r\n/g, '\n'));
`
fs.writeFileSync(path.join(__dirname, '../src/features.ts'), code.replace(/\r\n/g, '\n'));
const readmeFeatures = ( const readmeFeatures = JSON.stringify(result.map((r) => r.label))
JSON.stringify(result.map(r => r.label)) .replace(/"/g, "'")
.replace(/"/g, '\'') .replace(/','/g, "', '");
.replace(/','/g, '\', \'') let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString();
); readme = readme.replace(
let readme = fs.readFileSync(path.join(__dirname, '../README.md')).toString(); /<!-- FEATURES_BEGIN -->([^<]+)<!-- FEATURES_END -->/,
readme = readme.replace(/<!-- FEATURES_BEGIN -->([^<]+)<!-- FEATURES_END -->/, `<!-- FEATURES_BEGIN -->\`${readmeFeatures}\`<!-- FEATURES_END -->`); `<!-- FEATURES_BEGIN -->\`${readmeFeatures}\`<!-- FEATURES_END -->`
fs.writeFileSync(path.join(__dirname, '../README.md'), readme); );
fs.writeFileSync(path.join(__dirname, '../README.md'), readme);
} }

502
monaco-editor-webpack-plugin/src/features.ts
View file

@ -2,210 +2,308 @@
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY. // THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
// GENERATED USING node scripts/import-editor.js // GENERATED USING node scripts/import-editor.js
// //
import { IFeatureDefinition } from "./types"; import { IFeatureDefinition } from './types';
export const featuresArr: IFeatureDefinition[] = [ export const featuresArr: IFeatureDefinition[] = [
{ {
label: 'accessibilityHelp', label: 'accessibilityHelp',
entry: 'vs/editor/standalone/browser/accessibilityHelp/accessibilityHelp' entry: 'vs/editor/standalone/browser/accessibilityHelp/accessibilityHelp'
}, },
{ {
label: 'anchorSelect', label: 'anchorSelect',
entry: 'vs/editor/contrib/anchorSelect/anchorSelect' entry: 'vs/editor/contrib/anchorSelect/anchorSelect'
}, },
{ {
label: 'bracketMatching', label: 'bracketMatching',
entry: 'vs/editor/contrib/bracketMatching/bracketMatching' entry: 'vs/editor/contrib/bracketMatching/bracketMatching'
}, },
{ {
label: 'caretOperations', label: 'caretOperations',
entry: 'vs/editor/contrib/caretOperations/caretOperations' entry: 'vs/editor/contrib/caretOperations/caretOperations'
}, },
{ {
label: 'clipboard', label: 'clipboard',
entry: 'vs/editor/contrib/clipboard/clipboard' entry: 'vs/editor/contrib/clipboard/clipboard'
}, },
{ {
label: 'codeAction', label: 'codeAction',
entry: 'vs/editor/contrib/codeAction/codeActionContributions' entry: 'vs/editor/contrib/codeAction/codeActionContributions'
}, },
{ {
label: 'codelens', label: 'codelens',
entry: 'vs/editor/contrib/codelens/codelensController' entry: 'vs/editor/contrib/codelens/codelensController'
}, },
{ {
label: 'colorPicker', label: 'colorPicker',
entry: 'vs/editor/contrib/colorPicker/colorContributions' entry: 'vs/editor/contrib/colorPicker/colorContributions'
}, },
{ {
label: 'comment', label: 'comment',
entry: 'vs/editor/contrib/comment/comment' entry: 'vs/editor/contrib/comment/comment'
}, },
{ {
label: 'contextmenu', label: 'contextmenu',
entry: 'vs/editor/contrib/contextmenu/contextmenu' entry: 'vs/editor/contrib/contextmenu/contextmenu'
}, },
{ {
label: 'coreCommands', label: 'coreCommands',
entry: 'vs/editor/browser/controller/coreCommands' entry: 'vs/editor/browser/controller/coreCommands'
}, },
{ {
label: 'cursorUndo', label: 'cursorUndo',
entry: 'vs/editor/contrib/cursorUndo/cursorUndo' entry: 'vs/editor/contrib/cursorUndo/cursorUndo'
}, },
{ {
label: 'dnd', label: 'dnd',
entry: 'vs/editor/contrib/dnd/dnd' entry: 'vs/editor/contrib/dnd/dnd'
}, },
{ {
label: 'documentSymbols', label: 'documentSymbols',
entry: 'vs/editor/contrib/documentSymbols/documentSymbols' entry: 'vs/editor/contrib/documentSymbols/documentSymbols'
}, },
{ {
label: 'find', label: 'find',
entry: 'vs/editor/contrib/find/findController' entry: 'vs/editor/contrib/find/findController'
}, },
{ {
label: 'folding', label: 'folding',
entry: 'vs/editor/contrib/folding/folding' entry: 'vs/editor/contrib/folding/folding'
}, },
{ {
label: 'fontZoom', label: 'fontZoom',
entry: 'vs/editor/contrib/fontZoom/fontZoom' entry: 'vs/editor/contrib/fontZoom/fontZoom'
}, },
{ {
label: 'format', label: 'format',
entry: 'vs/editor/contrib/format/formatActions' entry: 'vs/editor/contrib/format/formatActions'
}, },
{ {
label: 'gotoError', label: 'gotoError',
entry: 'vs/editor/contrib/gotoError/gotoError' entry: 'vs/editor/contrib/gotoError/gotoError'
}, },
{ {
label: 'gotoLine', label: 'gotoLine',
entry: 'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess' entry: 'vs/editor/standalone/browser/quickAccess/standaloneGotoLineQuickAccess'
}, },
{ {
label: 'gotoSymbol', label: 'gotoSymbol',
entry: [ entry: [
'vs/editor/contrib/gotoSymbol/goToCommands', 'vs/editor/contrib/gotoSymbol/goToCommands',
'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition' 'vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition'
] ]
}, },
{ {
label: 'hover', label: 'hover',
entry: 'vs/editor/contrib/hover/hover' entry: 'vs/editor/contrib/hover/hover'
}, },
{ {
label: 'iPadShowKeyboard', label: 'iPadShowKeyboard',
entry: 'vs/editor/standalone/browser/iPadShowKeyboard/iPadShowKeyboard' entry: 'vs/editor/standalone/browser/iPadShowKeyboard/iPadShowKeyboard'
}, },
{ {
label: 'inPlaceReplace', label: 'inPlaceReplace',
entry: 'vs/editor/contrib/inPlaceReplace/inPlaceReplace' entry: 'vs/editor/contrib/inPlaceReplace/inPlaceReplace'
}, },
{ {
label: 'indentation', label: 'indentation',
entry: 'vs/editor/contrib/indentation/indentation' entry: 'vs/editor/contrib/indentation/indentation'
}, },
{ {
label: 'inlayHints', label: 'inlayHints',
entry: 'vs/editor/contrib/inlayHints/inlayHintsController' entry: 'vs/editor/contrib/inlayHints/inlayHintsController'
}, },
{ {
label: 'inlineCompletions', label: 'inlineCompletions',
entry: 'vs/editor/contrib/inlineCompletions/ghostTextController' entry: 'vs/editor/contrib/inlineCompletions/ghostTextController'
}, },
{ {
label: 'inspectTokens', label: 'inspectTokens',
entry: 'vs/editor/standalone/browser/inspectTokens/inspectTokens' entry: 'vs/editor/standalone/browser/inspectTokens/inspectTokens'
}, },
{ {
label: 'linesOperations', label: 'linesOperations',
entry: 'vs/editor/contrib/linesOperations/linesOperations' entry: 'vs/editor/contrib/linesOperations/linesOperations'
}, },
{ {
label: 'linkedEditing', label: 'linkedEditing',
entry: 'vs/editor/contrib/linkedEditing/linkedEditing' entry: 'vs/editor/contrib/linkedEditing/linkedEditing'
}, },
{ {
label: 'links', label: 'links',
entry: 'vs/editor/contrib/links/links' entry: 'vs/editor/contrib/links/links'
}, },
{ {
label: 'multicursor', label: 'multicursor',
entry: 'vs/editor/contrib/multicursor/multicursor' entry: 'vs/editor/contrib/multicursor/multicursor'
}, },
{ {
label: 'parameterHints', label: 'parameterHints',
entry: 'vs/editor/contrib/parameterHints/parameterHints' entry: 'vs/editor/contrib/parameterHints/parameterHints'
}, },
{ {
label: 'quickCommand', label: 'quickCommand',
entry: 'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess' entry: 'vs/editor/standalone/browser/quickAccess/standaloneCommandsQuickAccess'
}, },
{ {
label: 'quickHelp', label: 'quickHelp',
entry: 'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess' entry: 'vs/editor/standalone/browser/quickAccess/standaloneHelpQuickAccess'
}, },
{ {
label: 'quickOutline', label: 'quickOutline',
entry: 'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess' entry: 'vs/editor/standalone/browser/quickAccess/standaloneGotoSymbolQuickAccess'
}, },
{ {
label: 'referenceSearch', label: 'referenceSearch',
entry: 'vs/editor/standalone/browser/referenceSearch/standaloneReferenceSearch' entry: 'vs/editor/standalone/browser/referenceSearch/standaloneReferenceSearch'
}, },
{ {
label: 'rename', label: 'rename',
entry: 'vs/editor/contrib/rename/rename' entry: 'vs/editor/contrib/rename/rename'
}, },
{ {
label: 'smartSelect', label: 'smartSelect',
entry: 'vs/editor/contrib/smartSelect/smartSelect' entry: 'vs/editor/contrib/smartSelect/smartSelect'
}, },
{ {
label: 'snippets', label: 'snippets',
entry: 'vs/editor/contrib/snippet/snippetController2' entry: 'vs/editor/contrib/snippet/snippetController2'
}, },
{ {
label: 'suggest', label: 'suggest',
entry: 'vs/editor/contrib/suggest/suggestController' entry: 'vs/editor/contrib/suggest/suggestController'
}, },
{ {
label: 'toggleHighContrast', label: 'toggleHighContrast',
entry: 'vs/editor/standalone/browser/toggleHighContrast/toggleHighContrast' entry: 'vs/editor/standalone/browser/toggleHighContrast/toggleHighContrast'
}, },
{ {
label: 'toggleTabFocusMode', label: 'toggleTabFocusMode',
entry: 'vs/editor/contrib/toggleTabFocusMode/toggleTabFocusMode' entry: 'vs/editor/contrib/toggleTabFocusMode/toggleTabFocusMode'
}, },
{ {
label: 'transpose', label: 'transpose',
entry: 'vs/editor/contrib/caretOperations/transpose' entry: 'vs/editor/contrib/caretOperations/transpose'
}, },
{ {
label: 'unusualLineTerminators', label: 'unusualLineTerminators',
entry: 'vs/editor/contrib/unusualLineTerminators/unusualLineTerminators' entry: 'vs/editor/contrib/unusualLineTerminators/unusualLineTerminators'
}, },
{ {
label: 'viewportSemanticTokens', label: 'viewportSemanticTokens',
entry: 'vs/editor/contrib/viewportSemanticTokens/viewportSemanticTokens' entry: 'vs/editor/contrib/viewportSemanticTokens/viewportSemanticTokens'
}, },
{ {
label: 'wordHighlighter', label: 'wordHighlighter',
entry: 'vs/editor/contrib/wordHighlighter/wordHighlighter' entry: 'vs/editor/contrib/wordHighlighter/wordHighlighter'
}, },
{ {
label: 'wordOperations', label: 'wordOperations',
entry: 'vs/editor/contrib/wordOperations/wordOperations' entry: 'vs/editor/contrib/wordOperations/wordOperations'
}, },
{ {
label: 'wordPartOperations', label: 'wordPartOperations',
entry: 'vs/editor/contrib/wordPartOperations/wordPartOperations' entry: 'vs/editor/contrib/wordPartOperations/wordPartOperations'
} }
]; ];
export type EditorFeature = 'accessibilityHelp' | 'anchorSelect' | 'bracketMatching' | 'caretOperations' | 'clipboard' | 'codeAction' | 'codelens' | 'colorPicker' | 'comment' | 'contextmenu' | 'coreCommands' | 'cursorUndo' | 'dnd' | 'documentSymbols' | 'find' | 'folding' | 'fontZoom' | 'format' | 'gotoError' | 'gotoLine' | 'gotoSymbol' | 'hover' | 'iPadShowKeyboard' | 'inPlaceReplace' | 'indentation' | 'inlayHints' | 'inlineCompletions' | 'inspectTokens' | 'linesOperations' | 'linkedEditing' | 'links' | 'multicursor' | 'parameterHints' | 'quickCommand' | 'quickHelp' | 'quickOutline' | 'referenceSearch' | 'rename' | 'smartSelect' | 'snippets' | 'suggest' | 'toggleHighContrast' | 'toggleTabFocusMode' | 'transpose' | 'unusualLineTerminators' | 'viewportSemanticTokens' | 'wordHighlighter' | 'wordOperations' | 'wordPartOperations'; export type EditorFeature =
| 'accessibilityHelp'
| 'anchorSelect'
| 'bracketMatching'
| 'caretOperations'
| 'clipboard'
| 'codeAction'
| 'codelens'
| 'colorPicker'
| 'comment'
| 'contextmenu'
| 'coreCommands'
| 'cursorUndo'
| 'dnd'
| 'documentSymbols'
| 'find'
| 'folding'
| 'fontZoom'
| 'format'
| 'gotoError'
| 'gotoLine'
| 'gotoSymbol'
| 'hover'
| 'iPadShowKeyboard'
| 'inPlaceReplace'
| 'indentation'
| 'inlayHints'
| 'inlineCompletions'
| 'inspectTokens'
| 'linesOperations'
| 'linkedEditing'
| 'links'
| 'multicursor'
| 'parameterHints'
| 'quickCommand'
| 'quickHelp'
| 'quickOutline'
| 'referenceSearch'
| 'rename'
| 'smartSelect'
| 'snippets'
| 'suggest'
| 'toggleHighContrast'
| 'toggleTabFocusMode'
| 'transpose'
| 'unusualLineTerminators'
| 'viewportSemanticTokens'
| 'wordHighlighter'
| 'wordOperations'
| 'wordPartOperations';
export type NegatedEditorFeature = '!accessibilityHelp' | '!anchorSelect' | '!bracketMatching' | '!caretOperations' | '!clipboard' | '!codeAction' | '!codelens' | '!colorPicker' | '!comment' | '!contextmenu' | '!coreCommands' | '!cursorUndo' | '!dnd' | '!documentSymbols' | '!find' | '!folding' | '!fontZoom' | '!format' | '!gotoError' | '!gotoLine' | '!gotoSymbol' | '!hover' | '!iPadShowKeyboard' | '!inPlaceReplace' | '!indentation' | '!inlayHints' | '!inlineCompletions' | '!inspectTokens' | '!linesOperations' | '!linkedEditing' | '!links' | '!multicursor' | '!parameterHints' | '!quickCommand' | '!quickHelp' | '!quickOutline' | '!referenceSearch' | '!rename' | '!smartSelect' | '!snippets' | '!suggest' | '!toggleHighContrast' | '!toggleTabFocusMode' | '!transpose' | '!unusualLineTerminators' | '!viewportSemanticTokens' | '!wordHighlighter' | '!wordOperations' | '!wordPartOperations'; export type NegatedEditorFeature =
| '!accessibilityHelp'
| '!anchorSelect'
| '!bracketMatching'
| '!caretOperations'
| '!clipboard'
| '!codeAction'
| '!codelens'
| '!colorPicker'
| '!comment'
| '!contextmenu'
| '!coreCommands'
| '!cursorUndo'
| '!dnd'
| '!documentSymbols'
| '!find'
| '!folding'
| '!fontZoom'
| '!format'
| '!gotoError'
| '!gotoLine'
| '!gotoSymbol'
| '!hover'
| '!iPadShowKeyboard'
| '!inPlaceReplace'
| '!indentation'
| '!inlayHints'
| '!inlineCompletions'
| '!inspectTokens'
| '!linesOperations'
| '!linkedEditing'
| '!links'
| '!multicursor'
| '!parameterHints'
| '!quickCommand'
| '!quickHelp'
| '!quickOutline'
| '!referenceSearch'
| '!rename'
| '!smartSelect'
| '!snippets'
| '!suggest'
| '!toggleHighContrast'
| '!toggleTabFocusMode'
| '!transpose'
| '!unusualLineTerminators'
| '!viewportSemanticTokens'
| '!wordHighlighter'
| '!wordOperations'
| '!wordPartOperations';

420
monaco-editor-webpack-plugin/src/index.ts
View file

@ -10,218 +10,235 @@ import { IFeatureDefinition } from './types';
const INCLUDE_LOADER_PATH = require.resolve('./loaders/include'); const INCLUDE_LOADER_PATH = require.resolve('./loaders/include');
const EDITOR_MODULE: IFeatureDefinition = { const EDITOR_MODULE: IFeatureDefinition = {
label: 'editorWorkerService', label: 'editorWorkerService',
entry: undefined, entry: undefined,
worker: { worker: {
id: 'vs/editor/editor', id: 'vs/editor/editor',
entry: 'vs/editor/editor.worker' entry: 'vs/editor/editor.worker'
}, }
}; };
const languagesById: { [language: string]: IFeatureDefinition; } = {}; const languagesById: { [language: string]: IFeatureDefinition } = {};
languagesArr.forEach(language => languagesById[language.label] = language); languagesArr.forEach((language) => (languagesById[language.label] = language));
const featuresById: { [feature: string]: IFeatureDefinition; } = {}; const featuresById: { [feature: string]: IFeatureDefinition } = {};
featuresArr.forEach(feature => featuresById[feature.label] = feature); featuresArr.forEach((feature) => (featuresById[feature.label] = feature));
/** /**
* Return a resolved path for a given Monaco file. * Return a resolved path for a given Monaco file.
*/ */
function resolveMonacoPath(filePath: string): string { function resolveMonacoPath(filePath: string): string {
try { try {
return require.resolve(path.join('monaco-editor/esm', filePath)); return require.resolve(path.join('monaco-editor/esm', filePath));
} catch(err) { } catch (err) {
try { try {
return require.resolve(path.join(process.cwd(), 'node_modules/monaco-editor/esm', filePath)); return require.resolve(path.join(process.cwd(), 'node_modules/monaco-editor/esm', filePath));
} catch(err){ } catch (err) {
return require.resolve(filePath); return require.resolve(filePath);
} }
} }
} }
/** /**
* Return the interpolated final filename for a worker, respecting the file name template. * Return the interpolated final filename for a worker, respecting the file name template.
*/ */
function getWorkerFilename(filename: string, entry: string): string { function getWorkerFilename(filename: string, entry: string): string {
return loaderUtils.interpolateName(<any>{ resourcePath: entry }, filename, { return loaderUtils.interpolateName(<any>{ resourcePath: entry }, filename, {
content: fs.readFileSync(resolveMonacoPath(entry)) content: fs.readFileSync(resolveMonacoPath(entry))
}); });
} }
function getFeaturesIds(userFeatures: string[]): string[] { function getFeaturesIds(userFeatures: string[]): string[] {
function notContainedIn(arr: string[]) { function notContainedIn(arr: string[]) {
return (element: string) => arr.indexOf(element) === -1; return (element: string) => arr.indexOf(element) === -1;
} }
let featuresIds: string[]; let featuresIds: string[];
if (userFeatures.length) { if (userFeatures.length) {
const excludedFeatures = userFeatures.filter(f => f[0] === '!').map(f => f.slice(1)); const excludedFeatures = userFeatures.filter((f) => f[0] === '!').map((f) => f.slice(1));
if (excludedFeatures.length) { if (excludedFeatures.length) {
featuresIds = Object.keys(featuresById).filter(notContainedIn(excludedFeatures)) featuresIds = Object.keys(featuresById).filter(notContainedIn(excludedFeatures));
} else { } else {
featuresIds = userFeatures; featuresIds = userFeatures;
} }
} else { } else {
featuresIds = Object.keys(featuresById); featuresIds = Object.keys(featuresById);
} }
return featuresIds; return featuresIds;
} }
interface IMonacoEditorWebpackPluginOpts { interface IMonacoEditorWebpackPluginOpts {
/** /**
* Include only a subset of the languages supported. * Include only a subset of the languages supported.
*/ */
languages?: EditorLanguage[]; languages?: EditorLanguage[];
/** /**
* Custom languages (outside of the ones shipped with the `monaco-editor`). * Custom languages (outside of the ones shipped with the `monaco-editor`).
*/ */
customLanguages?: IFeatureDefinition[]; customLanguages?: IFeatureDefinition[];
/** /**
* Include only a subset of the editor features. * Include only a subset of the editor features.
* Use e.g. '!contextmenu' to exclude a certain feature. * Use e.g. '!contextmenu' to exclude a certain feature.
*/ */
features?: (EditorFeature | NegatedEditorFeature)[]; features?: (EditorFeature | NegatedEditorFeature)[];
/** /**
* Specify a filename template to use for generated files. * Specify a filename template to use for generated files.
* Use e.g. '[name].worker.[contenthash].js' to include content-based hashes. * Use e.g. '[name].worker.[contenthash].js' to include content-based hashes.
*/ */
filename?: string; filename?: string;
/** /**
* Override the public path from which files generated by this plugin will be served. * Override the public path from which files generated by this plugin will be served.
* This wins out over Webpack's dynamic runtime path and can be useful to avoid attempting to load workers cross- * This wins out over Webpack's dynamic runtime path and can be useful to avoid attempting to load workers cross-
* origin when using a CDN for other static resources. * origin when using a CDN for other static resources.
* Use e.g. '/' if you want to load your resources from the current origin. * Use e.g. '/' if you want to load your resources from the current origin.
*/ */
publicPath?: string; publicPath?: string;
/** /**
* Specify whether the editor API should be exposed through a global `monaco` object or not. This * Specify whether the editor API should be exposed through a global `monaco` object or not. This
* option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM * option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM
* version of the monaco editor does no longer define a global `monaco` object unless * version of the monaco editor does no longer define a global `monaco` object unless
* `global.MonacoEnvironment = { globalAPI: true }` is set ([change * `global.MonacoEnvironment = { globalAPI: true }` is set ([change
* log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)). * log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)).
*/ */
globalAPI?: boolean; globalAPI?: boolean;
} }
interface IInternalMonacoEditorWebpackPluginOpts { interface IInternalMonacoEditorWebpackPluginOpts {
languages: IFeatureDefinition[]; languages: IFeatureDefinition[];
features: IFeatureDefinition[]; features: IFeatureDefinition[];
filename: string; filename: string;
publicPath: string; publicPath: string;
globalAPI: boolean; globalAPI: boolean;
} }
class MonacoEditorWebpackPlugin implements webpack.WebpackPluginInstance { class MonacoEditorWebpackPlugin implements webpack.WebpackPluginInstance {
private readonly options: IInternalMonacoEditorWebpackPluginOpts;
private readonly options: IInternalMonacoEditorWebpackPluginOpts; constructor(options: IMonacoEditorWebpackPluginOpts = {}) {
const languages = options.languages || Object.keys(languagesById);
const customLanguages = options.customLanguages || [];
const features = getFeaturesIds(options.features || []);
this.options = {
languages: coalesce(languages.map((id) => languagesById[id])).concat(customLanguages),
features: coalesce(features.map((id) => featuresById[id])),
filename: options.filename || '[name].worker.js',
publicPath: options.publicPath || '',
globalAPI: options.globalAPI || false
};
}
constructor(options: IMonacoEditorWebpackPluginOpts = {}) { apply(compiler: webpack.Compiler): void {
const languages = options.languages || Object.keys(languagesById); const { languages, features, filename, publicPath, globalAPI } = this.options;
const customLanguages = options.customLanguages || []; const compilationPublicPath = getCompilationPublicPath(compiler);
const features = getFeaturesIds(options.features || []); const modules = [EDITOR_MODULE].concat(languages).concat(features);
this.options = { const workers: ILabeledWorkerDefinition[] = [];
languages: coalesce(languages.map(id => languagesById[id])).concat(customLanguages), modules.forEach((module) => {
features: coalesce(features.map(id => featuresById[id])), if (module.worker) {
filename: options.filename || "[name].worker.js", workers.push({
publicPath: options.publicPath || '', label: module.label,
globalAPI: options.globalAPI || false, id: module.worker.id,
}; entry: module.worker.entry
} });
}
apply(compiler: webpack.Compiler): void { });
const { languages, features, filename, publicPath, globalAPI } = this.options; const rules = createLoaderRules(
const compilationPublicPath = getCompilationPublicPath(compiler); languages,
const modules = [EDITOR_MODULE].concat(languages).concat(features); features,
const workers: ILabeledWorkerDefinition[] = []; workers,
modules.forEach((module) => { filename,
if (module.worker) { publicPath,
workers.push({ compilationPublicPath,
label: module.label, globalAPI
id: module.worker.id, );
entry: module.worker.entry const plugins = createPlugins(compiler, workers, filename);
}); addCompilerRules(compiler, rules);
} addCompilerPlugins(compiler, plugins);
}); }
const rules = createLoaderRules(languages, features, workers, filename, publicPath, compilationPublicPath, globalAPI);
const plugins = createPlugins(compiler, workers, filename);
addCompilerRules(compiler, rules);
addCompilerPlugins(compiler, plugins);
}
} }
interface ILabeledWorkerDefinition { interface ILabeledWorkerDefinition {
label: string; label: string;
id: string; id: string;
entry: string; entry: string;
} }
function addCompilerRules(compiler: webpack.Compiler, rules: webpack.RuleSetRule[]): void { function addCompilerRules(compiler: webpack.Compiler, rules: webpack.RuleSetRule[]): void {
const compilerOptions = compiler.options; const compilerOptions = compiler.options;
if (!compilerOptions.module) { if (!compilerOptions.module) {
compilerOptions.module = <any>{ rules: rules }; compilerOptions.module = <any>{ rules: rules };
} else { } else {
const moduleOptions = compilerOptions.module; const moduleOptions = compilerOptions.module;
moduleOptions.rules = (moduleOptions.rules || []).concat(rules); moduleOptions.rules = (moduleOptions.rules || []).concat(rules);
} }
} }
function addCompilerPlugins(compiler: webpack.Compiler, plugins: webpack.WebpackPluginInstance[]) { function addCompilerPlugins(compiler: webpack.Compiler, plugins: webpack.WebpackPluginInstance[]) {
plugins.forEach((plugin) => plugin.apply(compiler)); plugins.forEach((plugin) => plugin.apply(compiler));
} }
function getCompilationPublicPath(compiler: webpack.Compiler): string { function getCompilationPublicPath(compiler: webpack.Compiler): string {
if (compiler.options.output && compiler.options.output.publicPath) { if (compiler.options.output && compiler.options.output.publicPath) {
if (typeof compiler.options.output.publicPath === 'string') { if (typeof compiler.options.output.publicPath === 'string') {
return compiler.options.output.publicPath; return compiler.options.output.publicPath;
} else { } else {
console.warn(`Cannot handle options.publicPath (expected a string)`); console.warn(`Cannot handle options.publicPath (expected a string)`);
} }
} }
return ''; return '';
} }
function createLoaderRules(languages: IFeatureDefinition[], features: IFeatureDefinition[], workers: ILabeledWorkerDefinition[], filename: string, pluginPublicPath: string, compilationPublicPath: string, globalAPI: boolean): webpack.RuleSetRule[] { function createLoaderRules(
if (!languages.length && !features.length) { languages: IFeatureDefinition[],
return []; features: IFeatureDefinition[],
} workers: ILabeledWorkerDefinition[],
const languagePaths = flatArr(coalesce(languages.map(language => language.entry))); filename: string,
const featurePaths = flatArr(coalesce(features.map(feature => feature.entry))); pluginPublicPath: string,
const workerPaths = fromPairs(workers.map(({ label, entry }) => [label, getWorkerFilename(filename, entry)])); compilationPublicPath: string,
if (workerPaths['typescript']) { globalAPI: boolean
// javascript shares the same worker ): webpack.RuleSetRule[] {
workerPaths['javascript'] = workerPaths['typescript']; if (!languages.length && !features.length) {
} return [];
if (workerPaths['css']) { }
// scss and less share the same worker const languagePaths = flatArr(coalesce(languages.map((language) => language.entry)));
workerPaths['less'] = workerPaths['css']; const featurePaths = flatArr(coalesce(features.map((feature) => feature.entry)));
workerPaths['scss'] = workerPaths['css']; const workerPaths = fromPairs(
} workers.map(({ label, entry }) => [label, getWorkerFilename(filename, entry)])
);
if (workerPaths['typescript']) {
// javascript shares the same worker
workerPaths['javascript'] = workerPaths['typescript'];
}
if (workerPaths['css']) {
// scss and less share the same worker
workerPaths['less'] = workerPaths['css'];
workerPaths['scss'] = workerPaths['css'];
}
if (workerPaths['html']) { if (workerPaths['html']) {
// handlebars, razor and html share the same worker // handlebars, razor and html share the same worker
workerPaths['handlebars'] = workerPaths['html']; workerPaths['handlebars'] = workerPaths['html'];
workerPaths['razor'] = workerPaths['html']; workerPaths['razor'] = workerPaths['html'];
} }
// Determine the public path from which to load worker JS files. In order of precedence: // Determine the public path from which to load worker JS files. In order of precedence:
// 1. Plugin-specific public path. // 1. Plugin-specific public path.
// 2. Dynamic runtime public path. // 2. Dynamic runtime public path.
// 3. Compilation public path. // 3. Compilation public path.
const pathPrefix = Boolean(pluginPublicPath) const pathPrefix = Boolean(pluginPublicPath)
? JSON.stringify(pluginPublicPath) ? JSON.stringify(pluginPublicPath)
: `typeof __webpack_public_path__ === 'string' ` + : `typeof __webpack_public_path__ === 'string' ` +
`? __webpack_public_path__ ` + `? __webpack_public_path__ ` +
`: ${JSON.stringify(compilationPublicPath)}` `: ${JSON.stringify(compilationPublicPath)}`;
const globals = { const globals = {
'MonacoEnvironment': `(function (paths) { MonacoEnvironment: `(function (paths) {
function stripTrailingSlash(str) { function stripTrailingSlash(str) {
return str.replace(/\\/$/, ''); return str.replace(/\\/$/, '');
} }
@ -245,56 +262,63 @@ function createLoaderRules(languages: IFeatureDefinition[], features: IFeatureDe
return result; return result;
} }
}; };
})(${JSON.stringify(workerPaths, null, 2)})`, })(${JSON.stringify(workerPaths, null, 2)})`
}; };
return [ return [
{ {
test: /monaco-editor[/\\]esm[/\\]vs[/\\]editor[/\\]editor.(api|main).js/, test: /monaco-editor[/\\]esm[/\\]vs[/\\]editor[/\\]editor.(api|main).js/,
use: [{ use: [
loader: INCLUDE_LOADER_PATH, {
options: { loader: INCLUDE_LOADER_PATH,
globals, options: {
pre: featurePaths.map((importPath) => resolveMonacoPath(importPath)), globals,
post: languagePaths.map((importPath) => resolveMonacoPath(importPath)), pre: featurePaths.map((importPath) => resolveMonacoPath(importPath)),
}, post: languagePaths.map((importPath) => resolveMonacoPath(importPath))
}], }
}, }
]; ]
}
];
} }
function createPlugins(compiler: webpack.Compiler, workers: ILabeledWorkerDefinition[], filename: string): AddWorkerEntryPointPlugin[] { function createPlugins(
const webpack = compiler.webpack ?? require('webpack'); compiler: webpack.Compiler,
workers: ILabeledWorkerDefinition[],
filename: string
): AddWorkerEntryPointPlugin[] {
const webpack = compiler.webpack ?? require('webpack');
return ( return (<AddWorkerEntryPointPlugin[]>[]).concat(
(<AddWorkerEntryPointPlugin[]>[]) workers.map(
.concat(workers.map(({ id, entry }) => ({ id, entry }) =>
new AddWorkerEntryPointPlugin({ new AddWorkerEntryPointPlugin({
id, id,
entry: resolveMonacoPath(entry), entry: resolveMonacoPath(entry),
filename: getWorkerFilename(filename, entry), filename: getWorkerFilename(filename, entry),
plugins: [ plugins: [new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 })]
new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 }), })
], )
}) );
))
);
} }
function flatArr<T>(items: (T | T[])[]): T[] { function flatArr<T>(items: (T | T[])[]): T[] {
return items.reduce((acc: T[], item: T | T[]) => { return items.reduce((acc: T[], item: T | T[]) => {
if (Array.isArray(item)) { if (Array.isArray(item)) {
return (<T[]>[]).concat(acc).concat(item); return (<T[]>[]).concat(acc).concat(item);
} }
return (<T[]>[]).concat(acc).concat([item]); return (<T[]>[]).concat(acc).concat([item]);
}, <T[]>[]); }, <T[]>[]);
} }
function fromPairs<T>(values: [string, T][]): { [key: string]: T; } { function fromPairs<T>(values: [string, T][]): { [key: string]: T } {
return values.reduce((acc, [key, value]) => Object.assign(acc, { [key]: value }), <{ [key: string]: T; }>{}); return values.reduce(
(acc, [key, value]) => Object.assign(acc, { [key]: value }),
<{ [key: string]: T }>{}
);
} }
function coalesce<T>(array: ReadonlyArray<T | undefined | null>): T[] { function coalesce<T>(array: ReadonlyArray<T | undefined | null>): T[] {
return <T[]>array.filter(Boolean); return <T[]>array.filter(Boolean);
} }
export = MonacoEditorWebpackPlugin; export = MonacoEditorWebpackPlugin;

742
monaco-editor-webpack-plugin/src/languages.ts
View file

@ -2,343 +2,413 @@
// THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY. // THIS IS A GENERATED FILE. PLEASE DO NOT EDIT DIRECTLY.
// GENERATED USING node scripts/import-editor.js // GENERATED USING node scripts/import-editor.js
// //
import { IFeatureDefinition } from "./types"; import { IFeatureDefinition } from './types';
export const languagesArr: IFeatureDefinition[] = [ export const languagesArr: IFeatureDefinition[] = [
{ {
label: 'abap', label: 'abap',
entry: 'vs/basic-languages/abap/abap.contribution' entry: 'vs/basic-languages/abap/abap.contribution'
}, },
{ {
label: 'apex', label: 'apex',
entry: 'vs/basic-languages/apex/apex.contribution' entry: 'vs/basic-languages/apex/apex.contribution'
}, },
{ {
label: 'azcli', label: 'azcli',
entry: 'vs/basic-languages/azcli/azcli.contribution' entry: 'vs/basic-languages/azcli/azcli.contribution'
}, },
{ {
label: 'bat', label: 'bat',
entry: 'vs/basic-languages/bat/bat.contribution' entry: 'vs/basic-languages/bat/bat.contribution'
}, },
{ {
label: 'bicep', label: 'bicep',
entry: 'vs/basic-languages/bicep/bicep.contribution' entry: 'vs/basic-languages/bicep/bicep.contribution'
}, },
{ {
label: 'cameligo', label: 'cameligo',
entry: 'vs/basic-languages/cameligo/cameligo.contribution' entry: 'vs/basic-languages/cameligo/cameligo.contribution'
}, },
{ {
label: 'clojure', label: 'clojure',
entry: 'vs/basic-languages/clojure/clojure.contribution' entry: 'vs/basic-languages/clojure/clojure.contribution'
}, },
{ {
label: 'coffee', label: 'coffee',
entry: 'vs/basic-languages/coffee/coffee.contribution' entry: 'vs/basic-languages/coffee/coffee.contribution'
}, },
{ {
label: 'cpp', label: 'cpp',
entry: 'vs/basic-languages/cpp/cpp.contribution' entry: 'vs/basic-languages/cpp/cpp.contribution'
}, },
{ {
label: 'csharp', label: 'csharp',
entry: 'vs/basic-languages/csharp/csharp.contribution' entry: 'vs/basic-languages/csharp/csharp.contribution'
}, },
{ {
label: 'csp', label: 'csp',
entry: 'vs/basic-languages/csp/csp.contribution' entry: 'vs/basic-languages/csp/csp.contribution'
}, },
{ {
label: 'css', label: 'css',
entry: [ entry: ['vs/basic-languages/css/css.contribution', 'vs/language/css/monaco.contribution'],
'vs/basic-languages/css/css.contribution', worker: {
'vs/language/css/monaco.contribution' id: 'vs/language/css/cssWorker',
], entry: 'vs/language/css/css.worker'
worker: { }
id: 'vs/language/css/cssWorker', },
entry: 'vs/language/css/css.worker' {
} label: 'dart',
}, entry: 'vs/basic-languages/dart/dart.contribution'
{ },
label: 'dart', {
entry: 'vs/basic-languages/dart/dart.contribution' label: 'dockerfile',
}, entry: 'vs/basic-languages/dockerfile/dockerfile.contribution'
{ },
label: 'dockerfile', {
entry: 'vs/basic-languages/dockerfile/dockerfile.contribution' label: 'ecl',
}, entry: 'vs/basic-languages/ecl/ecl.contribution'
{ },
label: 'ecl', {
entry: 'vs/basic-languages/ecl/ecl.contribution' label: 'elixir',
}, entry: 'vs/basic-languages/elixir/elixir.contribution'
{ },
label: 'elixir', {
entry: 'vs/basic-languages/elixir/elixir.contribution' label: 'flow9',
}, entry: 'vs/basic-languages/flow9/flow9.contribution'
{ },
label: 'flow9', {
entry: 'vs/basic-languages/flow9/flow9.contribution' label: 'fsharp',
}, entry: 'vs/basic-languages/fsharp/fsharp.contribution'
{ },
label: 'fsharp', {
entry: 'vs/basic-languages/fsharp/fsharp.contribution' label: 'go',
}, entry: 'vs/basic-languages/go/go.contribution'
{ },
label: 'go', {
entry: 'vs/basic-languages/go/go.contribution' label: 'graphql',
}, entry: 'vs/basic-languages/graphql/graphql.contribution'
{ },
label: 'graphql', {
entry: 'vs/basic-languages/graphql/graphql.contribution' label: 'handlebars',
}, entry: 'vs/basic-languages/handlebars/handlebars.contribution'
{ },
label: 'handlebars', {
entry: 'vs/basic-languages/handlebars/handlebars.contribution' label: 'hcl',
}, entry: 'vs/basic-languages/hcl/hcl.contribution'
{ },
label: 'hcl', {
entry: 'vs/basic-languages/hcl/hcl.contribution' label: 'html',
}, entry: ['vs/basic-languages/html/html.contribution', 'vs/language/html/monaco.contribution'],
{ worker: {
label: 'html', id: 'vs/language/html/htmlWorker',
entry: [ entry: 'vs/language/html/html.worker'
'vs/basic-languages/html/html.contribution', }
'vs/language/html/monaco.contribution' },
], {
worker: { label: 'ini',
id: 'vs/language/html/htmlWorker', entry: 'vs/basic-languages/ini/ini.contribution'
entry: 'vs/language/html/html.worker' },
} {
}, label: 'java',
{ entry: 'vs/basic-languages/java/java.contribution'
label: 'ini', },
entry: 'vs/basic-languages/ini/ini.contribution' {
}, label: 'javascript',
{ entry: 'vs/basic-languages/javascript/javascript.contribution'
label: 'java', },
entry: 'vs/basic-languages/java/java.contribution' {
}, label: 'json',
{ entry: 'vs/language/json/monaco.contribution',
label: 'javascript', worker: {
entry: 'vs/basic-languages/javascript/javascript.contribution' id: 'vs/language/json/jsonWorker',
}, entry: 'vs/language/json/json.worker'
{ }
label: 'json', },
entry: 'vs/language/json/monaco.contribution', {
worker: { label: 'julia',
id: 'vs/language/json/jsonWorker', entry: 'vs/basic-languages/julia/julia.contribution'
entry: 'vs/language/json/json.worker' },
} {
}, label: 'kotlin',
{ entry: 'vs/basic-languages/kotlin/kotlin.contribution'
label: 'julia', },
entry: 'vs/basic-languages/julia/julia.contribution' {
}, label: 'less',
{ entry: 'vs/basic-languages/less/less.contribution'
label: 'kotlin', },
entry: 'vs/basic-languages/kotlin/kotlin.contribution' {
}, label: 'lexon',
{ entry: 'vs/basic-languages/lexon/lexon.contribution'
label: 'less', },
entry: 'vs/basic-languages/less/less.contribution' {
}, label: 'liquid',
{ entry: 'vs/basic-languages/liquid/liquid.contribution'
label: 'lexon', },
entry: 'vs/basic-languages/lexon/lexon.contribution' {
}, label: 'lua',
{ entry: 'vs/basic-languages/lua/lua.contribution'
label: 'liquid', },
entry: 'vs/basic-languages/liquid/liquid.contribution' {
}, label: 'm3',
{ entry: 'vs/basic-languages/m3/m3.contribution'
label: 'lua', },
entry: 'vs/basic-languages/lua/lua.contribution' {
}, label: 'markdown',
{ entry: 'vs/basic-languages/markdown/markdown.contribution'
label: 'm3', },
entry: 'vs/basic-languages/m3/m3.contribution' {
}, label: 'mips',
{ entry: 'vs/basic-languages/mips/mips.contribution'
label: 'markdown', },
entry: 'vs/basic-languages/markdown/markdown.contribution' {
}, label: 'msdax',
{ entry: 'vs/basic-languages/msdax/msdax.contribution'
label: 'mips', },
entry: 'vs/basic-languages/mips/mips.contribution' {
}, label: 'mysql',
{ entry: 'vs/basic-languages/mysql/mysql.contribution'
label: 'msdax', },
entry: 'vs/basic-languages/msdax/msdax.contribution' {
}, label: 'objective-c',
{ entry: 'vs/basic-languages/objective-c/objective-c.contribution'
label: 'mysql', },
entry: 'vs/basic-languages/mysql/mysql.contribution' {
}, label: 'pascal',
{ entry: 'vs/basic-languages/pascal/pascal.contribution'
label: 'objective-c', },
entry: 'vs/basic-languages/objective-c/objective-c.contribution' {
}, label: 'pascaligo',
{ entry: 'vs/basic-languages/pascaligo/pascaligo.contribution'
label: 'pascal', },
entry: 'vs/basic-languages/pascal/pascal.contribution' {
}, label: 'perl',
{ entry: 'vs/basic-languages/perl/perl.contribution'
label: 'pascaligo', },
entry: 'vs/basic-languages/pascaligo/pascaligo.contribution' {
}, label: 'pgsql',
{ entry: 'vs/basic-languages/pgsql/pgsql.contribution'
label: 'perl', },
entry: 'vs/basic-languages/perl/perl.contribution' {
}, label: 'php',
{ entry: 'vs/basic-languages/php/php.contribution'
label: 'pgsql', },
entry: 'vs/basic-languages/pgsql/pgsql.contribution' {
}, label: 'pla',
{ entry: 'vs/basic-languages/pla/pla.contribution'
label: 'php', },
entry: 'vs/basic-languages/php/php.contribution' {
}, label: 'postiats',
{ entry: 'vs/basic-languages/postiats/postiats.contribution'
label: 'pla', },
entry: 'vs/basic-languages/pla/pla.contribution' {
}, label: 'powerquery',
{ entry: 'vs/basic-languages/powerquery/powerquery.contribution'
label: 'postiats', },
entry: 'vs/basic-languages/postiats/postiats.contribution' {
}, label: 'powershell',
{ entry: 'vs/basic-languages/powershell/powershell.contribution'
label: 'powerquery', },
entry: 'vs/basic-languages/powerquery/powerquery.contribution' {
}, label: 'protobuf',
{ entry: 'vs/basic-languages/protobuf/protobuf.contribution'
label: 'powershell', },
entry: 'vs/basic-languages/powershell/powershell.contribution' {
}, label: 'pug',
{ entry: 'vs/basic-languages/pug/pug.contribution'
label: 'protobuf', },
entry: 'vs/basic-languages/protobuf/protobuf.contribution' {
}, label: 'python',
{ entry: 'vs/basic-languages/python/python.contribution'
label: 'pug', },
entry: 'vs/basic-languages/pug/pug.contribution' {
}, label: 'qsharp',
{ entry: 'vs/basic-languages/qsharp/qsharp.contribution'
label: 'python', },
entry: 'vs/basic-languages/python/python.contribution' {
}, label: 'r',
{ entry: 'vs/basic-languages/r/r.contribution'
label: 'qsharp', },
entry: 'vs/basic-languages/qsharp/qsharp.contribution' {
}, label: 'razor',
{ entry: 'vs/basic-languages/razor/razor.contribution'
label: 'r', },
entry: 'vs/basic-languages/r/r.contribution' {
}, label: 'redis',
{ entry: 'vs/basic-languages/redis/redis.contribution'
label: 'razor', },
entry: 'vs/basic-languages/razor/razor.contribution' {
}, label: 'redshift',
{ entry: 'vs/basic-languages/redshift/redshift.contribution'
label: 'redis', },
entry: 'vs/basic-languages/redis/redis.contribution' {
}, label: 'restructuredtext',
{ entry: 'vs/basic-languages/restructuredtext/restructuredtext.contribution'
label: 'redshift', },
entry: 'vs/basic-languages/redshift/redshift.contribution' {
}, label: 'ruby',
{ entry: 'vs/basic-languages/ruby/ruby.contribution'
label: 'restructuredtext', },
entry: 'vs/basic-languages/restructuredtext/restructuredtext.contribution' {
}, label: 'rust',
{ entry: 'vs/basic-languages/rust/rust.contribution'
label: 'ruby', },
entry: 'vs/basic-languages/ruby/ruby.contribution' {
}, label: 'sb',
{ entry: 'vs/basic-languages/sb/sb.contribution'
label: 'rust', },
entry: 'vs/basic-languages/rust/rust.contribution' {
}, label: 'scala',
{ entry: 'vs/basic-languages/scala/scala.contribution'
label: 'sb', },
entry: 'vs/basic-languages/sb/sb.contribution' {
}, label: 'scheme',
{ entry: 'vs/basic-languages/scheme/scheme.contribution'
label: 'scala', },
entry: 'vs/basic-languages/scala/scala.contribution' {
}, label: 'scss',
{ entry: 'vs/basic-languages/scss/scss.contribution'
label: 'scheme', },
entry: 'vs/basic-languages/scheme/scheme.contribution' {
}, label: 'shell',
{ entry: 'vs/basic-languages/shell/shell.contribution'
label: 'scss', },
entry: 'vs/basic-languages/scss/scss.contribution' {
}, label: 'solidity',
{ entry: 'vs/basic-languages/solidity/solidity.contribution'
label: 'shell', },
entry: 'vs/basic-languages/shell/shell.contribution' {
}, label: 'sophia',
{ entry: 'vs/basic-languages/sophia/sophia.contribution'
label: 'solidity', },
entry: 'vs/basic-languages/solidity/solidity.contribution' {
}, label: 'sparql',
{ entry: 'vs/basic-languages/sparql/sparql.contribution'
label: 'sophia', },
entry: 'vs/basic-languages/sophia/sophia.contribution' {
}, label: 'sql',
{ entry: 'vs/basic-languages/sql/sql.contribution'
label: 'sparql', },
entry: 'vs/basic-languages/sparql/sparql.contribution' {
}, label: 'st',
{ entry: 'vs/basic-languages/st/st.contribution'
label: 'sql', },
entry: 'vs/basic-languages/sql/sql.contribution' {
}, label: 'swift',
{ entry: 'vs/basic-languages/swift/swift.contribution'
label: 'st', },
entry: 'vs/basic-languages/st/st.contribution' {
}, label: 'systemverilog',
{ entry: 'vs/basic-languages/systemverilog/systemverilog.contribution'
label: 'swift', },
entry: 'vs/basic-languages/swift/swift.contribution' {
}, label: 'tcl',
{ entry: 'vs/basic-languages/tcl/tcl.contribution'
label: 'systemverilog', },
entry: 'vs/basic-languages/systemverilog/systemverilog.contribution' {
}, label: 'twig',
{ entry: 'vs/basic-languages/twig/twig.contribution'
label: 'tcl', },
entry: 'vs/basic-languages/tcl/tcl.contribution' {
}, label: 'typescript',
{ entry: [
label: 'twig', 'vs/basic-languages/typescript/typescript.contribution',
entry: 'vs/basic-languages/twig/twig.contribution' 'vs/language/typescript/monaco.contribution'
}, ],
{ worker: {
label: 'typescript', id: 'vs/language/typescript/tsWorker',
entry: [ entry: 'vs/language/typescript/ts.worker'
'vs/basic-languages/typescript/typescript.contribution', }
'vs/language/typescript/monaco.contribution' },
], {
worker: { label: 'vb',
id: 'vs/language/typescript/tsWorker', entry: 'vs/basic-languages/vb/vb.contribution'
entry: 'vs/language/typescript/ts.worker' },
} {
}, label: 'xml',
{ entry: 'vs/basic-languages/xml/xml.contribution'
label: 'vb', },
entry: 'vs/basic-languages/vb/vb.contribution' {
}, label: 'yaml',
{ entry: 'vs/basic-languages/yaml/yaml.contribution'
label: 'xml', }
entry: 'vs/basic-languages/xml/xml.contribution'
},
{
label: 'yaml',
entry: 'vs/basic-languages/yaml/yaml.contribution'
}
]; ];
export type EditorLanguage = 'abap' | 'apex' | 'azcli' | 'bat' | 'bicep' | 'cameligo' | 'clojure' | 'coffee' | 'cpp' | 'csharp' | 'csp' | 'css' | 'dart' | 'dockerfile' | 'ecl' | 'elixir' | 'flow9' | 'fsharp' | 'go' | 'graphql' | 'handlebars' | 'hcl' | 'html' | 'ini' | 'java' | 'javascript' | 'json' | 'julia' | 'kotlin' | 'less' | 'lexon' | 'liquid' | 'lua' | 'm3' | 'markdown' | 'mips' | 'msdax' | 'mysql' | 'objective-c' | 'pascal' | 'pascaligo' | 'perl' | 'pgsql' | 'php' | 'pla' | 'postiats' | 'powerquery' | 'powershell' | 'protobuf' | 'pug' | 'python' | 'qsharp' | 'r' | 'razor' | 'redis' | 'redshift' | 'restructuredtext' | 'ruby' | 'rust' | 'sb' | 'scala' | 'scheme' | 'scss' | 'shell' | 'solidity' | 'sophia' | 'sparql' | 'sql' | 'st' | 'swift' | 'systemverilog' | 'tcl' | 'twig' | 'typescript' | 'vb' | 'xml' | 'yaml'; export type EditorLanguage =
| 'abap'
| 'apex'
| 'azcli'
| 'bat'
| 'bicep'
| 'cameligo'
| 'clojure'
| 'coffee'
| 'cpp'
| 'csharp'
| 'csp'
| 'css'
| 'dart'
| 'dockerfile'
| 'ecl'
| 'elixir'
| 'flow9'
| 'fsharp'
| 'go'
| 'graphql'
| 'handlebars'
| 'hcl'
| 'html'
| 'ini'
| 'java'
| 'javascript'
| 'json'
| 'julia'
| 'kotlin'
| 'less'
| 'lexon'
| 'liquid'
| 'lua'
| 'm3'
| 'markdown'
| 'mips'
| 'msdax'
| 'mysql'
| 'objective-c'
| 'pascal'
| 'pascaligo'
| 'perl'
| 'pgsql'
| 'php'
| 'pla'
| 'postiats'
| 'powerquery'
| 'powershell'
| 'protobuf'
| 'pug'
| 'python'
| 'qsharp'
| 'r'
| 'razor'
| 'redis'
| 'redshift'
| 'restructuredtext'
| 'ruby'
| 'rust'
| 'sb'
| 'scala'
| 'scheme'
| 'scss'
| 'shell'
| 'solidity'
| 'sophia'
| 'sparql'
| 'sql'
| 'st'
| 'swift'
| 'systemverilog'
| 'tcl'
| 'twig'
| 'typescript'
| 'vb'
| 'xml'
| 'yaml';

3
monaco-editor-webpack-plugin/src/loader-utils.d.ts vendored
View file

@ -1,4 +1,3 @@
declare module 'loader-utils' { declare module 'loader-utils' {
export function interpolateName(loaderContext: any, name: string, options?: any): string; export function interpolateName(loaderContext: any, name: string, options?: any): string;
} }

33
monaco-editor-webpack-plugin/src/loaders/include.ts
View file

@ -1,22 +1,21 @@
const loaderUtils = require('loader-utils'); const loaderUtils = require('loader-utils');
export function pitch(this: any, remainingRequest: any) { export function pitch(this: any, remainingRequest: any) {
const { globals = undefined, pre = [], post = [] } = loaderUtils.getOptions(this) || {}; const { globals = undefined, pre = [], post = [] } = loaderUtils.getOptions(this) || {};
// HACK: NamedModulesPlugin overwrites existing modules when requesting the same module via // HACK: NamedModulesPlugin overwrites existing modules when requesting the same module via
// different loaders, so we need to circumvent this by appending a suffix to make the name unique // different loaders, so we need to circumvent this by appending a suffix to make the name unique
// See https://github.com/webpack/webpack/issues/4613#issuecomment-325178346 for details // See https://github.com/webpack/webpack/issues/4613#issuecomment-325178346 for details
if (this._module && this._module.userRequest) { if (this._module && this._module.userRequest) {
this._module.userRequest = `include-loader!${this._module.userRequest}`; this._module.userRequest = `include-loader!${this._module.userRequest}`;
} }
return [ return [
...(globals ...(globals
? Object.keys(globals).map((key) => `self[${JSON.stringify(key)}] = ${globals[key]};`) ? Object.keys(globals).map((key) => `self[${JSON.stringify(key)}] = ${globals[key]};`)
: [] : []),
), ...pre.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`),
...pre.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`), `module.exports = require(${loaderUtils.stringifyRequest(this, `!!${remainingRequest}`)});`,
`module.exports = require(${loaderUtils.stringifyRequest(this, `!!${remainingRequest}`)});`, ...post.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`)
...post.map((include: any) => `require(${loaderUtils.stringifyRequest(this, include)});`), ].join('\n');
].join('\n'); }
};

89
monaco-editor-webpack-plugin/src/plugins/AddWorkerEntryPointPlugin.ts
View file

@ -1,52 +1,63 @@
import type * as webpack from 'webpack'; import type * as webpack from 'webpack';
export interface IAddWorkerEntryPointPluginOptions { export interface IAddWorkerEntryPointPluginOptions {
id: string; id: string;
entry: string; entry: string;
filename: string; filename: string;
chunkFilename?: string; chunkFilename?: string;
plugins: webpack.WebpackPluginInstance[]; plugins: webpack.WebpackPluginInstance[];
} }
function getCompilerHook(compiler: webpack.Compiler, { id, entry, filename, chunkFilename, plugins }: IAddWorkerEntryPointPluginOptions) { function getCompilerHook(
const webpack = compiler.webpack ?? require('webpack'); compiler: webpack.Compiler,
{ id, entry, filename, chunkFilename, plugins }: IAddWorkerEntryPointPluginOptions
) {
const webpack = compiler.webpack ?? require('webpack');
return function (compilation: webpack.Compilation, callback: (error?: Error | null | false) => void) { return function (
const outputOptions = { compilation: webpack.Compilation,
filename, callback: (error?: Error | null | false) => void
chunkFilename, ) {
publicPath: compilation.outputOptions.publicPath, const outputOptions = {
// HACK: globalObject is necessary to fix https://github.com/webpack/webpack/issues/6642 filename,
globalObject: 'this', chunkFilename,
}; publicPath: compilation.outputOptions.publicPath,
const childCompiler = compilation.createChildCompiler(id, outputOptions, [ // HACK: globalObject is necessary to fix https://github.com/webpack/webpack/issues/6642
new webpack.webworker.WebWorkerTemplatePlugin(), globalObject: 'this'
new webpack.LoaderTargetPlugin('webworker'), };
]); const childCompiler = compilation.createChildCompiler(id, outputOptions, [
const SingleEntryPlugin = webpack.EntryPlugin ?? webpack.SingleEntryPlugin; new webpack.webworker.WebWorkerTemplatePlugin(),
new SingleEntryPlugin(compiler.context, entry, 'main').apply(childCompiler); new webpack.LoaderTargetPlugin('webworker')
plugins.forEach((plugin) => plugin.apply(childCompiler)); ]);
const SingleEntryPlugin = webpack.EntryPlugin ?? webpack.SingleEntryPlugin;
new SingleEntryPlugin(compiler.context, entry, 'main').apply(childCompiler);
plugins.forEach((plugin) => plugin.apply(childCompiler));
childCompiler.runAsChild((err?: Error) => callback(err)); childCompiler.runAsChild((err?: Error) => callback(err));
} };
} }
export class AddWorkerEntryPointPlugin implements webpack.WebpackPluginInstance { export class AddWorkerEntryPointPlugin implements webpack.WebpackPluginInstance {
private readonly options: IAddWorkerEntryPointPluginOptions;
private readonly options: IAddWorkerEntryPointPluginOptions; constructor({
id,
entry,
filename,
chunkFilename = undefined,
plugins
}: IAddWorkerEntryPointPluginOptions) {
this.options = { id, entry, filename, chunkFilename, plugins };
}
constructor({ id, entry, filename, chunkFilename = undefined, plugins }: IAddWorkerEntryPointPluginOptions) { apply(compiler: webpack.Compiler) {
this.options = { id, entry, filename, chunkFilename, plugins }; const webpack = compiler.webpack ?? require('webpack');
} const compilerHook = getCompilerHook(compiler, this.options);
const majorVersion = webpack.version.split('.')[0];
apply(compiler: webpack.Compiler) { if (parseInt(majorVersion) < 4) {
const webpack = compiler.webpack ?? require('webpack'); (<any>compiler).plugin('make', compilerHook);
const compilerHook = getCompilerHook(compiler, this.options); } else {
const majorVersion = webpack.version.split('.')[0] compiler.hooks.make.tapAsync('AddWorkerEntryPointPlugin', compilerHook);
if (parseInt(majorVersion) < 4) { }
(<any>compiler).plugin('make', compilerHook); }
} else {
compiler.hooks.make.tapAsync('AddWorkerEntryPointPlugin', compilerHook);
}
}
} }

11
monaco-editor-webpack-plugin/src/types.ts
View file

@ -1,11 +1,10 @@
export interface IWorkerDefinition { export interface IWorkerDefinition {
id: string; id: string;
entry: string; entry: string;
} }
export interface IFeatureDefinition { export interface IFeatureDefinition {
label: string; label: string;
entry: string | string[] | undefined; entry: string | string[] | undefined;
worker?: IWorkerDefinition; worker?: IWorkerDefinition;
} }

20
monaco-editor-webpack-plugin/test/dist/index.html vendored
View file

@ -1,13 +1,13 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title> <title>Document</title>
</head> </head>
<body> <body>
<div id="container" style="width:800px;height:600px;border:1px solid #ccc"></div> <div id="container" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
<script type="text/javascript" src="app.js"></script> <script type="text/javascript" src="app.js"></script>
</body> </body>
</html> </html>

5
monaco-editor-webpack-plugin/test/index.js
View file

@ -1,7 +1,6 @@
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'; import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: 'console.log("Hello, world")', value: 'console.log("Hello, world")',
language: 'javascript' language: 'javascript'
}); });

41
monaco-editor-webpack-plugin/test/webpack-cross-origin.config.js
View file

@ -4,24 +4,25 @@ const path = require('path');
const ASSET_PATH = 'http://localhost:8088/monaco-editor-webpack-plugin/test/dist/'; const ASSET_PATH = 'http://localhost:8088/monaco-editor-webpack-plugin/test/dist/';
module.exports = { module.exports = {
mode: 'development', mode: 'development',
entry: './index.js', entry: './index.js',
context: __dirname, context: __dirname,
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'app.js', filename: 'app.js',
publicPath: ASSET_PATH publicPath: ASSET_PATH
}, },
module: { module: {
rules: [{ rules: [
test: /\.css$/, {
use: ['style-loader', 'css-loader'] test: /\.css$/,
}, { use: ['style-loader', 'css-loader']
test: /\.ttf$/, },
use: ['file-loader'] {
}] test: /\.ttf$/,
}, use: ['file-loader']
plugins: [ }
new MonacoWebpackPlugin() ]
] },
plugins: [new MonacoWebpackPlugin()]
}; };

39
monaco-editor-webpack-plugin/test/webpack.config.js
View file

@ -2,23 +2,24 @@ const MonacoWebpackPlugin = require('../out/index.js');
const path = require('path'); const path = require('path');
module.exports = { module.exports = {
mode: 'development', mode: 'development',
entry: './index.js', entry: './index.js',
context: __dirname, context: __dirname,
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'app.js' filename: 'app.js'
}, },
module: { module: {
rules: [{ rules: [
test: /\.css$/, {
use: ['style-loader', 'css-loader'] test: /\.css$/,
}, { use: ['style-loader', 'css-loader']
test: /\.ttf$/, },
use: ['file-loader'] {
}] test: /\.ttf$/,
}, use: ['file-loader']
plugins: [ }
new MonacoWebpackPlugin() ]
] },
plugins: [new MonacoWebpackPlugin()]
}; };

22
monaco-editor-webpack-plugin/tsconfig.json
View file

@ -1,15 +1,11 @@
{ {
"compilerOptions": { "compilerOptions": {
"module": "commonjs", "module": "commonjs",
"outDir": "out", "outDir": "out",
"target": "es6", "target": "es6",
"declaration": true, "declaration": true,
"strict": true "strict": true
}, },
"include": [ "include": ["src"],
"src" "exclude": ["node_modules"]
],
"exclude": [
"node_modules"
]
} }

1
monaco-editor/.github/ISSUE_TEMPLATE/bug_report.md vendored
View file

@ -29,4 +29,5 @@ about: Create a report to help us improve
**Playground code that reproduces the issue:** **Playground code that reproduces the issue:**
```js ```js
``` ```

2
monaco-editor/.github/ISSUE_TEMPLATE/config.yml vendored
View file

@ -1,5 +1,5 @@
blank_issues_enabled: false blank_issues_enabled: false
contact_links: contact_links:
- name: Question - name: Question
url: https://stackoverflow.com/questions/tagged/monaco-editor url: https://stackoverflow.com/questions/tagged/monaco-editor
about: Please ask and answer questions here. about: Please ask and answer questions here.

1
monaco-editor/.github/ISSUE_TEMPLATE/feature_request.md vendored
View file

@ -1,7 +1,6 @@
--- ---
name: Feature request name: Feature request
about: Suggest an idea for this project about: Suggest an idea for this project
--- ---
<!-- Please search existing issues to avoid creating duplicates. --> <!-- Please search existing issues to avoid creating duplicates. -->

119
monaco-editor/.github/commands.yml vendored
View file

@ -1,62 +1,63 @@
{ {
perform: true, perform: true,
commands: [ commands:
{ [
type: 'comment', {
name: 'question', type: 'comment',
allowUsers: [], name: 'question',
action: 'updateLabels', allowUsers: [],
addLabel: '*question' action: 'updateLabels',
}, addLabel: '*question'
{ },
type: 'label', {
name: '*question', type: 'label',
allowTriggerByBot: true, name: '*question',
action: 'close', allowTriggerByBot: true,
comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "Please ask your question on [StackOverflow](https://stackoverflow.com/questions/tagged/monaco-editor). We have a great community over [there](https://stackoverflow.com/questions/tagged/monaco-editor). They have already answered hundreds of questions and are happy to answer yours as well. You can also try [searching through existing issues](https://github.com/microsoft/monaco-editor/issues?utf8=%E2%9C%93&q=is%3Aissue+), looking at [API usage samples](https://microsoft.github.io/monaco-editor/playground.html) or at [integration samples](https://github.com/Microsoft/monaco-editor-samples). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'label', {
name: '*out-of-scope', type: 'label',
allowTriggerByBot: true, name: '*out-of-scope',
action: 'close', allowTriggerByBot: true,
comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!" action: 'close',
}, comment: "We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process [here](https://aka.ms/vscode-out-of-scope). If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.\n\nIf you wonder what we are up to, please see our [roadmap](https://aka.ms/vscoderoadmap) and [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nThanks for your understanding and happy coding!"
{ },
type: 'label', {
name: '*as-designed', type: 'label',
allowTriggerByBot: true, name: '*as-designed',
action: 'close', allowTriggerByBot: true,
comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "The described behavior is how it is expected to work. If you disagree, please explain what is expected and what is not in more detail. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'label', {
name: '*english-please', type: 'label',
allowTriggerByBot: true, name: '*english-please',
action: 'close', allowTriggerByBot: true,
comment: "This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful." action: 'close',
}, comment: 'This issue is being closed because its description is not in English, that makes it hard for us to work on it. Please open a new issue with an English description. You might find [Bing Translator](https://www.bing.com/translator) useful.'
{ },
type: 'comment', {
name: 'duplicate', type: 'comment',
allowUsers: [], name: 'duplicate',
action: 'updateLabels', allowUsers: [],
addLabel: '*duplicate' action: 'updateLabels',
}, addLabel: '*duplicate'
{ },
type: 'label', {
name: '*duplicate', type: 'label',
allowTriggerByBot: true, name: '*duplicate',
action: 'close', allowTriggerByBot: true,
comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" action: 'close',
}, comment: "Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues [here](https://github.com/Microsoft/monaco-editor/issues). See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
{ },
type: 'comment', {
name: 'needsMoreInfo', type: 'comment',
allowUsers: [], name: 'needsMoreInfo',
action: 'updateLabels', allowUsers: [],
addLabel: 'needs more info', action: 'updateLabels',
comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!" addLabel: 'needs more info',
}, comment: "Thanks for creating this issue! We figured it's missing some basic information or in some other way doesn't follow our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines. Please take the time to review these and update the issue.\n\nHappy Coding!"
}
] ]
} }

7
monaco-editor/.github/locker.yml vendored
View file

@ -1,6 +1 @@
{ { daysAfterClose: 45, daysSinceLastUpdate: 3, ignoredLabels: ['*out-of-scope'], perform: true }
daysAfterClose: 45,
daysSinceLastUpdate: 3,
ignoredLabels: ['*out-of-scope'],
perform: true
}

8
monaco-editor/.github/needs_more_info.yml vendored
View file

@ -1,6 +1,6 @@
{ {
daysUntilClose: 7, daysUntilClose: 7,
needsMoreInfoLabel: 'needs-more-info', needsMoreInfoLabel: 'needs-more-info',
perform: true, perform: true,
closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!" closeComment: "This issue has been closed automatically because it needs more information and has not had recent activity. See also our [issue reporting](https://aka.ms/vscodeissuereporting) guidelines.\n\nHappy Coding!"
} }

10
monaco-editor/.vscode/launch.json vendored
View file

@ -10,9 +10,7 @@
"name": "gulp release", "name": "gulp release",
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js", "program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
"stopOnEntry": true, "stopOnEntry": true,
"args": [ "args": ["release"],
"release"
],
"cwd": "${workspaceFolder}" "cwd": "${workspaceFolder}"
}, },
{ {
@ -21,10 +19,8 @@
"name": "gulp website", "name": "gulp website",
"program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js", "program": "${workspaceFolder}/node_modules/gulp/bin/gulp.js",
"stopOnEntry": true, "stopOnEntry": true,
"args": [ "args": ["website"],
"website"
],
"cwd": "${workspaceFolder}" "cwd": "${workspaceFolder}"
}, }
] ]
} }

26
monaco-editor/azure-pipelines.yml
View file

@ -4,18 +4,18 @@ pool:
vmImage: 'ubuntu-latest' vmImage: 'ubuntu-latest'
steps: steps:
- task: NodeTool@0 - task: NodeTool@0
inputs: inputs:
versionSpec: '12.x' versionSpec: '12.x'
displayName: 'Install Node.js' displayName: 'Install Node.js'
- script: | - script: |
npm install npm install
npm run build-website npm run build-website
displayName: 'Build website' displayName: 'Build website'
- script: | - script: |
./build/publish-website.sh ./build/publish-website.sh
env: env:
GITHUB_TOKEN: $(GITHUB_TOKEN) GITHUB_TOKEN: $(GITHUB_TOKEN)
displayName: 'Publish website' displayName: 'Publish website'

106
monaco-editor/ci/webpack.config.js
View file

@ -1,54 +1,60 @@
const path = require('path'); const path = require('path');
module.exports = { module.exports = {
mode: 'production', mode: 'production',
entry: { entry: {
"core": './ci/core.js', core: './ci/core.js',
"editor.worker": './vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js', 'editor.worker': './vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js',
"json.worker": 'monaco-json/release/esm/json.worker', 'json.worker': 'monaco-json/release/esm/json.worker',
"css.worker": 'monaco-css/release/esm/css.worker', 'css.worker': 'monaco-css/release/esm/css.worker',
"html.worker": 'monaco-html/release/esm/html.worker', 'html.worker': 'monaco-html/release/esm/html.worker',
"ts.worker": 'monaco-typescript/release/esm/ts.worker', 'ts.worker': 'monaco-typescript/release/esm/ts.worker'
}, },
output: { output: {
globalObject: 'self', globalObject: 'self',
filename: '[name].bundle.js', filename: '[name].bundle.js',
path: path.resolve(__dirname, '../dist') path: path.resolve(__dirname, '../dist')
}, },
module: { module: {
rules: [ rules: [
{ {
test: /\.css$/, test: /\.css$/,
use: ['style-loader', 'css-loader'], use: ['style-loader', 'css-loader']
}, },
{ {
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/, test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
use: [ use: [
{ {
loader: 'file-loader', loader: 'file-loader',
options: { options: {
name: '[name].[ext]', name: '[name].[ext]',
outputPath: 'fonts/' outputPath: 'fonts/'
} }
} }
] ]
} }
] ]
}, },
resolve: { resolve: {
alias: { alias: {
'monaco-editor-core/esm/vs/editor/editor.worker': path.resolve(__dirname, '../vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js'), 'monaco-editor-core/esm/vs/editor/editor.worker': path.resolve(
'monaco-editor-core': path.resolve(__dirname, '../vscode/out-monaco-editor-core/esm/vs/editor/editor.main.js'), __dirname,
} '../vscode/out-monaco-editor-core/esm/vs/editor/editor.worker.js'
}, ),
stats: { 'monaco-editor-core': path.resolve(
all: false, __dirname,
modules: true, '../vscode/out-monaco-editor-core/esm/vs/editor/editor.main.js'
errors: true, )
warnings: true, }
// our additional options },
moduleTrace: true, stats: {
errorDetails: true, all: false,
chunks: true modules: true,
} errors: true,
warnings: true,
// our additional options
moduleTrace: true,
errorDetails: true,
chunks: true
}
}; };

76
monaco-editor/docs/integrate-amd-cross.md
View file

@ -8,71 +8,77 @@ If you are hosting your `.js` on a different domain (e.g. on a CDN) than the HTM
Assuming the HTML lives on `www.mydomain.com` and the editor is hosted on `www.mycdn.com`. Assuming the HTML lives on `www.mydomain.com` and the editor is hosted on `www.mycdn.com`.
---- ---
# Option 1: Use a data: worker URI # Option 1: Use a data: worker URI
* `https://www.mydomain.com/index.html`: - `https://www.mydomain.com/index.html`:
```html ```html
<script type="text/javascript" src="http://www.mycdn.com/monaco-editor/min/vs/loader.js"></script> <script type="text/javascript" src="http://www.mycdn.com/monaco-editor/min/vs/loader.js"></script>
<script> <script>
require.config({ paths: { 'vs': 'http://www.mycdn.com/monaco-editor/min/vs' }}); require.config({
paths: { vs: 'http://www.mycdn.com/monaco-editor/min/vs' }
});
// Before loading vs/editor/editor.main, define a global MonacoEnvironment that overwrites // Before loading vs/editor/editor.main, define a global MonacoEnvironment that overwrites
// the default worker url location (used when creating WebWorkers). The problem here is that // the default worker url location (used when creating WebWorkers). The problem here is that
// HTML5 does not allow cross-domain web workers, so we need to proxy the instantiation of // HTML5 does not allow cross-domain web workers, so we need to proxy the instantiation of
// a web worker through a same-domain script // a web worker through a same-domain script
window.MonacoEnvironment = { window.MonacoEnvironment = {
getWorkerUrl: function(workerId, label) { getWorkerUrl: function (workerId, label) {
return `data:text/javascript;charset=utf-8,${encodeURIComponent(` return `data:text/javascript;charset=utf-8,${encodeURIComponent(`
self.MonacoEnvironment = { self.MonacoEnvironment = {
baseUrl: 'http://www.mycdn.com/monaco-editor/min/' baseUrl: 'http://www.mycdn.com/monaco-editor/min/'
}; };
importScripts('http://www.mycdn.com/monaco-editor/min/vs/base/worker/workerMain.js');` importScripts('http://www.mycdn.com/monaco-editor/min/vs/base/worker/workerMain.js');`)}`;
)}`; }
} };
};
require(["vs/editor/editor.main"], function () { require(['vs/editor/editor.main'], function () {
// ... // ...
}); });
</script> </script>
``` ```
---- ---
# Option 2: Host on your domain a worker proxy # Option 2: Host on your domain a worker proxy
* `https://www.mydomain.com/index.html`: - `https://www.mydomain.com/index.html`:
```html ```html
<script type="text/javascript" src="http://www.mycdn.com/monaco-editor/min/vs/loader.js"></script> <script type="text/javascript" src="http://www.mycdn.com/monaco-editor/min/vs/loader.js"></script>
<script> <script>
require.config({ paths: { 'vs': 'http://www.mycdn.com/monaco-editor/min/vs' }}); require.config({
paths: { vs: 'http://www.mycdn.com/monaco-editor/min/vs' }
});
// Before loading vs/editor/editor.main, define a global MonacoEnvironment that overwrites // Before loading vs/editor/editor.main, define a global MonacoEnvironment that overwrites
// the default worker url location (used when creating WebWorkers). The problem here is that // the default worker url location (used when creating WebWorkers). The problem here is that
// HTML5 does not allow cross-domain web workers, so we need to proxy the instantiation of // HTML5 does not allow cross-domain web workers, so we need to proxy the instantiation of
// a web worker through a same-domain script // a web worker through a same-domain script
window.MonacoEnvironment = { window.MonacoEnvironment = {
getWorkerUrl: function(workerId, label) { getWorkerUrl: function (workerId, label) {
return 'monaco-editor-worker-loader-proxy.js'; return 'monaco-editor-worker-loader-proxy.js';
} }
}; };
require(["vs/editor/editor.main"], function () { require(['vs/editor/editor.main'], function () {
// ... // ...
}); });
</script> </script>
``` ```
* `https://www.mydomain.com/monaco-editor-worker-loader-proxy.js`: - `https://www.mydomain.com/monaco-editor-worker-loader-proxy.js`:
```js ```js
self.MonacoEnvironment = { self.MonacoEnvironment = {
baseUrl: 'http://www.mycdn.com/monaco-editor/min/' baseUrl: 'http://www.mycdn.com/monaco-editor/min/'
}; };
importScripts('www.mycdn.com/monaco-editor/min/vs/base/worker/workerMain.js'); importScripts('www.mycdn.com/monaco-editor/min/vs/base/worker/workerMain.js');
``` ```
---- ---
That's it. You're good to go! :) That's it. You're good to go! :)

37
monaco-editor/docs/integrate-amd.md
View file

@ -7,27 +7,22 @@ More self-contained samples are available at [monaco-editor-samples](https://git
```html ```html
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" > <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<div id="container" style="width:800px;height:600px;border:1px solid grey"></div>
<div id="container" style="width:800px;height:600px;border:1px solid grey"></div> <script src="monaco-editor/min/vs/loader.js"></script>
<script>
<script src="monaco-editor/min/vs/loader.js"></script> require.config({ paths: { vs: 'monaco-editor/min/vs' } });
<script> require(['vs/editor/editor.main'], function () {
require.config({ paths: { 'vs': 'monaco-editor/min/vs' }}); var editor = monaco.editor.create(document.getElementById('container'), {
require(['vs/editor/editor.main'], function() { value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
var editor = monaco.editor.create(document.getElementById('container'), { language: 'javascript'
value: [ });
'function x() {', });
'\tconsole.log("Hello world!");', </script>
'}' </body>
].join('\n'),
language: 'javascript'
});
});
</script>
</body>
</html> </html>
``` ```

240
monaco-editor/docs/integrate-esm.md
View file

@ -18,43 +18,42 @@ More self-contained samples are available at [monaco-editor-samples](https://git
This is the easiest method, and it allows for options to be passed into the plugin in order to select only a subset of editor features or editor languages. Read more about the [Monaco Editor Loader Plugin](https://github.com/Microsoft/monaco-editor-webpack-plugin), which is a community authored plugin. This is the easiest method, and it allows for options to be passed into the plugin in order to select only a subset of editor features or editor languages. Read more about the [Monaco Editor Loader Plugin](https://github.com/Microsoft/monaco-editor-webpack-plugin), which is a community authored plugin.
* `index.js` - `index.js`
```js ```js
import * as monaco from 'monaco-editor'; import * as monaco from 'monaco-editor';
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: [ value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'function x() {', language: 'javascript'
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}); });
``` ```
* `webpack.config.js` - `webpack.config.js`
```js ```js
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const path = require('path'); const path = require('path');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'app.js' filename: 'app.js'
}, },
module: { module: {
rules: [{ rules: [
test: /\.css$/, {
use: ['style-loader', 'css-loader'] test: /\.css$/,
}, { use: ['style-loader', 'css-loader']
test: /\.ttf$/, },
use: ['file-loader'] {
}] test: /\.ttf$/,
}, use: ['file-loader']
plugins: [ }
new MonacoWebpackPlugin() ]
] },
plugins: [new MonacoWebpackPlugin()]
}; };
``` ```
@ -64,7 +63,8 @@ module.exports = {
Full working samples are available at https://github.com/Microsoft/monaco-editor-samples/tree/master/browser-esm-webpack or https://github.com/Microsoft/monaco-editor-samples/tree/master/browser-esm-webpack-small Full working samples are available at https://github.com/Microsoft/monaco-editor-samples/tree/master/browser-esm-webpack or https://github.com/Microsoft/monaco-editor-samples/tree/master/browser-esm-webpack-small
* `index.js` - `index.js`
```js ```js
import * as monaco from 'monaco-editor'; import * as monaco from 'monaco-editor';
@ -72,61 +72,61 @@ import * as monaco from 'monaco-editor';
// to instruct the editor how you named the // to instruct the editor how you named the
// bundles that contain the web workers. // bundles that contain the web workers.
self.MonacoEnvironment = { self.MonacoEnvironment = {
getWorkerUrl: function (moduleId, label) { getWorkerUrl: function (moduleId, label) {
if (label === 'json') { if (label === 'json') {
return './json.worker.bundle.js'; return './json.worker.bundle.js';
} }
if (label === 'css' || label === 'scss' || label === 'less') { if (label === 'css' || label === 'scss' || label === 'less') {
return './css.worker.bundle.js'; return './css.worker.bundle.js';
} }
if (label === 'html' || label === 'handlebars' || label === 'razor') { if (label === 'html' || label === 'handlebars' || label === 'razor') {
return './html.worker.bundle.js'; return './html.worker.bundle.js';
} }
if (label === 'typescript' || label === 'javascript') { if (label === 'typescript' || label === 'javascript') {
return './ts.worker.bundle.js'; return './ts.worker.bundle.js';
} }
return './editor.worker.bundle.js'; return './editor.worker.bundle.js';
} }
} };
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: [ value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'function x() {', language: 'javascript'
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}); });
``` ```
* `webpack.config.js`: - `webpack.config.js`:
```js ```js
const path = require('path'); const path = require('path');
module.exports = { module.exports = {
entry: { entry: {
"app": './index.js', app: './index.js',
// Package each language's worker and give these filenames in `getWorkerUrl` // Package each language's worker and give these filenames in `getWorkerUrl`
"editor.worker": 'monaco-editor/esm/vs/editor/editor.worker.js', 'editor.worker': 'monaco-editor/esm/vs/editor/editor.worker.js',
"json.worker": 'monaco-editor/esm/vs/language/json/json.worker', 'json.worker': 'monaco-editor/esm/vs/language/json/json.worker',
"css.worker": 'monaco-editor/esm/vs/language/css/css.worker', 'css.worker': 'monaco-editor/esm/vs/language/css/css.worker',
"html.worker": 'monaco-editor/esm/vs/language/html/html.worker', 'html.worker': 'monaco-editor/esm/vs/language/html/html.worker',
"ts.worker": 'monaco-editor/esm/vs/language/typescript/ts.worker', 'ts.worker': 'monaco-editor/esm/vs/language/typescript/ts.worker'
}, },
output: { output: {
globalObject: 'self', globalObject: 'self',
filename: '[name].bundle.js', filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist') path: path.resolve(__dirname, 'dist')
}, },
module: { module: {
rules: [{ rules: [
test: /\.css$/, {
use: ['style-loader', 'css-loader'] test: /\.css$/,
}, { use: ['style-loader', 'css-loader']
test: /\.ttf$/, },
use: ['file-loader'] {
}] test: /\.ttf$/,
} use: ['file-loader']
}
]
}
}; };
``` ```
@ -138,39 +138,37 @@ A full working sample is available at https://github.com/Microsoft/monaco-editor
When using parcel, we need to use the `getWorkerUrl` function and build the workers seperately from our main source. To simplify things, we can write a tiny bash script to build the workers for us. When using parcel, we need to use the `getWorkerUrl` function and build the workers seperately from our main source. To simplify things, we can write a tiny bash script to build the workers for us.
* `index.js` - `index.js`
```js ```js
import * as monaco from 'monaco-editor'; import * as monaco from 'monaco-editor';
self.MonacoEnvironment = { self.MonacoEnvironment = {
getWorkerUrl: function(moduleId, label) { getWorkerUrl: function (moduleId, label) {
if (label === 'json') { if (label === 'json') {
return './json.worker.js'; return './json.worker.js';
} }
if (label === 'css' || label === 'scss' || label === 'less') { if (label === 'css' || label === 'scss' || label === 'less') {
return './css.worker.js'; return './css.worker.js';
} }
if (label === 'html' || label === 'handlebars' || label === 'razor') { if (label === 'html' || label === 'handlebars' || label === 'razor') {
return './html.worker.js'; return './html.worker.js';
} }
if (label === 'typescript' || label === 'javascript') { if (label === 'typescript' || label === 'javascript') {
return './ts.worker.js'; return './ts.worker.js';
} }
return './editor.worker.js'; return './editor.worker.js';
}, }
}; };
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: [ value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
'function x() {', language: 'javascript'
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript'
}); });
``` ```
* `build_workers.sh` - `build_workers.sh`
```sh ```sh
ROOT=$PWD/node_modules/monaco-editor/esm/vs ROOT=$PWD/node_modules/monaco-editor/esm/vs
OPTS="--no-source-maps --log-level 1" # Parcel options - See: https://parceljs.org/cli.html OPTS="--no-source-maps --log-level 1" # Parcel options - See: https://parceljs.org/cli.html
@ -184,7 +182,7 @@ parcel build $ROOT/editor/editor.worker.js $OPTS
Then, simply run `sh ./build_workers.sh && parcel index.html`. This builds the workers into the same directory as your main bundle (usually `./dist`). If you want to change the `--out-dir` of the workers, you must change the paths in `index.js` to reflect their new location. Then, simply run `sh ./build_workers.sh && parcel index.html`. This builds the workers into the same directory as your main bundle (usually `./dist`). If you want to change the `--out-dir` of the workers, you must change the paths in `index.js` to reflect their new location.
*note - the `getWorkerUrl` paths are relative to the build directory of your src bundle* _note - the `getWorkerUrl` paths are relative to the build directory of your src bundle_
--- ---
@ -193,33 +191,33 @@ Then, simply run `sh ./build_workers.sh && parcel index.html`. This builds the w
Adding monaco editor to [Vite](https://vitejs.dev/) is simple since it has built-in support for web workers. You only need to implement the `getWorker` function (NOT the `getWorkerUrl`) to use Vite's output ([Source](https://github.com/vitejs/vite/discussions/1791#discussioncomment-321046)): Adding monaco editor to [Vite](https://vitejs.dev/) is simple since it has built-in support for web workers. You only need to implement the `getWorker` function (NOT the `getWorkerUrl`) to use Vite's output ([Source](https://github.com/vitejs/vite/discussions/1791#discussioncomment-321046)):
```js ```js
import * as monaco from 'monaco-editor' import * as monaco from 'monaco-editor';
import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker' import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker' import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker' import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker' import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker' import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
self.MonacoEnvironment = { self.MonacoEnvironment = {
getWorker(_, label) { getWorker(_, label) {
if (label === 'json') { if (label === 'json') {
return new jsonWorker() return new jsonWorker();
} }
if (label === 'css' || label === 'scss' || label === 'less') { if (label === 'css' || label === 'scss' || label === 'less') {
return new cssWorker() return new cssWorker();
} }
if (label === 'html' || label === 'handlebars' || label === 'razor') { if (label === 'html' || label === 'handlebars' || label === 'razor') {
return new htmlWorker() return new htmlWorker();
} }
if (label === 'typescript' || label === 'javascript') { if (label === 'typescript' || label === 'javascript') {
return new tsWorker() return new tsWorker();
} }
return new editorWorker() return new editorWorker();
} }
} };
monaco.editor.create(document.getElementById('container'), { monaco.editor.create(document.getElementById('container'), {
value: "function hello() {\n\talert('Hello world!');\n}", value: "function hello() {\n\talert('Hello world!');\n}",
language: 'javascript' language: 'javascript'
}) });
``` ```

725
monaco-editor/gulpfile.js
View file

@ -1,4 +1,3 @@
const gulp = require('gulp'); const gulp = require('gulp');
const metadata = require('./metadata'); const metadata = require('./metadata');
const es = require('event-stream'); const es = require('event-stream');
@ -14,7 +13,7 @@ const File = require('vinyl');
const ts = require('typescript'); const ts = require('typescript');
const WEBSITE_GENERATED_PATH = path.join(__dirname, 'website/playground/new-samples'); const WEBSITE_GENERATED_PATH = path.join(__dirname, 'website/playground/new-samples');
const MONACO_EDITOR_VERSION = (function() { const MONACO_EDITOR_VERSION = (function () {
const packageJsonPath = path.join(__dirname, '..', 'package.json'); const packageJsonPath = path.join(__dirname, '..', 'package.json');
const packageJson = JSON.parse(fs.readFileSync(packageJsonPath).toString()); const packageJson = JSON.parse(fs.readFileSync(packageJsonPath).toString());
const version = packageJson.version; const version = packageJson.version;
@ -50,8 +49,8 @@ async function _execute(task) {
return; return;
} }
// this is a stream returning task // this is a stream returning task
taskResult.on('end', _ => resolve()); taskResult.on('end', (_) => resolve());
taskResult.on('error', err => reject(err)); taskResult.on('error', (err) => reject(err));
}); });
} }
@ -63,60 +62,67 @@ function taskSeries(...tasks) {
}; };
} }
const cleanReleaseTask = function(cb) { rimraf('release', { maxBusyTries: 1 }, cb); }; const cleanReleaseTask = function (cb) {
gulp.task('release', taskSeries(cleanReleaseTask, function() { rimraf('release', { maxBusyTries: 1 }, cb);
return es.merge( };
gulp.task(
'release',
taskSeries(cleanReleaseTask, function () {
return es.merge(
// dev folder
releaseOne('dev'),
// dev folder // min folder
releaseOne('dev'), releaseOne('min'),
// min folder // esm folder
releaseOne('min'), ESM_release(),
// esm folder // package.json
ESM_release(), gulp
.src('package.json')
.pipe(
es.through(function (data) {
var json = JSON.parse(data.contents.toString());
json.private = false;
data.contents = Buffer.from(JSON.stringify(json, null, ' '));
this.emit('data', data);
})
)
.pipe(gulp.dest('release')),
// package.json gulp.src('CHANGELOG.md').pipe(gulp.dest('release')),
gulp.src('package.json')
.pipe(es.through(function(data) {
var json = JSON.parse(data.contents.toString());
json.private = false;
data.contents = Buffer.from(JSON.stringify(json, null, ' '));
this.emit('data', data);
}))
.pipe(gulp.dest('release')),
gulp.src('CHANGELOG.md') // min-maps folder
.pipe(gulp.dest('release')), gulp.src('node_modules/monaco-editor-core/min-maps/**/*').pipe(gulp.dest('release/min-maps')),
// min-maps folder // other files
gulp.src('node_modules/monaco-editor-core/min-maps/**/*') gulp
.pipe(gulp.dest('release/min-maps')), .src([
'node_modules/monaco-editor-core/LICENSE',
// other files 'node_modules/monaco-editor-core/monaco.d.ts',
gulp.src([ 'node_modules/monaco-editor-core/ThirdPartyNotices.txt',
'node_modules/monaco-editor-core/LICENSE', 'README.md'
'node_modules/monaco-editor-core/monaco.d.ts', ])
'node_modules/monaco-editor-core/ThirdPartyNotices.txt', .pipe(addPluginDTS())
'README.md' .pipe(addPluginThirdPartyNotices())
]) .pipe(gulp.dest('release'))
.pipe(addPluginDTS()) );
.pipe(addPluginThirdPartyNotices()) })
.pipe(gulp.dest('release')) );
)
}));
/** /**
* Release to `dev` or `min`. * Release to `dev` or `min`.
*/ */
function releaseOne(type) { function releaseOne(type) {
return es.merge( return es.merge(
gulp.src('node_modules/monaco-editor-core/' + type + '/**/*') gulp
.src('node_modules/monaco-editor-core/' + type + '/**/*')
.pipe(addPluginContribs(type)) .pipe(addPluginContribs(type))
.pipe(gulp.dest('release/' + type)), .pipe(gulp.dest('release/' + type)),
pluginStreams(type, 'release/' + type + '/') pluginStreams(type, 'release/' + type + '/')
) );
} }
/** /**
@ -124,7 +130,7 @@ function releaseOne(type) {
*/ */
function pluginStreams(type, destinationPath) { function pluginStreams(type, destinationPath) {
return es.merge( return es.merge(
metadata.METADATA.PLUGINS.map(function(plugin) { metadata.METADATA.PLUGINS.map(function (plugin) {
return pluginStream(plugin, type, destinationPath); return pluginStream(plugin, type, destinationPath);
}) })
); );
@ -135,25 +141,27 @@ function pluginStreams(type, destinationPath) {
*/ */
function pluginStream(plugin, type, destinationPath) { function pluginStream(plugin, type, destinationPath) {
var pluginPath = plugin.paths[`npm/${type}`]; // npm/dev or npm/min var pluginPath = plugin.paths[`npm/${type}`]; // npm/dev or npm/min
var contribPath = path.join(pluginPath, plugin.contrib.substr(plugin.modulePrefix.length)) + '.js'; var contribPath =
return ( path.join(pluginPath, plugin.contrib.substr(plugin.modulePrefix.length)) + '.js';
gulp.src([ return gulp
pluginPath + '/**/*', .src([pluginPath + '/**/*', '!' + contribPath])
'!' + contribPath .pipe(
]) es.through(function (data) {
.pipe(es.through(function(data) { if (!/_\.contribution/.test(data.path)) {
if (!/_\.contribution/.test(data.path)) { this.emit('data', data);
this.emit('data', data); return;
return; }
}
let contents = data.contents.toString(); let contents = data.contents.toString();
contents = contents.replace('define(["require", "exports"],', 'define(["require", "exports", "vs/editor/editor.api"],'); contents = contents.replace(
data.contents = Buffer.from(contents); 'define(["require", "exports"],',
this.emit('data', data); 'define(["require", "exports", "vs/editor/editor.api"],'
})) );
.pipe(gulp.dest(destinationPath + plugin.modulePrefix)) data.contents = Buffer.from(contents);
); this.emit('data', data);
})
)
.pipe(gulp.dest(destinationPath + plugin.modulePrefix));
} }
/** /**
@ -163,7 +171,7 @@ function pluginStream(plugin, type, destinationPath) {
* - append new AMD module 'vs/editor/editor.main' that stiches things together * - append new AMD module 'vs/editor/editor.main' that stiches things together
*/ */
function addPluginContribs(type) { function addPluginContribs(type) {
return es.through(function(data) { return es.through(function (data) {
if (!/editor\.main\.js$/.test(data.path)) { if (!/editor\.main\.js$/.test(data.path)) {
this.emit('data', data); this.emit('data', data);
return; return;
@ -176,26 +184,36 @@ function addPluginContribs(type) {
var extraContent = []; var extraContent = [];
var allPluginsModuleIds = []; var allPluginsModuleIds = [];
metadata.METADATA.PLUGINS.forEach(function(plugin) { metadata.METADATA.PLUGINS.forEach(function (plugin) {
allPluginsModuleIds.push(plugin.contrib); allPluginsModuleIds.push(plugin.contrib);
var pluginPath = plugin.paths[`npm/${type}`]; // npm/dev or npm/min var pluginPath = plugin.paths[`npm/${type}`]; // npm/dev or npm/min
var contribPath = path.join(__dirname, pluginPath, plugin.contrib.substr(plugin.modulePrefix.length)) + '.js'; var contribPath =
path.join(__dirname, pluginPath, plugin.contrib.substr(plugin.modulePrefix.length)) + '.js';
var contribContents = fs.readFileSync(contribPath).toString(); var contribContents = fs.readFileSync(contribPath).toString();
contribContents = contribContents.replace( contribContents = contribContents.replace(
/define\((['"][a-z\/\-]+\/fillers\/monaco-editor-core['"]),\[\],/, /define\((['"][a-z\/\-]+\/fillers\/monaco-editor-core['"]),\[\],/,
'define($1,[\'vs/editor/editor.api\'],' "define($1,['vs/editor/editor.api'],"
); );
extraContent.push(contribContents); extraContent.push(contribContents);
}); });
extraContent.push(`define("vs/editor/editor.main", ["vs/editor/edcore.main","${allPluginsModuleIds.join('","')}"], function(api) { return api; });`); extraContent.push(
`define("vs/editor/editor.main", ["vs/editor/edcore.main","${allPluginsModuleIds.join(
'","'
)}"], function(api) { return api; });`
);
var insertIndex = contents.lastIndexOf('//# sourceMappingURL='); var insertIndex = contents.lastIndexOf('//# sourceMappingURL=');
if (insertIndex === -1) { if (insertIndex === -1) {
insertIndex = contents.length; insertIndex = contents.length;
} }
contents = contents.substring(0, insertIndex) + '\n' + extraContent.join('\n') + '\n' + contents.substring(insertIndex); contents =
contents.substring(0, insertIndex) +
'\n' +
extraContent.join('\n') +
'\n' +
contents.substring(insertIndex);
data.contents = Buffer.from(contents); data.contents = Buffer.from(contents);
this.emit('data', data); this.emit('data', data);
@ -204,17 +222,18 @@ function addPluginContribs(type) {
function ESM_release() { function ESM_release() {
return es.merge( return es.merge(
gulp.src([ gulp
'node_modules/monaco-editor-core/esm/**/*', .src([
// we will create our own editor.api.d.ts which also contains the plugins API 'node_modules/monaco-editor-core/esm/**/*',
'!node_modules/monaco-editor-core/esm/vs/editor/editor.api.d.ts' // we will create our own editor.api.d.ts which also contains the plugins API
]) '!node_modules/monaco-editor-core/esm/vs/editor/editor.api.d.ts'
])
.pipe(ESM_addImportSuffix()) .pipe(ESM_addImportSuffix())
.pipe(ESM_addPluginContribs('release/esm')) .pipe(ESM_addPluginContribs('release/esm'))
.pipe(gulp.dest('release/esm')), .pipe(gulp.dest('release/esm')),
ESM_pluginStreams('release/esm/') ESM_pluginStreams('release/esm/')
) );
} }
/** /**
@ -222,7 +241,7 @@ function ESM_release() {
*/ */
function ESM_pluginStreams(destinationPath) { function ESM_pluginStreams(destinationPath) {
return es.merge( return es.merge(
metadata.METADATA.PLUGINS.map(function(plugin) { metadata.METADATA.PLUGINS.map(function (plugin) {
return ESM_pluginStream(plugin, destinationPath); return ESM_pluginStream(plugin, destinationPath);
}) })
); );
@ -236,85 +255,88 @@ function ESM_pluginStreams(destinationPath) {
function ESM_pluginStream(plugin, destinationPath) { function ESM_pluginStream(plugin, destinationPath) {
const DESTINATION = path.join(__dirname, destinationPath); const DESTINATION = path.join(__dirname, destinationPath);
let pluginPath = plugin.paths[`esm`]; let pluginPath = plugin.paths[`esm`];
return ( return gulp
gulp.src([ .src([pluginPath + '/**/*'])
pluginPath + '/**/*' .pipe(
]) es.through(function (data) {
.pipe(es.through(function(data) { if (!/(\.js$)|(\.ts$)/.test(data.path)) {
if (!/(\.js$)|(\.ts$)/.test(data.path)) { this.emit('data', data);
this.emit('data', data); return;
return;
}
let contents = data.contents.toString();
const info = ts.preProcessFile(contents);
for (let i = info.importedFiles.length - 1; i >= 0; i--) {
let importText = info.importedFiles[i].fileName;
const pos = info.importedFiles[i].pos;
const end = info.importedFiles[i].end;
if (!/(^\.\/)|(^\.\.\/)/.test(importText)) {
// non-relative import
if (!/^monaco-editor-core/.test(importText)) {
console.error(`Non-relative import for unknown module: ${importText} in ${data.path}`);
process.exit(0);
}
if (importText === 'monaco-editor-core') {
importText = 'monaco-editor-core/esm/vs/editor/editor.api';
}
const myFileDestPath = path.join(DESTINATION, plugin.modulePrefix, data.relative);
const importFilePath = path.join(DESTINATION, importText.substr('monaco-editor-core/esm/'.length));
let relativePath = path.relative(path.dirname(myFileDestPath), importFilePath).replace(/\\/g, '/');
if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) {
relativePath = './' + relativePath;
}
contents = (
contents.substring(0, pos + 1)
+ relativePath
+ contents.substring(end + 1)
);
} }
}
contents = contents.replace(/\/\/# sourceMappingURL=.*((\r?\n)|$)/g, ''); let contents = data.contents.toString();
data.contents = Buffer.from(contents); const info = ts.preProcessFile(contents);
this.emit('data', data); for (let i = info.importedFiles.length - 1; i >= 0; i--) {
})) let importText = info.importedFiles[i].fileName;
.pipe(es.through(function(data) { const pos = info.importedFiles[i].pos;
if (!/monaco\.contribution\.js$/.test(data.path)) { const end = info.importedFiles[i].end;
if (!/(^\.\/)|(^\.\.\/)/.test(importText)) {
// non-relative import
if (!/^monaco-editor-core/.test(importText)) {
console.error(
`Non-relative import for unknown module: ${importText} in ${data.path}`
);
process.exit(0);
}
if (importText === 'monaco-editor-core') {
importText = 'monaco-editor-core/esm/vs/editor/editor.api';
}
const myFileDestPath = path.join(DESTINATION, plugin.modulePrefix, data.relative);
const importFilePath = path.join(
DESTINATION,
importText.substr('monaco-editor-core/esm/'.length)
);
let relativePath = path
.relative(path.dirname(myFileDestPath), importFilePath)
.replace(/\\/g, '/');
if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) {
relativePath = './' + relativePath;
}
contents = contents.substring(0, pos + 1) + relativePath + contents.substring(end + 1);
}
}
contents = contents.replace(/\/\/# sourceMappingURL=.*((\r?\n)|$)/g, '');
data.contents = Buffer.from(contents);
this.emit('data', data); this.emit('data', data);
return; })
} )
.pipe(
es.through(function (data) {
if (!/monaco\.contribution\.js$/.test(data.path)) {
this.emit('data', data);
return;
}
const myFileDestPath = path.join(DESTINATION, plugin.modulePrefix, data.relative); const myFileDestPath = path.join(DESTINATION, plugin.modulePrefix, data.relative);
const apiFilePath = path.join(DESTINATION, 'vs/editor/editor.api'); const apiFilePath = path.join(DESTINATION, 'vs/editor/editor.api');
let relativePath = path.relative(path.dirname(myFileDestPath), apiFilePath).replace(/\\/g, '/'); let relativePath = path
if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) { .relative(path.dirname(myFileDestPath), apiFilePath)
relativePath = './' + relativePath; .replace(/\\/g, '/');
} if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) {
relativePath = './' + relativePath;
}
let contents = data.contents.toString(); let contents = data.contents.toString();
contents = ( contents = `import '${relativePath}';\n` + contents;
`import '${relativePath}';\n` +
contents
);
data.contents = Buffer.from(contents); data.contents = Buffer.from(contents);
this.emit('data', data); this.emit('data', data);
})) })
)
.pipe(ESM_addImportSuffix()) .pipe(ESM_addImportSuffix())
.pipe(gulp.dest(destinationPath + plugin.modulePrefix)) .pipe(gulp.dest(destinationPath + plugin.modulePrefix));
);
} }
function ESM_addImportSuffix() { function ESM_addImportSuffix() {
return es.through(function(data) { return es.through(function (data) {
if (!/\.js$/.test(data.path)) { if (!/\.js$/.test(data.path)) {
this.emit('data', data); this.emit('data', data);
return; return;
@ -332,11 +354,7 @@ function ESM_addImportSuffix() {
continue; continue;
} }
contents = ( contents = contents.substring(0, pos + 1) + importText + '.js' + contents.substring(end + 1);
contents.substring(0, pos + 1)
+ importText + '.js'
+ contents.substring(end + 1)
);
} }
data.contents = Buffer.from(contents); data.contents = Buffer.from(contents);
@ -350,24 +368,29 @@ function ESM_addImportSuffix() {
*/ */
function ESM_addPluginContribs(dest) { function ESM_addPluginContribs(dest) {
const DESTINATION = path.join(__dirname, dest); const DESTINATION = path.join(__dirname, dest);
return es.through(function(data) { return es.through(function (data) {
if (!/editor\.main\.js$/.test(data.path)) { if (!/editor\.main\.js$/.test(data.path)) {
this.emit('data', data); this.emit('data', data);
return; return;
} }
this.emit('data', new File({ this.emit(
path: data.path.replace(/editor\.main/, 'edcore.main'), 'data',
base: data.base, new File({
contents: data.contents path: data.path.replace(/editor\.main/, 'edcore.main'),
})); base: data.base,
contents: data.contents
})
);
const mainFileDestPath = path.join(DESTINATION, 'vs/editor/editor.main.js'); const mainFileDestPath = path.join(DESTINATION, 'vs/editor/editor.main.js');
let mainFileImports = []; let mainFileImports = [];
metadata.METADATA.PLUGINS.forEach(function(plugin) { metadata.METADATA.PLUGINS.forEach(function (plugin) {
const contribDestPath = path.join(DESTINATION, plugin.contrib); const contribDestPath = path.join(DESTINATION, plugin.contrib);
let relativePath = path.relative(path.dirname(mainFileDestPath), contribDestPath).replace(/\\/g, '/'); let relativePath = path
.relative(path.dirname(mainFileDestPath), contribDestPath)
.replace(/\\/g, '/');
if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) { if (!/(^\.\/)|(^\.\.\/)/.test(relativePath)) {
relativePath = './' + relativePath; relativePath = './' + relativePath;
} }
@ -375,16 +398,18 @@ function ESM_addPluginContribs(dest) {
mainFileImports.push(relativePath); mainFileImports.push(relativePath);
}); });
let mainFileContents = ( let mainFileContents =
mainFileImports.map((name) => `import '${name}';`).join('\n') mainFileImports.map((name) => `import '${name}';`).join('\n') +
+ `\n\nexport * from './edcore.main';` `\n\nexport * from './edcore.main';`;
);
this.emit('data', new File({ this.emit(
path: data.path, 'data',
base: data.base, new File({
contents: Buffer.from(mainFileContents) path: data.path,
})); base: data.base,
contents: Buffer.from(mainFileContents)
})
);
}); });
} }
@ -393,7 +418,7 @@ function ESM_addPluginContribs(dest) {
* - append monaco.d.ts from plugins * - append monaco.d.ts from plugins
*/ */
function addPluginDTS() { function addPluginDTS() {
return es.through(function(data) { return es.through(function (data) {
if (!/monaco\.d\.ts$/.test(data.path)) { if (!/monaco\.d\.ts$/.test(data.path)) {
this.emit('data', data); this.emit('data', data);
return; return;
@ -401,7 +426,7 @@ function addPluginDTS() {
var contents = data.contents.toString(); var contents = data.contents.toString();
var extraContent = []; var extraContent = [];
metadata.METADATA.PLUGINS.forEach(function(plugin) { metadata.METADATA.PLUGINS.forEach(function (plugin) {
var pluginPath = plugin.paths[`npm/min`]; // npm/dev or npm/min var pluginPath = plugin.paths[`npm/min`]; // npm/dev or npm/min
var dtsPath = path.join(pluginPath, '../monaco.d.ts'); var dtsPath = path.join(pluginPath, '../monaco.d.ts');
try { try {
@ -413,24 +438,32 @@ function addPluginDTS() {
} }
}); });
contents = [ contents =
'/*!-----------------------------------------------------------', [
' * Copyright (c) Microsoft Corporation. All rights reserved.', '/*!-----------------------------------------------------------',
' * Type definitions for monaco-editor', ' * Copyright (c) Microsoft Corporation. All rights reserved.',
' * Released under the MIT license', ' * Type definitions for monaco-editor',
'*-----------------------------------------------------------*/', ' * Released under the MIT license',
].join('\n') + '\n' + contents + '\n' + extraContent.join('\n'); '*-----------------------------------------------------------*/'
].join('\n') +
'\n' +
contents +
'\n' +
extraContent.join('\n');
// Ensure consistent indentation and line endings // Ensure consistent indentation and line endings
contents = cleanFile(contents); contents = cleanFile(contents);
data.contents = Buffer.from(contents); data.contents = Buffer.from(contents);
this.emit('data', new File({ this.emit(
path: path.join(path.dirname(data.path), 'esm/vs/editor/editor.api.d.ts'), 'data',
base: data.base, new File({
contents: Buffer.from(toExternalDTS(contents)) path: path.join(path.dirname(data.path), 'esm/vs/editor/editor.api.d.ts'),
})); base: data.base,
contents: Buffer.from(toExternalDTS(contents))
})
);
fs.writeFileSync('website/playground/monaco.d.ts.txt', contents); fs.writeFileSync('website/playground/monaco.d.ts.txt', contents);
fs.writeFileSync('typedoc/monaco.d.ts', contents); fs.writeFileSync('typedoc/monaco.d.ts', contents);
@ -484,18 +517,21 @@ function toExternalDTS(contents) {
* Normalize line endings and ensure consistent 4 spaces indentation * Normalize line endings and ensure consistent 4 spaces indentation
*/ */
function cleanFile(contents) { function cleanFile(contents) {
return contents.split(/\r\n|\r|\n/).map(function(line) { return contents
var m = line.match(/^(\t+)/); .split(/\r\n|\r|\n/)
if (!m) { .map(function (line) {
return line; var m = line.match(/^(\t+)/);
} if (!m) {
var tabsCount = m[1].length; return line;
var newIndent = ''; }
for (var i = 0; i < 4 * tabsCount; i++) { var tabsCount = m[1].length;
newIndent += ' '; var newIndent = '';
} for (var i = 0; i < 4 * tabsCount; i++) {
return newIndent + line.substring(tabsCount); newIndent += ' ';
}).join('\n'); }
return newIndent + line.substring(tabsCount);
})
.join('\n');
} }
/** /**
@ -503,7 +539,7 @@ function cleanFile(contents) {
* - append ThirdPartyNotices.txt from plugins * - append ThirdPartyNotices.txt from plugins
*/ */
function addPluginThirdPartyNotices() { function addPluginThirdPartyNotices() {
return es.through(function(data) { return es.through(function (data) {
if (!/ThirdPartyNotices\.txt$/.test(data.path)) { if (!/ThirdPartyNotices\.txt$/.test(data.path)) {
this.emit('data', data); this.emit('data', data);
return; return;
@ -511,7 +547,7 @@ function addPluginThirdPartyNotices() {
var contents = data.contents.toString(); var contents = data.contents.toString();
var extraContent = []; var extraContent = [];
metadata.METADATA.PLUGINS.forEach(function(plugin) { metadata.METADATA.PLUGINS.forEach(function (plugin) {
if (!plugin.thirdPartyNotices) { if (!plugin.thirdPartyNotices) {
return; return;
} }
@ -529,13 +565,13 @@ function addPluginThirdPartyNotices() {
}); });
} }
// --- website // --- website
const cleanWebsiteTask = function(cb) { rimraf('../monaco-editor-website', { maxBusyTries: 1 }, cb); }; const cleanWebsiteTask = function (cb) {
const buildWebsiteTask = taskSeries(cleanWebsiteTask, function() { rimraf('../monaco-editor-website', { maxBusyTries: 1 }, cb);
};
const buildWebsiteTask = taskSeries(cleanWebsiteTask, function () {
function replaceWithRelativeResource(dataPath, contents, regex, callback) { function replaceWithRelativeResource(dataPath, contents, regex, callback) {
return contents.replace(regex, function(_, m0) { return contents.replace(regex, function (_, m0) {
var filePath = path.join(path.dirname(dataPath), m0); var filePath = path.join(path.dirname(dataPath), m0);
return callback(m0, fs.readFileSync(filePath)); return callback(m0, fs.readFileSync(filePath));
}); });
@ -544,116 +580,149 @@ const buildWebsiteTask = taskSeries(cleanWebsiteTask, function() {
var waiting = 0; var waiting = 0;
var done = false; var done = false;
return ( return es
es.merge( .merge(
gulp.src([ gulp
'website/**/*' .src(['website/**/*'], { dot: true })
], { dot: true }) .pipe(
.pipe(es.through(function(data) { es.through(
if (!data.contents || !/\.(html)$/.test(data.path) || /new-samples/.test(data.path)) { function (data) {
return this.emit('data', data); if (!data.contents || !/\.(html)$/.test(data.path) || /new-samples/.test(data.path)) {
} return this.emit('data', data);
var contents = data.contents.toString();
contents = contents.replace(/\.\.\/release\/dev/g, 'node_modules/monaco-editor/min');
contents = contents.replace(/{{version}}/g, MONACO_EDITOR_VERSION);
contents = contents.replace(/{{year}}/g, new Date().getFullYear());
// Preload xhr contents
contents = replaceWithRelativeResource(data.path, contents, /<pre data-preload="([^"]+)".*/g, function(m0, fileContents) {
return (
'<pre data-preload="' + m0 + '" style="display:none">'
+ fileContents.toString('utf8')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
+ '</pre>'
);
});
// Inline fork.png
contents = replaceWithRelativeResource(data.path, contents, /src="(\.\/fork.png)"/g, function(m0, fileContents) {
return (
'src="data:image/png;base64,' + fileContents.toString('base64') + '"'
);
});
var allCSS = '';
var tmpcontents = replaceWithRelativeResource(data.path, contents, /<link data-inline="yes-please" href="([^"]+)".*/g, function(m0, fileContents) {
allCSS += fileContents.toString('utf8');
return '';
});
tmpcontents = tmpcontents.replace(/<script.*/g, '');
tmpcontents = tmpcontents.replace(/<link.*/g, '');
waiting++;
uncss(tmpcontents, {
raw: allCSS,
ignore: [/\.alert\b/, /\.alert-error\b/, /\.playground-page\b/]
}, function(err, output) {
waiting--;
if (!err) {
output = new CleanCSS().minify(output).styles;
var isFirst = true;
contents = contents.replace(/<link data-inline="yes-please" href="([^"]+)".*/g, function(_, m0) {
if (isFirst) {
isFirst = false;
return '<style>' + output + '</style>';
} }
return '';
});
}
// Inline javascript var contents = data.contents.toString();
contents = replaceWithRelativeResource(data.path, contents, /<script data-inline="yes-please" src="([^"]+)".*/g, function(m0, fileContents) { contents = contents.replace(/\.\.\/release\/dev/g, 'node_modules/monaco-editor/min');
return '<script>' + fileContents.toString('utf8') + '</script>'; contents = contents.replace(/{{version}}/g, MONACO_EDITOR_VERSION);
}); contents = contents.replace(/{{year}}/g, new Date().getFullYear());
data.contents = Buffer.from(contents.split(/\r\n|\r|\n/).join('\n')); // Preload xhr contents
this.emit('data', data); contents = replaceWithRelativeResource(
data.path,
contents,
/<pre data-preload="([^"]+)".*/g,
function (m0, fileContents) {
return (
'<pre data-preload="' +
m0 +
'" style="display:none">' +
fileContents
.toString('utf8')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;') +
'</pre>'
);
}
);
if (done && waiting === 0) { // Inline fork.png
this.emit('end'); contents = replaceWithRelativeResource(
} data.path,
}.bind(this)); contents,
/src="(\.\/fork.png)"/g,
function (m0, fileContents) {
return 'src="data:image/png;base64,' + fileContents.toString('base64') + '"';
}
);
}, function() { var allCSS = '';
done = true; var tmpcontents = replaceWithRelativeResource(
if (waiting === 0) { data.path,
this.emit('end'); contents,
} /<link data-inline="yes-please" href="([^"]+)".*/g,
})) function (m0, fileContents) {
.pipe(gulp.dest('../monaco-editor-website')) allCSS += fileContents.toString('utf8');
return '';
}
);
tmpcontents = tmpcontents.replace(/<script.*/g, '');
tmpcontents = tmpcontents.replace(/<link.*/g, '');
waiting++;
uncss(
tmpcontents,
{
raw: allCSS,
ignore: [/\.alert\b/, /\.alert-error\b/, /\.playground-page\b/]
},
function (err, output) {
waiting--;
if (!err) {
output = new CleanCSS().minify(output).styles;
var isFirst = true;
contents = contents.replace(
/<link data-inline="yes-please" href="([^"]+)".*/g,
function (_, m0) {
if (isFirst) {
isFirst = false;
return '<style>' + output + '</style>';
}
return '';
}
);
}
// Inline javascript
contents = replaceWithRelativeResource(
data.path,
contents,
/<script data-inline="yes-please" src="([^"]+)".*/g,
function (m0, fileContents) {
return '<script>' + fileContents.toString('utf8') + '</script>';
}
);
data.contents = Buffer.from(contents.split(/\r\n|\r|\n/).join('\n'));
this.emit('data', data);
if (done && waiting === 0) {
this.emit('end');
}
}.bind(this)
);
},
function () {
done = true;
if (waiting === 0) {
this.emit('end');
}
}
)
)
.pipe(gulp.dest('../monaco-editor-website'))
) )
.pipe(es.through(function(data) { .pipe(
this.emit('data', data); es.through(
}, function() { function (data) {
this.emit('data', data);
// temporarily create package.json so that npm install doesn't bark },
fs.writeFileSync('../monaco-editor-website/package.json', '{}'); function () {
fs.writeFileSync('../monaco-editor-website/.nojekyll', ''); // temporarily create package.json so that npm install doesn't bark
cp.execSync('npm install monaco-editor', { fs.writeFileSync('../monaco-editor-website/package.json', '{}');
cwd: path.join(__dirname, '../monaco-editor-website') fs.writeFileSync('../monaco-editor-website/.nojekyll', '');
}); cp.execSync('npm install monaco-editor', {
fs.unlinkSync('../monaco-editor-website/package.json'); cwd: path.join(__dirname, '../monaco-editor-website')
});
this.emit('end'); fs.unlinkSync('../monaco-editor-website/package.json');
}))
);
this.emit('end');
}
)
);
}); });
gulp.task('build-website', buildWebsiteTask); gulp.task('build-website', buildWebsiteTask);
gulp.task('prepare-website-branch', async function() { gulp.task('prepare-website-branch', async function () {
cp.execSync('git init', { cp.execSync('git init', {
cwd: path.join(__dirname, '../monaco-editor-website') cwd: path.join(__dirname, '../monaco-editor-website')
}); });
let remoteUrl = cp.execSync('git remote get-url origin') let remoteUrl = cp.execSync('git remote get-url origin');
let committerUserName = cp.execSync('git log --format=\'%an\' -1'); let committerUserName = cp.execSync("git log --format='%an' -1");
let committerEmail = cp.execSync('git log --format=\'%ae\' -1'); let committerEmail = cp.execSync("git log --format='%ae' -1");
cp.execSync(`git config user.name ${committerUserName}`, { cp.execSync(`git config user.name ${committerUserName}`, {
cwd: path.join(__dirname, '../monaco-editor-website') cwd: path.join(__dirname, '../monaco-editor-website')
@ -677,9 +746,9 @@ gulp.task('prepare-website-branch', async function() {
console.log('RUN monaco-editor-website>git push origin gh-pages --force'); console.log('RUN monaco-editor-website>git push origin gh-pages --force');
}); });
const generateTestSamplesTask = function() { const generateTestSamplesTask = function () {
var sampleNames = fs.readdirSync(path.join(__dirname, 'test/samples')); var sampleNames = fs.readdirSync(path.join(__dirname, 'test/samples'));
var samples = sampleNames.map(function(sampleName) { var samples = sampleNames.map(function (sampleName) {
var samplePath = path.join(__dirname, 'test/samples', sampleName); var samplePath = path.join(__dirname, 'test/samples', sampleName);
var sampleContent = fs.readFileSync(samplePath).toString(); var sampleContent = fs.readFileSync(samplePath).toString();
return { return {
@ -687,9 +756,13 @@ const generateTestSamplesTask = function() {
content: sampleContent content: sampleContent
}; };
}); });
var prefix = '//This is a generated file via gulp generate-test-samples\ndefine([], function() { return'; var prefix =
var suffix = '; });' '//This is a generated file via gulp generate-test-samples\ndefine([], function() { return';
fs.writeFileSync(path.join(__dirname, 'test/samples-all.generated.js'), prefix + JSON.stringify(samples, null, '\t') + suffix ); var suffix = '; });';
fs.writeFileSync(
path.join(__dirname, 'test/samples-all.generated.js'),
prefix + JSON.stringify(samples, null, '\t') + suffix
);
var PLAY_SAMPLES = require(path.join(WEBSITE_GENERATED_PATH, 'all.js')).PLAY_SAMPLES; var PLAY_SAMPLES = require(path.join(WEBSITE_GENERATED_PATH, 'all.js')).PLAY_SAMPLES;
var locations = []; var locations = [];
@ -745,13 +818,16 @@ const generateTestSamplesTask = function() {
'});', '});',
'</script>', '</script>',
'</body>', '</body>',
'</html>', '</html>'
]; ];
fs.writeFileSync(path.join(__dirname, 'test/playground.generated/' + sampleId + '.html'), result.join('\n')); fs.writeFileSync(
path.join(__dirname, 'test/playground.generated/' + sampleId + '.html'),
result.join('\n')
);
locations.push({ locations.push({
path: sampleId + '.html', path: sampleId + '.html',
name: sample.chapter + ' &gt; ' + sample.name name: sample.chapter + ' &gt; ' + sample.name
}) });
} }
var index = [ var index = [
@ -764,34 +840,47 @@ const generateTestSamplesTask = function() {
'<body>', '<body>',
'<a class="loading-opts" href="index.html">[&lt;&lt; BACK]</a><br/>', '<a class="loading-opts" href="index.html">[&lt;&lt; BACK]</a><br/>',
'THIS IS A GENERATED FILE VIA gulp generate-test-samples<br/><br/>', 'THIS IS A GENERATED FILE VIA gulp generate-test-samples<br/><br/>',
locations.map(function(location) { locations
return '<a class="loading-opts" href="playground.generated/' + location.path + '">' + location.name + '</a>'; .map(function (location) {
}).join('<br/>\n'), return (
'<a class="loading-opts" href="playground.generated/' +
location.path +
'">' +
location.name +
'</a>'
);
})
.join('<br/>\n'),
'<script src="../metadata.js"></script>', '<script src="../metadata.js"></script>',
'<script src="dev-setup.js"></script>', '<script src="dev-setup.js"></script>',
'</body>', '</body>',
'</html>', '</html>'
] ];
fs.writeFileSync(path.join(__dirname, 'test/playground.generated/index.html'), index.join('\n')); fs.writeFileSync(path.join(__dirname, 'test/playground.generated/index.html'), index.join('\n'));
}; };
function createSimpleServer(rootDir, port) { function createSimpleServer(rootDir, port) {
yaserver.createServer({ yaserver
rootDir: rootDir .createServer({
}).then((staticServer) => { rootDir: rootDir
const server = http.createServer((request, response) => { })
return staticServer.handle(request, response); .then((staticServer) => {
const server = http.createServer((request, response) => {
return staticServer.handle(request, response);
});
server.listen(port, '127.0.0.1', () => {
console.log(`Running at http://127.0.0.1:${port}`);
});
}); });
server.listen(port, '127.0.0.1', () => {
console.log(`Running at http://127.0.0.1:${port}`);
});
});
} }
gulp.task('generate-test-samples', taskSeries(generateTestSamplesTask)); gulp.task('generate-test-samples', taskSeries(generateTestSamplesTask));
gulp.task('simpleserver', taskSeries(generateTestSamplesTask, function() { gulp.task(
const SERVER_ROOT = path.normalize(path.join(__dirname, '../../')); 'simpleserver',
createSimpleServer(SERVER_ROOT, 8080); taskSeries(generateTestSamplesTask, function () {
createSimpleServer(SERVER_ROOT, 8088); const SERVER_ROOT = path.normalize(path.join(__dirname, '../../'));
})); createSimpleServer(SERVER_ROOT, 8080);
createSimpleServer(SERVER_ROOT, 8088);
})
);

18
monaco-editor/metadata.js
View file

@ -1,5 +1,4 @@
(function () { (function () {
var METADATA = { var METADATA = {
CORE: { CORE: {
paths: { paths: {
@ -8,7 +7,7 @@
'npm/min': 'node_modules/monaco-editor-core/min/vs', 'npm/min': 'node_modules/monaco-editor-core/min/vs',
built: '/vscode/out-monaco-editor-core/min/vs', built: '/vscode/out-monaco-editor-core/min/vs',
releaseDev: 'release/dev/vs', releaseDev: 'release/dev/vs',
releaseMin: 'release/min/vs', releaseMin: 'release/min/vs'
} }
}, },
PLUGINS: [ PLUGINS: [
@ -22,7 +21,7 @@
src: './monaco-typescript/release/dev', src: './monaco-typescript/release/dev',
'npm/dev': 'node_modules/monaco-typescript/release/dev', 'npm/dev': 'node_modules/monaco-typescript/release/dev',
'npm/min': 'node_modules/monaco-typescript/release/min', 'npm/min': 'node_modules/monaco-typescript/release/min',
esm: 'node_modules/monaco-typescript/release/esm', esm: 'node_modules/monaco-typescript/release/esm'
} }
}, },
{ {
@ -34,7 +33,7 @@
src: './monaco-css/release/dev', src: './monaco-css/release/dev',
'npm/dev': 'node_modules/monaco-css/release/dev', 'npm/dev': 'node_modules/monaco-css/release/dev',
'npm/min': 'node_modules/monaco-css/release/min', 'npm/min': 'node_modules/monaco-css/release/min',
esm: 'node_modules/monaco-css/release/esm', esm: 'node_modules/monaco-css/release/esm'
} }
}, },
{ {
@ -46,7 +45,7 @@
src: './monaco-json/release/dev', src: './monaco-json/release/dev',
'npm/dev': 'node_modules/monaco-json/release/dev', 'npm/dev': 'node_modules/monaco-json/release/dev',
'npm/min': 'node_modules/monaco-json/release/min', 'npm/min': 'node_modules/monaco-json/release/min',
esm: 'node_modules/monaco-json/release/esm', esm: 'node_modules/monaco-json/release/esm'
} }
}, },
{ {
@ -59,7 +58,7 @@
src: './monaco-html/release/dev', src: './monaco-html/release/dev',
'npm/dev': 'node_modules/monaco-html/release/dev', 'npm/dev': 'node_modules/monaco-html/release/dev',
'npm/min': 'node_modules/monaco-html/release/min', 'npm/min': 'node_modules/monaco-html/release/min',
esm: 'node_modules/monaco-html/release/esm', esm: 'node_modules/monaco-html/release/esm'
} }
}, },
{ {
@ -72,16 +71,15 @@
src: './monaco-languages/release/dev', src: './monaco-languages/release/dev',
'npm/dev': 'node_modules/monaco-languages/release/dev', 'npm/dev': 'node_modules/monaco-languages/release/dev',
'npm/min': 'node_modules/monaco-languages/release/min', 'npm/min': 'node_modules/monaco-languages/release/min',
esm: 'node_modules/monaco-languages/release/esm', esm: 'node_modules/monaco-languages/release/esm'
} }
} }
] ]
} };
if (typeof exports !== 'undefined') { if (typeof exports !== 'undefined') {
exports.METADATA = METADATA exports.METADATA = METADATA;
} else { } else {
self.METADATA = METADATA; self.METADATA = METADATA;
} }
})(); })();

58
monaco-editor/test/2040/iframe.html
View file

@ -1,35 +1,35 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style> <style>
html, html,
body { body {
height: 100%; height: 100%;
} }
body { body {
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
} }
#container { #container {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
} }
.dev-setup-control { .dev-setup-control {
display: none; display: none;
} }
</style> </style>
</head> </head>
<body> <body>
<div id="container"></div> <div id="container"></div>
<script src="../../metadata.js"></script> <script src="../../metadata.js"></script>
<script src="../dev-setup.js"></script> <script src="../dev-setup.js"></script>
<script src="iframe.js"></script> <script src="iframe.js"></script>
</body> </body>
</html> </html>

32
monaco-editor/test/2040/iframe.js
View file

@ -1,22 +1,22 @@
const init = () => { const init = () => {
loadEditor(function() { loadEditor(function () {
// create the editor // create the editor
const target = document.getElementById('container'); const target = document.getElementById('container');
const editor = monaco.editor.create(target, { language: 'html' }); const editor = monaco.editor.create(target, { language: 'html' });
// load some sample data // load some sample data
(async () => { (async () => {
const response = await fetch('https://microsoft.github.io/monaco-editor/'); const response = await fetch('https://microsoft.github.io/monaco-editor/');
const html = await response.text(); const html = await response.text();
editor.getModel().setValue(html); editor.getModel().setValue(html);
})(); })();
}); });
}; };
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
if (!window.innerWidth || !window.innerHeight) { if (!window.innerWidth || !window.innerHeight) {
window.addEventListener('resize', init, { once: true }); window.addEventListener('resize', init, { once: true });
} else { } else {
init(); init();
} }
}); });

74
monaco-editor/test/2040/index.html
View file

@ -1,42 +1,42 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<script type="module"> <script type="module">
class MonacoEditorElement extends HTMLElement { class MonacoEditorElement extends HTMLElement {
constructor() { constructor() {
super(); super();
this.style = 'display: block;'; this.style = 'display: block;';
const shadow = this.attachShadow({ mode: 'open' }); const shadow = this.attachShadow({ mode: 'open' });
const iframe = document.createElement('iframe'); const iframe = document.createElement('iframe');
iframe.src = new URL('iframe.html?editor=src', import.meta.url).href; iframe.src = new URL('iframe.html?editor=src', import.meta.url).href;
iframe.style = `width: 100%; height: 100%;`; iframe.style = `width: 100%; height: 100%;`;
shadow.appendChild(iframe); shadow.appendChild(iframe);
} }
} }
customElements.define('monaco-editor', MonacoEditorElement); customElements.define('monaco-editor', MonacoEditorElement);
</script> </script>
<style> <style>
section { section {
margin: 80px; margin: 80px;
} }
iframe, iframe,
monaco-editor { monaco-editor {
width: 640px; width: 640px;
height: 400px; height: 400px;
} }
</style> </style>
</head> </head>
<body> <body>
<section> <section>
<h1>Monaco in a shadowRoot + iframe context</h1> <h1>Monaco in a shadowRoot + iframe context</h1>
<monaco-editor></monaco-editor> <monaco-editor></monaco-editor>
</section> </section>
<hr> <hr />
<section> <section>
<h1>Monaco in an iframe context</h1> <h1>Monaco in an iframe context</h1>
<iframe src="iframe.html?editor=src"></iframe> <iframe src="iframe.html?editor=src"></iframe>
</section> </section>
</body> </body>
</html> </html>

101
monaco-editor/test/2096/index.html
View file

@ -1,29 +1,29 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>Editor in tiny iframe</title> <title>Editor in tiny iframe</title>
<style> <style>
#myIframe { #myIframe {
border: 1px solid pink; border: 1px solid pink;
} }
</style> </style>
</head> </head>
<body> <body>
<h2>Monaco Editor inside iframes sample</h2> <h2>Monaco Editor inside iframes sample</h2>
<br /> <br />
<br /> <br />
<iframe id="myIframe"></iframe> <iframe id="myIframe"></iframe>
<br /> <br />
<script> <script>
var myIframe = document.getElementById("myIframe"); var myIframe = document.getElementById('myIframe');
myIframe.style.width = "400px"; myIframe.style.width = '400px';
myIframe.style.height = "100px"; myIframe.style.height = '100px';
myIframe.style.display = "block"; myIframe.style.display = 'block';
myIframe.style.visibility = "visible"; myIframe.style.visibility = 'visible';
const longText = `function x() {\n\tconsole.log("Hello world!");\n}function x() const longText = `function x() {\n\tconsole.log("Hello world!");\n}function x()
{\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x()
{\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x()
{\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x()
@ -34,37 +34,34 @@
{\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x()
{\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x() {\n\tconsole.log("Hello world!");\n}function x()
{\n\tconsole.log("Hello world!");\n}`; {\n\tconsole.log("Hello world!");\n}`;
const iframeDoc = myIframe.contentDocument; const iframeDoc = myIframe.contentDocument;
const iframeWin = myIframe.contentWindow; const iframeWin = myIframe.contentWindow;
const injectSourceFiles = function () { const injectSourceFiles = function () {
iframeWin.require.config({ iframeWin.require.config({
paths: { paths: {
vs: "/vscode/out/vs", vs: '/vscode/out/vs'
}, }
}); });
iframeWin.require(["vs/editor/editor.main"], function () { iframeWin.require(['vs/editor/editor.main'], function () {
const container = iframeDoc.createElement("div"); const container = iframeDoc.createElement('div');
container.setAttribute("id", "container"); container.setAttribute('id', 'container');
container.style.height = "100vh"; container.style.height = '100vh';
iframeDoc.body.appendChild(container); iframeDoc.body.appendChild(container);
var editor = iframeWin.monaco.editor.create( var editor = iframeWin.monaco.editor.create(iframeDoc.getElementById('container'), {
iframeDoc.getElementById("container"), value: longText,
{ language: 'javascript'
value: longText, });
language: "javascript",
}
);
iframeWin.onresize = function () { iframeWin.onresize = function () {
editor.layout(); editor.layout();
}; };
}); });
}; };
const script = iframeDoc.createElement("script"); const script = iframeDoc.createElement('script');
script.src = "/vscode/out/vs/loader.js"; script.src = '/vscode/out/vs/loader.js';
script.onload = injectSourceFiles; script.onload = injectSourceFiles;
iframeDoc.head.appendChild(script); iframeDoc.head.appendChild(script);
</script> </script>
</body> </body>
</html> </html>

58
monaco-editor/test/2264/iframe.html
View file

@ -1,35 +1,35 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style> <style>
html, html,
body { body {
height: 100%; height: 100%;
} }
body { body {
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
} }
#container { #container {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
bottom: 0; bottom: 0;
right: 0; right: 0;
} }
.dev-setup-control { .dev-setup-control {
display: none; display: none;
} }
</style> </style>
</head> </head>
<body> <body>
<div id="container"></div> <div id="container"></div>
<script src="../../metadata.js"></script> <script src="../../metadata.js"></script>
<script src="../dev-setup.js"></script> <script src="../dev-setup.js"></script>
<script src="iframe.js"></script> <script src="iframe.js"></script>
</body> </body>
</html> </html>

32
monaco-editor/test/2264/iframe.js
View file

@ -1,22 +1,22 @@
const init = () => { const init = () => {
loadEditor(function() { loadEditor(function () {
// create the editor // create the editor
const target = document.getElementById('container'); const target = document.getElementById('container');
const editor = monaco.editor.create(target, { language: 'html' }); const editor = monaco.editor.create(target, { language: 'html' });
// load some sample data // load some sample data
(async () => { (async () => {
const response = await fetch('https://microsoft.github.io/monaco-editor/'); const response = await fetch('https://microsoft.github.io/monaco-editor/');
const html = await response.text(); const html = await response.text();
editor.getModel().setValue(html); editor.getModel().setValue(html);
})(); })();
}); });
}; };
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
if (!window.innerWidth || !window.innerHeight) { if (!window.innerWidth || !window.innerHeight) {
window.addEventListener('resize', init, { once: true }); window.addEventListener('resize', init, { once: true });
} else { } else {
init(); init();
} }
}); });

13
monaco-editor/test/2264/index.html
View file

@ -1,8 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head> </head>
</head> <body>
<body> <iframe
<iframe src="http://localhost:8088/monaco-editor/test/2264/iframe.html?editor=src" style="width:800px;height:600px;" sandbox="allow-same-origin allow-scripts allow-popups allow-modals allow-forms allow-downloads"></iframe> src="http://localhost:8088/monaco-editor/test/2264/iframe.html?editor=src"
</body> style="width: 800px; height: 600px"
sandbox="allow-same-origin allow-scripts allow-popups allow-modals allow-forms allow-downloads"
></iframe>
</body>
</html> </html>

32
monaco-editor/test/colorize.html
View file

@ -1,13 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<h2>Colorize example</h2>
<h2>Colorize example</h2> <pre id="code" data-lang="text/css" style="width: 500px">
<pre id="code" data-lang="text/css" style="width:500px;">
/* Some example CSS */ /* Some example CSS */
@import url("something.css"); @import url("something.css");
@ -41,14 +40,15 @@ code {
font-size: 80%; font-size: 80%;
color: #418A8A; color: #418A8A;
} }
</pre> </pre
>
<script src="../metadata.js"></script> <script src="../metadata.js"></script>
<script src="dev-setup.js"></script> <script src="dev-setup.js"></script>
<script> <script>
loadEditor(function() { loadEditor(function () {
monaco.editor.colorizeElement(document.getElementById('code')); monaco.editor.colorizeElement(document.getElementById('code'));
}); });
</script> </script>
</body> </body>
</html> </html>

43
monaco-editor/test/cross-origin-broken.html
View file

@ -1,26 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<h2>Monaco Editor wrong cross origin</h2>
<h2>Monaco Editor wrong cross origin</h2> <div style="clear: both"></div>
<div
id="container"
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
></div>
<div style="clear: both"></div>
<div style="clear:both"></div> <script src="../metadata.js"></script>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> <script src="dev-setup.js"></script>
<div style="clear:both"></div> <script>
loadEditor(function () {
<script src="../metadata.js"></script> monaco.editor.create(document.getElementById('container'), {
<script src="dev-setup.js"></script> value: document.documentElement.innerHTML,
<script> language: 'css'
loadEditor(function() { });
monaco.editor.create(document.getElementById('container'), { }, 'http://localhost:8088');
value: document.documentElement.innerHTML, </script>
language: 'css' </body>
});
}, 'http://localhost:8088');
</script>
</body>
</html> </html>

57
monaco-editor/test/cross-origin-good.html
View file

@ -1,33 +1,34 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<h2>Monaco Editor cross origin correct</h2>
<h2>Monaco Editor cross origin correct</h2> <div style="clear: both"></div>
<div
id="container"
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
></div>
<div style="clear: both"></div>
<div style="clear:both"></div> <script src="../metadata.js"></script>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> <script src="dev-setup.js"></script>
<div style="clear:both"></div> <script>
window.MonacoEnvironment = {
<script src="../metadata.js"></script> getWorkerUrl: function () {
<script src="dev-setup.js"></script> return 'cross-origin-worker-proxy.js#http://localhost:8088' + RESOLVED_CORE_PATH;
<script> }
window.MonacoEnvironment = { };
getWorkerUrl: function() { </script>
return 'cross-origin-worker-proxy.js#http://localhost:8088' + RESOLVED_CORE_PATH; <script>
} loadEditor(function () {
}; monaco.editor.create(document.getElementById('container'), {
</script> value: document.documentElement.innerHTML,
<script> language: 'css'
loadEditor(function() { });
monaco.editor.create(document.getElementById('container'), { }, 'http://localhost:8088');
value: document.documentElement.innerHTML, </script>
language: 'css' </body>
});
}, 'http://localhost:8088');
</script>
</body>
</html> </html>

131
monaco-editor/test/dev-setup.js
View file

@ -1,13 +1,17 @@
(function() { (function () {
let IS_FILE_PROTOCOL = window.location.protocol === 'file:';
let IS_FILE_PROTOCOL = (window.location.protocol === 'file:');
let DIRNAME = null; let DIRNAME = null;
if (IS_FILE_PROTOCOL) { if (IS_FILE_PROTOCOL) {
let port = window.location.port; let port = window.location.port;
if (port.length > 0) { if (port.length > 0) {
port = ':' + port; port = ':' + port;
} }
DIRNAME = window.location.protocol + '//' + window.location.hostname + port + window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/')); DIRNAME =
window.location.protocol +
'//' +
window.location.hostname +
port +
window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/'));
let bases = document.getElementsByTagName('base'); let bases = document.getElementsByTagName('base');
if (bases.length > 0) { if (bases.length > 0) {
@ -15,14 +19,13 @@
} }
} }
let LOADER_OPTS = (function () {
let LOADER_OPTS = (function() {
function parseQueryString() { function parseQueryString() {
let str = window.location.search; let str = window.location.search;
str = str.replace(/^\?/, ''); str = str.replace(/^\?/, '');
let pieces = str.split(/&/); let pieces = str.split(/&/);
let result = {}; let result = {};
pieces.forEach(function(piece) { pieces.forEach(function (piece) {
let config = piece.split(/=/); let config = piece.split(/=/);
result[config[0]] = config[1]; result[config[0]] = config[1];
}); });
@ -31,7 +34,7 @@
let overwrites = parseQueryString(); let overwrites = parseQueryString();
let result = {}; let result = {};
result['editor'] = overwrites['editor'] || 'npm/dev'; result['editor'] = overwrites['editor'] || 'npm/dev';
METADATA.PLUGINS.map(function(plugin) { METADATA.PLUGINS.map(function (plugin) {
result[plugin.name] = overwrites[plugin.name] || 'npm/dev'; result[plugin.name] = overwrites[plugin.name] || 'npm/dev';
}); });
return result; return result;
@ -41,10 +44,17 @@
if (port.length > 0) { if (port.length > 0) {
port = ':' + port; port = ':' + port;
} }
return window.location.protocol + '//' + window.location.hostname + port + window.location.pathname + search + window.location.hash; return (
window.location.protocol +
'//' +
window.location.hostname +
port +
window.location.pathname +
search +
window.location.hash
);
} }
function Component(name, modulePrefix, paths, contrib) { function Component(name, modulePrefix, paths, contrib) {
this.name = name; this.name = name;
this.modulePrefix = modulePrefix; this.modulePrefix = modulePrefix;
@ -52,10 +62,10 @@
this.contrib = contrib; this.contrib = contrib;
this.selectedPath = LOADER_OPTS[name]; this.selectedPath = LOADER_OPTS[name];
} }
Component.prototype.isRelease = function() { Component.prototype.isRelease = function () {
return /release/.test(this.selectedPath); return /release/.test(this.selectedPath);
}; };
Component.prototype.getResolvedPath = function(PATH_PREFIX) { Component.prototype.getResolvedPath = function (PATH_PREFIX) {
let resolvedPath = this.paths[this.selectedPath]; let resolvedPath = this.paths[this.selectedPath];
if (/\.\//.test(resolvedPath)) { if (/\.\//.test(resolvedPath)) {
// starts with ./ => treat as relative to repo root // starts with ./ => treat as relative to repo root
@ -64,7 +74,11 @@
} else { } else {
resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath; resolvedPath = PATH_PREFIX + '/monaco-editor/' + resolvedPath;
} }
} else if (this.selectedPath === 'npm/dev' || this.selectedPath === 'npm/min' || this.isRelease()) { } else if (
this.selectedPath === 'npm/dev' ||
this.selectedPath === 'npm/min' ||
this.isRelease()
) {
if (IS_FILE_PROTOCOL) { if (IS_FILE_PROTOCOL) {
resolvedPath = DIRNAME + '/../' + resolvedPath; resolvedPath = DIRNAME + '/../' + resolvedPath;
} else { } else {
@ -79,46 +93,58 @@
} }
return resolvedPath; return resolvedPath;
}; };
Component.prototype.generateLoaderConfig = function(dest, PATH_PREFIX) { Component.prototype.generateLoaderConfig = function (dest, PATH_PREFIX) {
dest[this.modulePrefix] = this.getResolvedPath(PATH_PREFIX); dest[this.modulePrefix] = this.getResolvedPath(PATH_PREFIX);
}; };
Component.prototype.generateUrlForPath = function(pathName) { Component.prototype.generateUrlForPath = function (pathName) {
let NEW_LOADER_OPTS = {}; let NEW_LOADER_OPTS = {};
Object.keys(LOADER_OPTS).forEach(function(key) { Object.keys(LOADER_OPTS).forEach(function (key) {
NEW_LOADER_OPTS[key] = (LOADER_OPTS[key] === 'npm/dev' ? undefined : LOADER_OPTS[key]); NEW_LOADER_OPTS[key] = LOADER_OPTS[key] === 'npm/dev' ? undefined : LOADER_OPTS[key];
}); });
NEW_LOADER_OPTS[this.name] = (pathName === 'npm/dev' ? undefined : pathName); NEW_LOADER_OPTS[this.name] = pathName === 'npm/dev' ? undefined : pathName;
let search = Object.keys(NEW_LOADER_OPTS).map(function(key) { let search = Object.keys(NEW_LOADER_OPTS)
let value = NEW_LOADER_OPTS[key]; .map(function (key) {
if (value) { let value = NEW_LOADER_OPTS[key];
return key + '=' + value; if (value) {
} return key + '=' + value;
return ''; }
}).filter(function(assignment) { return !!assignment; }).join('&amp;'); return '';
})
.filter(function (assignment) {
return !!assignment;
})
.join('&amp;');
if (search.length > 0) { if (search.length > 0) {
search = '?' + search; search = '?' + search;
} }
return toHREF(search); return toHREF(search);
}; };
Component.prototype.renderLoadingOptions = function() { Component.prototype.renderLoadingOptions = function () {
return '<strong style="width:130px;display:inline-block;">' + this.name + '</strong>:&#160;&#160;&#160;' + Object.keys(this.paths).map(function(pathName) { return (
if (pathName === this.selectedPath) { '<strong style="width:130px;display:inline-block;">' +
return '<strong>' + pathName + '</strong>'; this.name +
} '</strong>:&#160;&#160;&#160;' +
return '<a href="' + this.generateUrlForPath(pathName) + '">' + pathName + '</a>'; Object.keys(this.paths)
}.bind(this)).join('&#160;&#160;&#160;'); .map(
function (pathName) {
if (pathName === this.selectedPath) {
return '<strong>' + pathName + '</strong>';
}
return '<a href="' + this.generateUrlForPath(pathName) + '">' + pathName + '</a>';
}.bind(this)
)
.join('&#160;&#160;&#160;')
);
}; };
let RESOLVED_CORE = new Component('editor', 'vs', METADATA.CORE.paths); let RESOLVED_CORE = new Component('editor', 'vs', METADATA.CORE.paths);
self.RESOLVED_CORE_PATH = RESOLVED_CORE.getResolvedPath(''); self.RESOLVED_CORE_PATH = RESOLVED_CORE.getResolvedPath('');
let RESOLVED_PLUGINS = METADATA.PLUGINS.map(function(plugin) { let RESOLVED_PLUGINS = METADATA.PLUGINS.map(function (plugin) {
return new Component(plugin.name, plugin.modulePrefix, plugin.paths, plugin.contrib); return new Component(plugin.name, plugin.modulePrefix, plugin.paths, plugin.contrib);
}); });
METADATA = null; METADATA = null;
function loadScript(path, callback) { function loadScript(path, callback) {
let script = document.createElement('script'); let script = document.createElement('script');
script.onload = callback; script.onload = callback;
@ -128,15 +154,14 @@
document.head.appendChild(script); document.head.appendChild(script);
} }
(function () {
(function() {
let allComponents = [RESOLVED_CORE]; let allComponents = [RESOLVED_CORE];
if (!RESOLVED_CORE.isRelease()) { if (!RESOLVED_CORE.isRelease()) {
allComponents = allComponents.concat(RESOLVED_PLUGINS); allComponents = allComponents.concat(RESOLVED_PLUGINS);
} }
let div = document.createElement('div'); let div = document.createElement('div');
div.className = 'dev-setup-control' div.className = 'dev-setup-control';
div.style.position = 'fixed'; div.style.position = 'fixed';
div.style.top = 0; div.style.top = 0;
div.style.right = 0; div.style.right = 0;
@ -144,7 +169,14 @@
div.style.padding = '5px 20px 5px 5px'; div.style.padding = '5px 20px 5px 5px';
div.style.zIndex = '1000'; div.style.zIndex = '1000';
div.innerHTML = '<ul><li>' + allComponents.map(function(component) { return component.renderLoadingOptions(); }).join('</li><li>') + '</li></ul>'; div.innerHTML =
'<ul><li>' +
allComponents
.map(function (component) {
return component.renderLoadingOptions();
})
.join('</li><li>') +
'</li></ul>';
document.body.appendChild(div); document.body.appendChild(div);
@ -152,25 +184,24 @@
for (let i = 0; i < aElements.length; i++) { for (let i = 0; i < aElements.length; i++) {
let aElement = aElements[i]; let aElement = aElements[i];
if (aElement.className === 'loading-opts') { if (aElement.className === 'loading-opts') {
aElement.href += window.location.search aElement.href += window.location.search;
} }
} }
})(); })();
self.getCodiconPath = function(PATH_PREFIX) { self.getCodiconPath = function (PATH_PREFIX) {
PATH_PREFIX = PATH_PREFIX || ''; PATH_PREFIX = PATH_PREFIX || '';
const result = RESOLVED_CORE.getResolvedPath(PATH_PREFIX); const result = RESOLVED_CORE.getResolvedPath(PATH_PREFIX);
return result + '/base/browser/ui/codicons/codicon/codicon.ttf'; return result + '/base/browser/ui/codicons/codicon/codicon.ttf';
}; };
self.loadEditor = function (callback, PATH_PREFIX) {
self.loadEditor = function(callback, PATH_PREFIX) {
PATH_PREFIX = PATH_PREFIX || ''; PATH_PREFIX = PATH_PREFIX || '';
loadScript(RESOLVED_CORE.getResolvedPath(PATH_PREFIX) + '/loader.js', function() { loadScript(RESOLVED_CORE.getResolvedPath(PATH_PREFIX) + '/loader.js', function () {
let loaderPathsConfig = {}; let loaderPathsConfig = {};
if (!RESOLVED_CORE.isRelease()) { if (!RESOLVED_CORE.isRelease()) {
RESOLVED_PLUGINS.forEach(function(plugin) { RESOLVED_PLUGINS.forEach(function (plugin) {
plugin.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX); plugin.generateLoaderConfig(loaderPathsConfig, PATH_PREFIX);
}); });
} }
@ -180,7 +211,7 @@
console.log(JSON.stringify(loaderPathsConfig, null, '\t')); console.log(JSON.stringify(loaderPathsConfig, null, '\t'));
require.config({ require.config({
paths: loaderPathsConfig, paths: loaderPathsConfig
// 'vs/nls' : { // 'vs/nls' : {
// availableLanguages: { // availableLanguages: {
// '*': 'de' // '*': 'de'
@ -188,10 +219,12 @@
// } // }
}); });
require(['vs/editor/editor.main'], function() { require(['vs/editor/editor.main'], function () {
if (!RESOLVED_CORE.isRelease()) { if (!RESOLVED_CORE.isRelease()) {
// At this point we've loaded the monaco-editor-core // At this point we've loaded the monaco-editor-core
require(RESOLVED_PLUGINS.map(function(plugin) { return plugin.contrib; }), function() { require(RESOLVED_PLUGINS.map(function (plugin) {
return plugin.contrib;
}), function () {
// At this point we've loaded all the plugins // At this point we've loaded all the plugins
callback(); callback();
}); });
@ -200,5 +233,5 @@
} }
}); });
}); });
} };
})(); })();

32
monaco-editor/test/diff.html
View file

@ -1,19 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<div
id="container"
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
></div>
<div style="clear: both"></div>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> <script src="../metadata.js"></script>
<div style="clear:both"></div> <script src="dev-setup.js"></script>
<script>
<script src="../metadata.js"></script> loadEditor(function () {
<script src="dev-setup.js"></script> require(['./diff'], function () {});
<script> });
loadEditor(function() { </script>
require(['./diff'], function() {}); </body>
});
</script>
</body>
</html> </html>

17
monaco-editor/test/diff.js
View file

@ -1,19 +1,16 @@
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" /> /// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
define(['require'], function (require) { define(['require'], function (require) {
var container = document.getElementById('container'); var container = document.getElementById('container');
var original = monaco.editor.createModel(getOriginalStr(), 'javascript'); var original = monaco.editor.createModel(getOriginalStr(), 'javascript');
var modified = monaco.editor.createModel(getModifiedStr(), 'javascript'); var modified = monaco.editor.createModel(getModifiedStr(), 'javascript');
var diffEditor = monaco.editor.createDiffEditor(container, { var diffEditor = monaco.editor.createDiffEditor(container, {});
});
diffEditor.setModel({ diffEditor.setModel({
original: original, original: original,
modified: modified modified: modified
}); });
}); });
function getOriginalStr() { function getOriginalStr() {
@ -40,8 +37,8 @@ function getOriginalStr() {
' var key = keys[i];', ' var key = keys[i];',
' var enumerable = key.charCodeAt(0) !== /*_*/95;', ' var enumerable = key.charCodeAt(0) !== /*_*/95;',
' var member = members[key];', ' var member = members[key];',
' if (member && typeof member === \'object\') {', " if (member && typeof member === 'object') {",
' if (member.value !== undefined || typeof member.get === \'function\' || typeof member.set === \'function\') {', " if (member.value !== undefined || typeof member.get === 'function' || typeof member.set === 'function') {",
' if (member.enumerable === undefined) {', ' if (member.enumerable === undefined) {',
' member.enumerable = enumerable;', ' member.enumerable = enumerable;',
' }', ' }',
@ -263,8 +260,8 @@ function getModifiedStr() {
' var key = keys[i];', ' var key = keys[i];',
' var enumerable = key.charCodeAt(0) !== /*_*/95;', ' var enumerable = key.charCodeAt(0) !== /*_*/95;',
' var member = members[key];', ' var member = members[key];',
' if (member && typeof member === \'object\') {', " if (member && typeof member === 'object') {",
' if (member.value !== undefined || typeof member.get === \'function\' || typeof member.set === \'function\') {', " if (member.value !== undefined || typeof member.get === 'function' || typeof member.set === 'function') {",
' if (member.enumerable === undefined) {', ' if (member.enumerable === undefined) {',
' member.enumerable = enumerable;', ' member.enumerable = enumerable;',
' }', ' }',
@ -449,6 +446,6 @@ function getModifiedStr() {
'', '',
' })(WinJS);', ' })(WinJS);',
'', '',
'})(this);', '})(this);'
].join('\n'); ].join('\n');
} }

85
monaco-editor/test/index.html
View file

@ -1,45 +1,50 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" href="./index.css" /> <link rel="stylesheet" href="./index.css" />
</head> </head>
<body> <body>
Jump to:
<a class="loading-opts" href="./smoketest.html">[SMOKETEST]</a>
&#160;|&#160;
<a class="loading-opts" href="./playground.generated/index.html">[PLAYGROUND]</a>
&#160;|&#160;
<a class="loading-opts" href="./mouse-fixed.html">[fixed element]</a>
&#160;|&#160;
<a class="loading-opts" href="./mouse-scrollable-body.html">[scrollable body]</a>
&#160;|&#160;
<a class="loading-opts" href="./mouse-scrollable-element.html">[scrollable element]</a><br />
&#160;|&#160;
<a class="loading-opts" href="./shadow-dom.html">[Shadow DOM]</a>
&#160;|&#160;
<a class="loading-opts" href="./colorize.html">[colorize element]</a>
&#160;|&#160;
<a class="loading-opts" href="./cross-origin-broken.html">[cross origin broken]</a>
&#160;|&#160;
<a class="loading-opts" href="./cross-origin-good.html">[cross origin good]</a>
&#160;|&#160;
<a class="loading-opts" href="./diff.html">[diff]</a>
<br /><br />
Jump to: <div id="bar" style="margin-bottom: 6px"></div>
<a class="loading-opts" href="./smoketest.html">[SMOKETEST]</a> <div style="clear: both"></div>
&#160;|&#160; <div
<a class="loading-opts" href="./playground.generated/index.html">[PLAYGROUND]</a> id="container"
&#160;|&#160; style="float: left; width: 800px; height: 450px; border: 1px solid grey"
<a class="loading-opts" href="./mouse-fixed.html">[fixed element]</a> ></div>
&#160;|&#160; <div
<a class="loading-opts" href="./mouse-scrollable-body.html">[scrollable body]</a> id="options"
&#160;|&#160; style="float: left; width: 220px; height: 450px; border: 1px solid grey"
<a class="loading-opts" href="./mouse-scrollable-element.html">[scrollable element]</a><br/> ></div>
&#160;|&#160; <div style="clear: both"></div>
<a class="loading-opts" href="./shadow-dom.html">[Shadow DOM]</a>
&#160;|&#160;
<a class="loading-opts" href="./colorize.html">[colorize element]</a>
&#160;|&#160;
<a class="loading-opts" href="./cross-origin-broken.html">[cross origin broken]</a>
&#160;|&#160;
<a class="loading-opts" href="./cross-origin-good.html">[cross origin good]</a>
&#160;|&#160;
<a class="loading-opts" href="./diff.html">[diff]</a>
<br/><br/>
<div id="bar" style="margin-bottom: 6px;"></div> <script src="../metadata.js"></script>
<div style="clear:both"></div> <script src="dev-setup.js"></script>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> <script>
<div id="options" style="float:left;width:220px;height:450px;border: 1px solid grey"></div> loadEditor(function () {
<div style="clear:both"></div> require(['./index'], function () {});
});
<script src="../metadata.js"></script> </script>
<script src="dev-setup.js"></script> </body>
<script>
loadEditor(function() {
require(['./index'], function() {});
});
</script>
</body>
</html> </html>

794
monaco-editor/test/index.js
View file

@ -1,396 +1,428 @@
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" /> /// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
/// <reference path="../node_modules/monaco-typescript/monaco.d.ts" /> /// <reference path="../../monaco-typescript/monaco.d.ts" />
define(['require', './samples'], function(require, SAMPLES) { define(['require', './samples'], function (require, SAMPLES) {
var domutils = require('vs/base/browser/dom');
var domutils = require('vs/base/browser/dom'); var model = monaco.editor.createModel('', 'plaintext');
var model = monaco.editor.createModel('', 'plaintext'); monaco.languages.typescript.typescriptDefaults.setInlayHintsOptions({
includeInlayParameterNameHints: 'all',
monaco.languages.typescript.typescriptDefaults.setInlayHintsOptions({ includeInlayParameterNameHintsWhenArgumentMatchesName: true,
includeInlayParameterNameHints: 'all', includeInlayFunctionParameterTypeHints: true,
includeInlayParameterNameHintsWhenArgumentMatchesName: true, includeInlayVariableTypeHints: true,
includeInlayFunctionParameterTypeHints: true, includeInlayPropertyDeclarationTypeHints: true,
includeInlayVariableTypeHints: true, includeInlayFunctionLikeReturnTypeHints: true,
includeInlayPropertyDeclarationTypeHints: true, includeInlayEnumMemberValueHints: true
includeInlayFunctionLikeReturnTypeHints: true,
includeInlayEnumMemberValueHints: true
});
var editor = monaco.editor.create(document.getElementById('container'), {
model: model,
glyphMargin: true,
renderWhitespace: true
});
editor.addCommand({
ctrlCmd: true,
key: 'F9'
}, function(ctx, args) {
alert('Command Running!!');
console.log(ctx);
});
editor.addAction({
id: 'my-unique-id',
label: 'My Label!!!',
keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.F10],
contextMenuGroupId: 'navigation',
contextMenuOrder: 2.5,
run: function(ed) {
console.log("i'm running => " + ed.getPosition());
}
});
var currentSamplePromise = null;
var samplesData = {};
SAMPLES.sort(function(a,b) {
return a.name.localeCompare(b.name);
}).forEach(function(sample) {
samplesData[sample.name] = function() {
if (currentSamplePromise !== null) {
currentSamplePromise.cancel();
currentSamplePromise = null;
}
currentSamplePromise = sample.loadText().then(function(modelText) {
currentSamplePromise = null;
updateEditor(sample.mimeType, modelText, sample.name);
});
}
});
var examplesComboBox = new ComboBox('Template', samplesData);
var modesData = {};
monaco.languages.getLanguages().forEach(function(language) {
modesData[language.id] = updateEditor.bind(this, language.id);
});
var modesComboBox = new ComboBox('Mode', modesData);
var themesData = {};
themesData['vs'] = function() { monaco.editor.setTheme('vs') };
themesData['vs-dark'] = function() { monaco.editor.setTheme('vs-dark') };
themesData['hc-black'] = function() { monaco.editor.setTheme('hc-black') };
var themesComboBox = new ComboBox('Theme', themesData);
// Do it in a timeout to simplify profiles
window.setTimeout(function () {
var START_SAMPLE = 'Y___DefaultJS';
var url_matches = location.search.match(/sample=([^?&]+)/i);
if (url_matches) {
START_SAMPLE = url_matches[1];
}
if (location.hash) {
START_SAMPLE = location.hash.replace(/^\#/, '');
START_SAMPLE = decodeURIComponent(START_SAMPLE);
}
samplesData[START_SAMPLE]();
examplesComboBox.set(START_SAMPLE);
createOptions(editor);
createToolbar(editor);
}, 0);
function updateEditor(mode, value, sampleName) {
if (sampleName) {
window.location.hash = sampleName;
}
if (typeof value !== 'undefined') {
var oldModel = model;
model = monaco.editor.createModel(value, mode);
editor.setModel(model);
if (oldModel) {
oldModel.dispose();
}
} else {
monaco.editor.setModelLanguage(model, mode);
}
modesComboBox.set(mode);
}
function createToolbar(editor) {
var bar = document.getElementById('bar');
bar.appendChild(examplesComboBox.domNode);
bar.appendChild(modesComboBox.domNode);
bar.appendChild(themesComboBox.domNode);
bar.appendChild(createButton("Dispose all", function (e) {
editor.dispose();
editor = null;
if (model) {
model.dispose();
model = null;
}
}));
bar.appendChild(createButton("Remove Model", function(e) {
editor.setModel(null);
}));
bar.appendChild(createButton("Dispose Model", function(e) {
if (model) {
model.dispose();
model = null;
}
}));
bar.appendChild(createButton('Ballistic scroll', (function() {
var friction = 1000; // px per second
var speed = 0; // px per second
var isRunning = false;
var lastTime;
var r = 0;
var scroll = function() {
var currentTime = new Date().getTime();
var ellapsedTimeS = (currentTime - lastTime) / 1000;
lastTime = currentTime;
speed = speed - friction * ellapsedTimeS;
r = r + speed * ellapsedTimeS;
editor.setScrollTop(r);
if (speed >= 0) {
domutils.scheduleAtNextAnimationFrame(scroll);
} else {
isRunning = false;
}
}
return function (e) {
speed += 2000;
if (!isRunning) {
isRunning = true;
r = editor.getScrollTop();
lastTime = new Date().getTime();
domutils.runAtThisOrScheduleAtNextAnimationFrame(scroll);
}
};
})()));
}
function createButton(label, onClick) {
var result = document.createElement("button");
result.innerHTML = label;
result.onclick = onClick;
return result;
}
function createOptions(editor) {
var options = document.getElementById('options');
var lineNumbers;
options.appendChild(createOptionToggle(
editor,
'lineNumbers',
function() {
return (lineNumbers === false ? false : true);
},
function(editor, newValue) {
lineNumbers = newValue;
editor.updateOptions({ lineNumbers: lineNumbers ? 'on' : 'off' });
}
));
var glyphMargin;
options.appendChild(createOptionToggle(
editor,
'glyphMargin',
function() {
return (glyphMargin === false ? false : true);
},
function(editor, newValue) {
glyphMargin = newValue;
editor.updateOptions({ glyphMargin: glyphMargin });
}
));
var minimap;
options.appendChild(createOptionToggle(
editor,
'minimap',
function() {
return (minimap === false ? false : true);
},
function(editor, newValue) {
minimap = newValue;
editor.updateOptions({ minimap: { enabled: minimap } });
}
));
var roundedSelection;
options.appendChild(createOptionToggle(
editor,
'roundedSelection',
function() {
return (roundedSelection === false ? false : true);
},
function(editor, newValue) {
roundedSelection = newValue;
editor.updateOptions({ roundedSelection: roundedSelection });
}
));
var scrollBeyondLastLine;
options.appendChild(createOptionToggle(
editor,
'scrollBeyondLastLine',
function() {
return (scrollBeyondLastLine === false ? false : true);
},
function(editor, newValue) {
scrollBeyondLastLine = newValue;
editor.updateOptions({ scrollBeyondLastLine: scrollBeyondLastLine });
}
));
var renderWhitespace;
options.appendChild(createOptionToggle(
editor,
'renderWhitespace',
function() {
return (renderWhitespace === true ? true : false);
},
function(editor, newValue) {
renderWhitespace = newValue;
editor.updateOptions({ renderWhitespace: renderWhitespace });
}
));
var readOnly;
options.appendChild(createOptionToggle(
editor,
'readOnly',
function() {
return (readOnly === true ? true : false);
},
function(editor, newValue) {
readOnly = newValue;
editor.updateOptions({ readOnly: readOnly });
}
));
var wordWrap;
options.appendChild(createOptionToggle(
editor,
'wordWrap',
function() {
return (wordWrap === true ? true : false);
},
function(editor, newValue) {
wordWrap = newValue;
editor.updateOptions({ wordWrap: wordWrap ? 'on' : 'off' });
}
));
var folding;
options.appendChild(createOptionToggle(
editor,
'folding',
function() {
return (folding === false ? false : true);
},
function(editor, newValue) {
folding = newValue;
editor.updateOptions({ folding: folding });
}
));
var bracketPairColorizationEnabled = false;
options.appendChild(createOptionToggle(
editor,
'bracketPairColorizationEnabled',
function() {
return (bracketPairColorizationEnabled === false ? false : true);
},
function(editor, newValue) {
bracketPairColorizationEnabled = newValue;
editor.updateOptions({ "bracketPairColorization.enabled": bracketPairColorizationEnabled, });
}
));
}
function createOptionToggle(editor, labelText, stateReader, setState) {
var domNode = document.createElement('div');
domNode.className = 'option toggle';
var input = document.createElement('input');
input.type = 'checkbox';
var label = document.createElement('label');
label.appendChild(input);
label.appendChild(document.createTextNode(labelText));
domNode.appendChild(label);
var renderState = function() {
input.checked = stateReader();
};
renderState();
editor.onDidChangeConfiguration(function() {
renderState();
}); });
input.onchange = function() {
setState(editor, !stateReader()); var editor = monaco.editor.create(document.getElementById('container'), {
model: model,
glyphMargin: true,
renderWhitespace: true
});
editor.addCommand(
{
ctrlCmd: true,
key: 'F9'
},
function (ctx, args) {
alert('Command Running!!');
console.log(ctx);
}
);
editor.addAction({
id: 'my-unique-id',
label: 'My Label!!!',
keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.F10],
contextMenuGroupId: 'navigation',
contextMenuOrder: 2.5,
run: function (ed) {
console.log("i'm running => " + ed.getPosition());
}
});
var currentSamplePromise = null;
var samplesData = {};
SAMPLES.sort(function (a, b) {
return a.name.localeCompare(b.name);
}).forEach(function (sample) {
samplesData[sample.name] = function () {
if (currentSamplePromise !== null) {
currentSamplePromise.cancel();
currentSamplePromise = null;
}
currentSamplePromise = sample.loadText().then(function (modelText) {
currentSamplePromise = null;
updateEditor(sample.mimeType, modelText, sample.name);
});
};
});
var examplesComboBox = new ComboBox('Template', samplesData);
var modesData = {};
monaco.languages.getLanguages().forEach(function (language) {
modesData[language.id] = updateEditor.bind(this, language.id);
});
var modesComboBox = new ComboBox('Mode', modesData);
var themesData = {};
themesData['vs'] = function () {
monaco.editor.setTheme('vs');
}; };
themesData['vs-dark'] = function () {
monaco.editor.setTheme('vs-dark');
};
themesData['hc-black'] = function () {
monaco.editor.setTheme('hc-black');
};
var themesComboBox = new ComboBox('Theme', themesData);
return domNode; // Do it in a timeout to simplify profiles
} window.setTimeout(function () {
var START_SAMPLE = 'Y___DefaultJS';
var url_matches = location.search.match(/sample=([^?&]+)/i);
if (url_matches) {
START_SAMPLE = url_matches[1];
}
function ComboBox(label, externalOptions) { if (location.hash) {
this.id = 'combobox-' + label.toLowerCase().replace(/\s/g, '-'); START_SAMPLE = location.hash.replace(/^\#/, '');
START_SAMPLE = decodeURIComponent(START_SAMPLE);
}
this.domNode = document.createElement('div'); samplesData[START_SAMPLE]();
this.domNode.setAttribute('style', 'display: inline; margin-right: 5px;'); examplesComboBox.set(START_SAMPLE);
this.label = document.createElement('label'); createOptions(editor);
this.label.innerHTML = label; createToolbar(editor);
this.label.setAttribute('for', this.id); }, 0);
this.domNode.appendChild(this.label);
this.comboBox = document.createElement('select'); function updateEditor(mode, value, sampleName) {
this.comboBox.setAttribute('id', this.id); if (sampleName) {
this.comboBox.setAttribute('name', this.id); window.location.hash = sampleName;
this.comboBox.onchange =(function (e) { }
var target = e.target || e.srcElement;
this.options[target.options[target.selectedIndex].value].callback();
}).bind(this);
this.domNode.appendChild(this.comboBox); if (typeof value !== 'undefined') {
var oldModel = model;
model = monaco.editor.createModel(value, mode);
editor.setModel(model);
if (oldModel) {
oldModel.dispose();
}
} else {
monaco.editor.setModelLanguage(model, mode);
}
this.options = []; modesComboBox.set(mode);
for (var name in externalOptions) { }
if (externalOptions.hasOwnProperty(name)) {
var optionElement = document.createElement('option'); function createToolbar(editor) {
optionElement.value = name; var bar = document.getElementById('bar');
optionElement.innerHTML = name;
this.options[name] = { bar.appendChild(examplesComboBox.domNode);
element: optionElement,
callback: externalOptions[name] bar.appendChild(modesComboBox.domNode);
};
this.comboBox.appendChild(optionElement); bar.appendChild(themesComboBox.domNode);
bar.appendChild(
createButton('Dispose all', function (e) {
editor.dispose();
editor = null;
if (model) {
model.dispose();
model = null;
}
})
);
bar.appendChild(
createButton('Remove Model', function (e) {
editor.setModel(null);
})
);
bar.appendChild(
createButton('Dispose Model', function (e) {
if (model) {
model.dispose();
model = null;
}
})
);
bar.appendChild(
createButton(
'Ballistic scroll',
(function () {
var friction = 1000; // px per second
var speed = 0; // px per second
var isRunning = false;
var lastTime;
var r = 0;
var scroll = function () {
var currentTime = new Date().getTime();
var ellapsedTimeS = (currentTime - lastTime) / 1000;
lastTime = currentTime;
speed = speed - friction * ellapsedTimeS;
r = r + speed * ellapsedTimeS;
editor.setScrollTop(r);
if (speed >= 0) {
domutils.scheduleAtNextAnimationFrame(scroll);
} else {
isRunning = false;
}
};
return function (e) {
speed += 2000;
if (!isRunning) {
isRunning = true;
r = editor.getScrollTop();
lastTime = new Date().getTime();
domutils.runAtThisOrScheduleAtNextAnimationFrame(scroll);
}
};
})()
)
);
}
function createButton(label, onClick) {
var result = document.createElement('button');
result.innerHTML = label;
result.onclick = onClick;
return result;
}
function createOptions(editor) {
var options = document.getElementById('options');
var lineNumbers;
options.appendChild(
createOptionToggle(
editor,
'lineNumbers',
function () {
return lineNumbers === false ? false : true;
},
function (editor, newValue) {
lineNumbers = newValue;
editor.updateOptions({ lineNumbers: lineNumbers ? 'on' : 'off' });
}
)
);
var glyphMargin;
options.appendChild(
createOptionToggle(
editor,
'glyphMargin',
function () {
return glyphMargin === false ? false : true;
},
function (editor, newValue) {
glyphMargin = newValue;
editor.updateOptions({ glyphMargin: glyphMargin });
}
)
);
var minimap;
options.appendChild(
createOptionToggle(
editor,
'minimap',
function () {
return minimap === false ? false : true;
},
function (editor, newValue) {
minimap = newValue;
editor.updateOptions({ minimap: { enabled: minimap } });
}
)
);
var roundedSelection;
options.appendChild(
createOptionToggle(
editor,
'roundedSelection',
function () {
return roundedSelection === false ? false : true;
},
function (editor, newValue) {
roundedSelection = newValue;
editor.updateOptions({ roundedSelection: roundedSelection });
}
)
);
var scrollBeyondLastLine;
options.appendChild(
createOptionToggle(
editor,
'scrollBeyondLastLine',
function () {
return scrollBeyondLastLine === false ? false : true;
},
function (editor, newValue) {
scrollBeyondLastLine = newValue;
editor.updateOptions({ scrollBeyondLastLine: scrollBeyondLastLine });
}
)
);
var renderWhitespace;
options.appendChild(
createOptionToggle(
editor,
'renderWhitespace',
function () {
return renderWhitespace === true ? true : false;
},
function (editor, newValue) {
renderWhitespace = newValue;
editor.updateOptions({ renderWhitespace: renderWhitespace });
}
)
);
var readOnly;
options.appendChild(
createOptionToggle(
editor,
'readOnly',
function () {
return readOnly === true ? true : false;
},
function (editor, newValue) {
readOnly = newValue;
editor.updateOptions({ readOnly: readOnly });
}
)
);
var wordWrap;
options.appendChild(
createOptionToggle(
editor,
'wordWrap',
function () {
return wordWrap === true ? true : false;
},
function (editor, newValue) {
wordWrap = newValue;
editor.updateOptions({ wordWrap: wordWrap ? 'on' : 'off' });
}
)
);
var folding;
options.appendChild(
createOptionToggle(
editor,
'folding',
function () {
return folding === false ? false : true;
},
function (editor, newValue) {
folding = newValue;
editor.updateOptions({ folding: folding });
}
)
);
var bracketPairColorizationEnabled = false;
options.appendChild(
createOptionToggle(
editor,
'bracketPairColorizationEnabled',
function () {
return bracketPairColorizationEnabled === false ? false : true;
},
function (editor, newValue) {
bracketPairColorizationEnabled = newValue;
editor.updateOptions({
'bracketPairColorization.enabled': bracketPairColorizationEnabled
});
}
)
);
}
function createOptionToggle(editor, labelText, stateReader, setState) {
var domNode = document.createElement('div');
domNode.className = 'option toggle';
var input = document.createElement('input');
input.type = 'checkbox';
var label = document.createElement('label');
label.appendChild(input);
label.appendChild(document.createTextNode(labelText));
domNode.appendChild(label);
var renderState = function () {
input.checked = stateReader();
};
renderState();
editor.onDidChangeConfiguration(function () {
renderState();
});
input.onchange = function () {
setState(editor, !stateReader());
};
return domNode;
}
function ComboBox(label, externalOptions) {
this.id = 'combobox-' + label.toLowerCase().replace(/\s/g, '-');
this.domNode = document.createElement('div');
this.domNode.setAttribute('style', 'display: inline; margin-right: 5px;');
this.label = document.createElement('label');
this.label.innerHTML = label;
this.label.setAttribute('for', this.id);
this.domNode.appendChild(this.label);
this.comboBox = document.createElement('select');
this.comboBox.setAttribute('id', this.id);
this.comboBox.setAttribute('name', this.id);
this.comboBox.onchange = function (e) {
var target = e.target || e.srcElement;
this.options[target.options[target.selectedIndex].value].callback();
}.bind(this);
this.domNode.appendChild(this.comboBox);
this.options = [];
for (var name in externalOptions) {
if (externalOptions.hasOwnProperty(name)) {
var optionElement = document.createElement('option');
optionElement.value = name;
optionElement.innerHTML = name;
this.options[name] = {
element: optionElement,
callback: externalOptions[name]
};
this.comboBox.appendChild(optionElement);
}
} }
} }
} ComboBox.prototype.set = function (name) {
ComboBox.prototype.set = function (name) { if (this.options[name]) {
if (this.options[name]) { this.options[name].element.selected = true;
this.options[name].element.selected = true; }
} };
};
}); });

45
monaco-editor/test/mouse-fixed.html
View file

@ -1,23 +1,32 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body style="height:2000px"> <body style="height: 2000px">
<h2>Monaco Editor in fixed element</h2>
<h2>Monaco Editor in fixed element</h2> <div
style="
position: fixed;
left: 20%;
top: 20%;
right: 20%;
height: 400px;
border: 1px solid silver;
"
id="Editor"
></div>
<div style="position: fixed; left: 20%; top: 20%; right: 20%; height: 400px; border:1px solid silver" id="Editor"> <script src="../metadata.js"></script>
<script src="dev-setup.js"></script>
<script src="../metadata.js"></script> <script>
<script src="dev-setup.js"></script> loadEditor(function () {
<script> monaco.editor.create(document.getElementById('Editor'), {
loadEditor(function() { value: document.documentElement.innerHTML,
monaco.editor.create(document.getElementById('Editor'), { language: 'xml'
value: document.documentElement.innerHTML, });
language: 'xml' });
}); </script>
}); </body>
</script>
</body>
</html> </html>

455
monaco-editor/test/mouse-scrollable-body.html
View file

@ -1,182 +1,287 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style type="text/css"> <style type="text/css">
#editor { #editor {
position: relative; position: relative;
left: 500px; left: 500px;
top: 20px; top: 20px;
width: 600px; width: 600px;
height: 400px; height: 400px;
border: 1px solid #ccc; border: 1px solid #ccc;
} }
</style> </style>
</head> </head>
<body> <body>
<h2>Monaco Editor in scrollable body</h2>
<h2>Monaco Editor in scrollable body</h2> <p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <div id="editor"></div>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure <div style="clear: both"></div>
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<div id="editor"></div> <script src="../metadata.js"></script>
<div style="clear:both"></div> <script src="dev-setup.js"></script>
<script>
loadEditor(function () {
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. monaco.editor.create(document.getElementById('editor'), {
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure value: document.documentElement.innerHTML,
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat language: 'xml'
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> });
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. });
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure </script>
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </body>
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<script src="../metadata.js"></script>
<script src="dev-setup.js"></script>
<script>
loadEditor(function() {
monaco.editor.create(document.getElementById('editor'), {
value: document.documentElement.innerHTML,
language: 'xml'
});
});
</script>
</body>
</html> </html>

323
monaco-editor/test/mouse-scrollable-element.html
View file

@ -1,134 +1,205 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style type="text/css">
#editor {
position: relative;
left: 500px;
top: 20px;
width: 600px;
height: 400px;
border: 1px solid #ccc;
}
</style>
</head>
<head> <body>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <p>
<style type="text/css"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
#editor { labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
position: relative; laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
left: 500px; voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
top: 20px; non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
width: 600px; </p>
height: 400px; <p>
border: 1px solid #ccc; Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
} labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
</style> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
</head> voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<body> <div style="height: 500px; overflow: scroll">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <p>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p>
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> <p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure </p>
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat <p>
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure <p>
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> </p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <p>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat </p>
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> <p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure </p>
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div style="height:500px; overflow:scroll"> <div id="editor"></div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div id="editor"></div> <div style="clear: both"></div>
</div>
<div style="clear:both"></div> <script src="../metadata.js"></script>
<script src="dev-setup.js"></script>
<script src="../metadata.js"></script> <script>
<script src="dev-setup.js"></script> loadEditor(function () {
<script> monaco.editor.create(document.getElementById('editor'), {
loadEditor(function() { value: document.documentElement.innerHTML,
monaco.editor.create(document.getElementById('editor'), { language: 'xml'
value: document.documentElement.innerHTML, });
language: 'xml' });
}); </script>
}); </body>
</script>
</body>
</html> </html>

27
monaco-editor/test/out-editor-esm-bundle.html
View file

@ -1,18 +1,19 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<base href="../../vscode-prs/out-editor-esm-bundle/" /> <base href="../../vscode-prs/out-editor-esm-bundle/" />
</head> </head>
<body> <body>
<h2>Monaco Editor ESM Bundle</h2>
<h2>Monaco Editor ESM Bundle</h2> <div style="clear: both"></div>
<div
id="container"
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
></div>
<div style="clear: both"></div>
<div style="clear:both"></div> <script src="core.bundle.js"></script>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> </body>
<div style="clear:both"></div>
<script src="core.bundle.js"></script>
</body>
</html> </html>

353
monaco-editor/test/samples.js
View file

@ -1,7 +1,6 @@
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" /> /// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
define(['./samples-all.generated'], function (ALL_SAMPLES) { define(['./samples-all.generated'], function (ALL_SAMPLES) {
var XHR_SAMPLES = {}; var XHR_SAMPLES = {};
ALL_SAMPLES.forEach(function (sample) { ALL_SAMPLES.forEach(function (sample) {
XHR_SAMPLES[sample.name] = sample.content; XHR_SAMPLES[sample.name] = sample.content;
@ -9,7 +8,9 @@ define(['./samples-all.generated'], function (ALL_SAMPLES) {
var samples = []; var samples = [];
var modesIds = monaco.languages.getLanguages().map(function (language) { return language.id; }); var modesIds = monaco.languages.getLanguages().map(function (language) {
return language.id;
});
modesIds.sort(); modesIds.sort();
modesIds.forEach(function (modeId) { modesIds.forEach(function (modeId) {
@ -23,7 +24,11 @@ define(['./samples-all.generated'], function (ALL_SAMPLES) {
}); });
function addXHRSample(name, modelUrl, mimeType, textModifier) { function addXHRSample(name, modelUrl, mimeType, textModifier) {
textModifier = textModifier || function (text) { return text; }; textModifier =
textModifier ||
function (text) {
return text;
};
samples.push({ samples.push({
name: name, name: name,
mimeType: mimeType, mimeType: mimeType,
@ -37,7 +42,7 @@ define(['./samples-all.generated'], function (ALL_SAMPLES) {
addXHRSample(name, modelUrl, mimeType, function (text) { addXHRSample(name, modelUrl, mimeType, function (text) {
var result = text; var result = text;
for (var i = 0; i < power; ++i) { for (var i = 0; i < power; ++i) {
result += "\n" + result; result += '\n' + result;
} }
return result; return result;
}); });
@ -65,164 +70,202 @@ define(['./samples-all.generated'], function (ALL_SAMPLES) {
addXHRSample('Z___jquery-min.js', 'run-editor-jquery-min-js.txt', 'text/javascript'); addXHRSample('Z___jquery-min.js', 'run-editor-jquery-min-js.txt', 'text/javascript');
addXHRSample('Z___scrolling-strategy.js', 'run-editor-sample-js.txt', 'text/plain', function (text) { addXHRSample(
console.log('here I am'); 'Z___scrolling-strategy.js',
var lines = text.split('\n'); 'run-editor-sample-js.txt',
var newLines = lines.slice(0); 'text/plain',
function (text) {
console.log('here I am');
var lines = text.split('\n');
var newLines = lines.slice(0);
var problemIsAt = 80733 + 5; var problemIsAt = 80733 + 5;
while (newLines.length < problemIsAt) { while (newLines.length < problemIsAt) {
newLines = newLines.concat(lines); newLines = newLines.concat(lines);
}
newLines = newLines.slice(0, problemIsAt);
return newLines.join('\n');
} }
);
newLines = newLines.slice(0, problemIsAt); addSample(
return newLines.join('\n'); 'Z___special-chars',
}); 'text/plain',
[
addSample('Z___special-chars', 'text/plain', [ '// single line \u000D comment', // Carriage return
"// single line \u000D comment", // Carriage return '// single line \u2028 comment', // Line separator
"// single line \u2028 comment", // Line separator '// single line \u2029 comment' // Paragraph separator
"// single line \u2029 comment" // Paragraph separator ].join('\n')
].join('\n')); );
// http://www.cl.cam.ac.uk/~mgk25/ucs/examples/UTF-8-test.txt // http://www.cl.cam.ac.uk/~mgk25/ucs/examples/UTF-8-test.txt
addSample('Z___invalid-unicode', 'text/plain', [ addSample(
'\uFFFE\uFFFF', 'Z___invalid-unicode',
'\uD800\uDC00', 'text/plain',
'\uD800\uDFFF', [
'\uDB7F\uDC00', '\uFFFE\uFFFF',
'\uDB7F\uDFFF', '\uD800\uDC00',
'\uDB80\uDC00', '\uD800\uDFFF',
'\uDB80\uDFFF', '\uDB7F\uDC00',
'\uDBFF\uDC00', '\uDB7F\uDFFF',
'\uDBFF\uDFFF' '\uDB80\uDC00',
].join('\n')); '\uDB80\uDFFF',
'\uDBFF\uDC00',
'\uDBFF\uDFFF'
].join('\n')
);
addSample('Z___easy-debug.js', 'text/plain', (function () { addSample(
var myValue = "Line1"; 'Z___easy-debug.js',
for (var i = 2; i < 50; i++) { 'text/plain',
myValue += "\nLine" + i; (function () {
} var myValue = 'Line1';
return myValue; for (var i = 2; i < 50; i++) {
})()); myValue += '\nLine' + i;
}
return myValue;
})()
);
addSample('Z___copy-paste.txt', 'text/plain', (function () { addSample(
var i = 0, sampleCopyPasteLine = ''; 'Z___copy-paste.txt',
while (sampleCopyPasteLine.length < 1000) { 'text/plain',
i++; (function () {
sampleCopyPasteLine += i; var i = 0,
} sampleCopyPasteLine = '';
var sampleCopyPaste = sampleCopyPasteLine; while (sampleCopyPasteLine.length < 1000) {
for (i = 1; i <= 600; i++) { i++;
sampleCopyPaste += '\n' + sampleCopyPasteLine; sampleCopyPasteLine += i;
} }
return sampleCopyPaste; var sampleCopyPaste = sampleCopyPasteLine;
})()); for (i = 1; i <= 600; i++) {
sampleCopyPaste += '\n' + sampleCopyPasteLine;
}
return sampleCopyPaste;
})()
);
addSample('Z___xss', 'text/html', (function () { addSample(
var xssRepresentations = [ 'Z___xss',
'<', 'text/html',
'BAD\u2028CHARACTER', (function () {
'%3C', var xssRepresentations = [
'&lt', '<',
'&lt;', 'BAD\u2028CHARACTER',
'&LT', '%3C',
'&LT;', '&lt',
'&#60', '&lt;',
'&#060', '&LT',
'&#0060', '&LT;',
'&#00060', '&#60',
'&#000060', '&#060',
'&#0000060', '&#0060',
'&#60;', '&#00060',
'&#060;', '&#000060',
'&#0060;', '&#0000060',
'&#00060;', '&#60;',
'&#000060;', '&#060;',
'&#0000060;', '&#0060;',
'&#x3c', '&#00060;',
'&#x03c', '&#000060;',
'&#x003c', '&#0000060;',
'&#x0003c', '&#x3c',
'&#x00003c', '&#x03c',
'&#x000003c', '&#x003c',
'&#x3c;', '&#x0003c',
'&#x03c;', '&#x00003c',
'&#x003c;', '&#x000003c',
'&#x0003c;', '&#x3c;',
'&#x00003c;', '&#x03c;',
'&#x000003c;', '&#x003c;',
'&#X3c', '&#x0003c;',
'&#X03c', '&#x00003c;',
'&#X003c', '&#x000003c;',
'&#X0003c', '&#X3c',
'&#X00003c', '&#X03c',
'&#X000003c', '&#X003c',
'&#X3c;', '&#X0003c',
'&#X03c;', '&#X00003c',
'&#X003c;', '&#X000003c',
'&#X0003c;', '&#X3c;',
'&#X00003c;', '&#X03c;',
'&#X000003c;', '&#X003c;',
'&#x3C', '&#X0003c;',
'&#x03C', '&#X00003c;',
'&#x003C', '&#X000003c;',
'&#x0003C', '&#x3C',
'&#x00003C', '&#x03C',
'&#x000003C', '&#x003C',
'&#x3C;', '&#x0003C',
'&#x03C;', '&#x00003C',
'&#x003C;', '&#x000003C',
'&#x0003C;', '&#x3C;',
'&#x00003C;', '&#x03C;',
'&#x000003C;', '&#x003C;',
'&#X3C', '&#x0003C;',
'&#X03C', '&#x00003C;',
'&#X003C', '&#x000003C;',
'&#X0003C', '&#X3C',
'&#X00003C', '&#X03C',
'&#X000003C', '&#X003C',
'&#X3C;', '&#X0003C',
'&#X03C;', '&#X00003C',
'&#X003C;', '&#X000003C',
'&#X0003C;', '&#X3C;',
'&#X00003C;', '&#X03C;',
'&#X000003C;', '&#X003C;',
'\x3c', '&#X0003C;',
'\x3C', '&#X00003C;',
'\u003c', '&#X000003C;',
'\u003C' '\x3c',
]; '\x3C',
return xssRepresentations.length + ':\n' + xssRepresentations.join('\n'); '\u003c',
})()); '\u003C'
];
return xssRepresentations.length + ':\n' + xssRepresentations.join('\n');
})()
);
addSample('Z___many-links.js', 'text/javascript', (function () { addSample(
var result = "bla bla a url: https://microsoft.com some more bla bla"; 'Z___many-links.js',
for (var i = 0; i < 13; ++i) { 'text/javascript',
result += "\n" + result; (function () {
} var result = 'bla bla a url: https://microsoft.com some more bla bla';
return "/*" + result + "\n*/"; for (var i = 0; i < 13; ++i) {
})()); result += '\n' + result;
}
return '/*' + result + '\n*/';
})()
);
addSample('Z___line-separators.js', 'text/javascript', (function () { addSample(
return [ 'Z___line-separators.js',
"var x = '1'; // And\u2028 here I have a nice comment.", 'text/javascript',
"", (function () {
"var y = x + ' +\u2028 2 = res';", return [
"", "var x = '1'; // And\u2028 here I have a nice comment.",
"y.replace(/re\u2028s/gi, '3');" '',
].join('\n'); "var y = x + ' +\u2028 2 = res';",
})()); '',
"y.replace(/re\u2028s/gi, '3');"
].join('\n');
})()
);
addXHRSample('Z___intellisense.js', 'run-editor-intellisense-js.txt', 'text/javascript'); addXHRSample('Z___intellisense.js', 'run-editor-intellisense-js.txt', 'text/javascript');
addSample('Z___recursion attack', 'text/html', (function () { addSample(
var arr = []; 'Z___recursion attack',
for (var i = 0; i < 10000; i++) { 'text/html',
arr.push('\n<script type="text/html">'); (function () {
} var arr = [];
return arr.length + ':\n' + arr.join(''); for (var i = 0; i < 10000; i++) {
})()); arr.push('\n<script type="text/html">');
}
return arr.length + ':\n' + arr.join('');
})()
);
addSample('empty', 'text/plain', ''); addSample('empty', 'text/plain', '');
@ -230,11 +273,11 @@ define(['./samples-all.generated'], function (ALL_SAMPLES) {
name: 'custom.1.', name: 'custom.1.',
tokenizer: { tokenizer: {
root: [ root: [
[/\[error.*/, "custom-error"], [/\[error.*/, 'custom-error'],
[/\[notice.*/, "custom-notice"], [/\[notice.*/, 'custom-notice'],
[/\[info.*/, "custom-info"], [/\[info.*/, 'custom-info'],
[/\[[a-zA-Z 0-9:]+\]/, "custom-date"], [/\[[a-zA-Z 0-9:]+\]/, 'custom-date']
], ]
} }
}); });

11
monaco-editor/test/samples/run-editor-js-validationParticipant.js
View file

@ -1,14 +1,9 @@
define([ define(['vs/base/common/severity'], function (severity) {
'vs/base/common/severity'
], function(severity) {
'use strict'; 'use strict';
function ValidateParticipant() { function ValidateParticipant() {}
}
ValidateParticipant.ID = 'doc.validateParticipant'; ValidateParticipant.ID = 'doc.validateParticipant';
ValidateParticipant.prototype.validate = function(mirrorModel, markerService) { ValidateParticipant.prototype.validate = function (mirrorModel, markerService) {
var marker = { var marker = {
severity: severity.Error, severity: severity.Error,
message: [ message: [

100
monaco-editor/test/shadow-dom.html
View file

@ -1,59 +1,57 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head> </head>
<body> <body>
<h2>Monaco Editor Shadow DOM</h2>
<h2>Monaco Editor Shadow DOM</h2> <div style="clear: both"></div>
<div
id="container"
style="float: left; width: 800px; height: 450px; border: 1px solid grey"
></div>
<div style="clear: both"></div>
<div style="clear:both"></div> <script src="../metadata.js"></script>
<div id="container" style="float:left;width:800px;height:450px;border: 1px solid grey"></div> <script src="dev-setup.js"></script>
<div style="clear:both"></div> <script>
const container = document.getElementById('container');
const shadowRoot = container.attachShadow({
mode: 'closed'
});
loadEditor(function () {
const innerContainer = document.createElement('div');
shadowRoot.appendChild(innerContainer);
innerContainer.style.width = '800px';
innerContainer.style.height = '450px';
<script src="../metadata.js"></script> // We must move all CSS inside the shadow root, pick only link tags relevant to the editor
<script src="dev-setup.js"></script> const documentLinks = Array.prototype.slice
<script> .call(document.getElementsByTagName('link'), 0)
const container = document.getElementById('container'); .filter((documentLink) => {
const shadowRoot = container.attachShadow({ if (/vs\/(base|editor|platform)/.test(documentLink.getAttribute('href'))) {
mode: "closed" return true;
}); }
loadEditor(function() { console.log(`Not moving: `, documentLink);
const innerContainer = document.createElement('div'); return true;
shadowRoot.appendChild(innerContainer); });
innerContainer.style.width = '800px'; documentLinks.forEach((documentLink) => shadowRoot.appendChild(documentLink));
innerContainer.style.height = '450px';
// We must move all CSS inside the shadow root, pick only link tags relevant to the editor // We must define the font face outside the shadowroot
const documentLinks = Array.prototype.slice.call(document.getElementsByTagName('link'), 0).filter((documentLink) => { const codiconCSS = `@font-face { font-family: "codicon"; src: url("${getCodiconPath()}") format("truetype"); }`;
if (/vs\/(base|editor|platform)/.test(documentLink.getAttribute('href'))) { const style = document.createElement('style');
return true; style.type = 'text/css';
} style.media = 'screen';
console.log(`Not moving: `, documentLink); document.getElementsByTagName('head')[0].appendChild(style);
return true; style.innerHTML = codiconCSS;
});
documentLinks.forEach(documentLink => shadowRoot.appendChild(documentLink));
// We must define the font face outside the shadowroot monaco.editor.create(innerContainer, {
const codiconCSS = `@font-face { font-family: "codicon"; src: url("${getCodiconPath()}") format("truetype"); }`; value: ['function hello() {', '\tconsole.log("hello world");', '}', ''].join('\n'),
const style = document.createElement('style'); language: 'javascript',
style.type = 'text/css'; ariaContainerElement: innerContainer
style.media = 'screen'; });
document.getElementsByTagName('head')[0].appendChild(style); });
style.innerHTML = codiconCSS; </script>
</body>
monaco.editor.create(innerContainer, {
value: [
'function hello() {',
'\tconsole.log("hello world");',
'}',
''
].join('\n'),
language: 'javascript',
ariaContainerElement: innerContainer
});
});
</script>
</body>
</html> </html>

70
monaco-editor/test/smoketest.html
View file

@ -1,41 +1,39 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style> <style>
#errors { #errors {
position:fixed; position: fixed;
top:0; top: 0;
right:0; right: 0;
font-size: 20px; font-size: 20px;
width: 100px; width: 100px;
height: 100px; height: 100px;
} }
body { body {
height: 100%; height: 100%;
} }
#editor { #editor {
float:left; float: left;
width: 1250px; width: 1250px;
} }
</style> </style>
</head> </head>
<body> <body>
<h2>Smoke Test</h2>
<h2>Smoke Test</h2> <div id="control"></div>
<div id="editor"></div>
<div id="errors"></div>
<div style="clear: both"></div>
<div id="control"></div> <script src="../metadata.js"></script>
<div id="editor"></div> <script src="dev-setup.js"></script>
<div id="errors"></div> <script>
<div style="clear:both"></div> loadEditor(function () {
require(['./smoketest'], function () {});
<script src="../metadata.js"></script> });
<script src="dev-setup.js"></script> </script>
<script> </body>
loadEditor(function() {
require(['./smoketest'], function() {});
});
</script>
</body>
</html> </html>

262
monaco-editor/test/smoketest.js
View file

@ -1,139 +1,145 @@
/// <reference path="../node_modules/monaco-editor-core/monaco.d.ts" /> /// <reference path="../../node_modules/monaco-editor-core/monaco.d.ts" />
define(['./samples-all.generated'], function(ALL_SAMPLES) { define(['./samples-all.generated'], function (ALL_SAMPLES) {
var XHR_SAMPLES = {};
var XHR_SAMPLES = {}; ALL_SAMPLES.forEach(function (sample) {
ALL_SAMPLES.forEach(function(sample) { XHR_SAMPLES[sample.name] = sample.content;
XHR_SAMPLES[sample.name] = sample.content;
});
var actions = (function() {
"use strict";
return [
{
name: 'Undo',
run: function (editor) {
editor.trigger('keyboard', monaco.editor.Handler.Undo);
}
},
{
name: 'type & suggest',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
var firstChar = editor.getModel().getLineContent(1).charAt(0);
editor.trigger('keyboard', monaco.editor.Handler.CursorEnd);
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: '\n' + firstChar
});
editor.focus();
editor.trigger('test', 'editor.action.triggerSuggest');
}
},
{
name: 'links',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
var commentsSupport = editor.getModel().getMode().commentsSupport;
var text = 'http://www.test.com';
if (commentsSupport) {
var commentsConfig = commentsSupport.getCommentsConfiguration();
if (commentsConfig && commentsConfig.lineCommentTokens) {
text = commentsConfig.lineCommentTokens[0] + ' ' + text;
} else if (commentsConfig && commentsConfig.blockCommentStartToken) {
text = commentsConfig.blockCommentStartToken + ' ' + text + ' ' + commentsConfig.blockCommentEndToken;
}
}
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: text + '\n'
});
}
},
{
name: 'multicursor',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: 'some text - '
});
}
}
];
})();
var panelContainer = document.getElementById('control');
var editorContainer = document.getElementById('editor');
var editors = {}, models = {};
function onError(err) {
console.error(err);
alert('error!!');
}
function getAllModes() {
var result = monaco.languages.getLanguages().map(function(language) { return language.id; });
result.sort();
return result;
}
function createEditor(container, mode) {
editors[mode] = monaco.editor.create(container, {
value: mode
}); });
var value = mode + '\n' + XHR_SAMPLES['sample.' + mode + '.txt'];
var model = monaco.editor.createModel(value, mode);
editors[mode].setModel(model);
}
function createEditors(modes) { var actions = (function () {
for (var i = 0; i < modes.length; i++) { 'use strict';
var container = document.createElement('div');
container.style.width = '300px'; return [
container.style.cssFloat = 'left'; {
container.style.height = '200px'; name: 'Undo',
container.style.border = '1px solid #ccc'; run: function (editor) {
container.style.background = 'red'; editor.trigger('keyboard', monaco.editor.Handler.Undo);
container.setAttribute('data-mime', modes[i]); }
editorContainer.appendChild(container); },
createEditor(container, modes[i]); {
name: 'type & suggest',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
var firstChar = editor.getModel().getLineContent(1).charAt(0);
editor.trigger('keyboard', monaco.editor.Handler.CursorEnd);
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: '\n' + firstChar
});
editor.focus();
editor.trigger('test', 'editor.action.triggerSuggest');
}
},
{
name: 'links',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
var commentsSupport = editor.getModel().getMode().commentsSupport;
var text = 'http://www.test.com';
if (commentsSupport) {
var commentsConfig = commentsSupport.getCommentsConfiguration();
if (commentsConfig && commentsConfig.lineCommentTokens) {
text = commentsConfig.lineCommentTokens[0] + ' ' + text;
} else if (commentsConfig && commentsConfig.blockCommentStartToken) {
text =
commentsConfig.blockCommentStartToken +
' ' +
text +
' ' +
commentsConfig.blockCommentEndToken;
}
}
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: text + '\n'
});
}
},
{
name: 'multicursor',
run: function (editor) {
editor.setPosition({
lineNumber: 1,
column: 1
});
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.AddCursorDown);
editor.trigger('keyboard', monaco.editor.Handler.Type, {
text: 'some text - '
});
}
}
];
})();
var panelContainer = document.getElementById('control');
var editorContainer = document.getElementById('editor');
var editors = {},
models = {};
function onError(err) {
console.error(err);
alert('error!!');
} }
var clearer = document.createElement('div'); function getAllModes() {
clearer.style.clear = 'both'; var result = monaco.languages.getLanguages().map(function (language) {
editorContainer.appendChild(clearer); return language.id;
} });
result.sort();
return result;
}
function executeAction(action) { function createEditor(container, mode) {
for (var mime in editors) { editors[mode] = monaco.editor.create(container, {
if (editors.hasOwnProperty(mime)) { value: mode
action(editors[mime]); });
var value = mode + '\n' + XHR_SAMPLES['sample.' + mode + '.txt'];
var model = monaco.editor.createModel(value, mode);
editors[mode].setModel(model);
}
function createEditors(modes) {
for (var i = 0; i < modes.length; i++) {
var container = document.createElement('div');
container.style.width = '300px';
container.style.cssFloat = 'left';
container.style.height = '200px';
container.style.border = '1px solid #ccc';
container.style.background = 'red';
container.setAttribute('data-mime', modes[i]);
editorContainer.appendChild(container);
createEditor(container, modes[i]);
}
var clearer = document.createElement('div');
clearer.style.clear = 'both';
editorContainer.appendChild(clearer);
}
function executeAction(action) {
for (var mime in editors) {
if (editors.hasOwnProperty(mime)) {
action(editors[mime]);
}
} }
} }
}
function createActions(actions) { function createActions(actions) {
for (var i = 0; i < actions.length; i++) { for (var i = 0; i < actions.length; i++) {
var btn = document.createElement('button'); var btn = document.createElement('button');
btn.appendChild(document.createTextNode('<<' + actions[i].name + '>>')); btn.appendChild(document.createTextNode('<<' + actions[i].name + '>>'));
btn.onclick = executeAction.bind(this, actions[i].run); btn.onclick = executeAction.bind(this, actions[i].run);
panelContainer.appendChild(btn); panelContainer.appendChild(btn);
}
} }
}
createEditors(getAllModes());
createActions(actions);
createEditors(getAllModes());
createActions(actions);
}); });

325
monaco-editor/test/tokenization.html
View file

@ -1,325 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.0.1.css">
</head>
<body>
<script src="../metadata.js"></script>
<script src="dev-setup.js"></script>
<script src="tokenization.js"></script>
<script src="https://code.jquery.com/qunit/qunit-2.0.1.js"></script>
<script>
var GENERATE_TOKENS = false;
var LIMIT_TO_TEST = null;//'sample - xml';
loadEditor(function() {
let lazyModules = [
'vs/basic-languages/src/bat',
'vs/basic-languages/src/coffee',
'vs/basic-languages/src/cpp',
'vs/basic-languages/src/csharp',
'vs/basic-languages/src/dockerfile',
'vs/basic-languages/src/fsharp',
'vs/basic-languages/src/go',
'vs/basic-languages/src/handlebars',
'vs/basic-languages/src/html',
'vs/basic-languages/src/ini',
'vs/basic-languages/src/pug',
'vs/basic-languages/src/java',
'vs/basic-languages/src/lua',
'vs/basic-languages/src/markdown',
'vs/basic-languages/src/objective-c',
'vs/basic-languages/src/postiats',
'vs/basic-languages/src/php',
'vs/basic-languages/src/powershell',
'vs/basic-languages/src/python',
'vs/basic-languages/src/r',
'vs/basic-languages/src/razor',
'vs/basic-languages/src/ruby',
'vs/basic-languages/src/swift',
'vs/basic-languages/src/sql',
'vs/basic-languages/src/vb',
'vs/basic-languages/src/xml',
'vs/basic-languages/src/less',
'vs/basic-languages/src/scss',
'vs/basic-languages/src/css',
'vs/basic-languages/src/yaml',
'vs/language/typescript/src/mode',
'vs/language/css/cssMode',
'vs/language/json/jsonMode',
'vs/language/html/htmlMode'
];
console.log('editor loaded');
require(lazyModules, function() {
console.log('all lazy code loaded');
function resolveSample(sample) {
return sample.loadText().then(function(txt) {
return {
name: sample.name,
language: sample.mimeType,
text: txt
};
});
}
require(['./samples'], function(SAMPLES) {
Promise.all(
SAMPLES.map(resolveSample)
).then(function(samples) {
renderSamples(samples);
});
});
});
});
function renderSamples(samples) {
samples = samples.filter(function(sample) {
if (typeof sample.language !== 'string') {
return false;
}
if (sample.language === 'plaintext' || sample.language === 'text/plain') {
return false;
}
// return sample.name === 'sample - css';
return /sample/.test(sample.name);
});
samples.sort(function(a,b) {
if (a.language === b.language) {
if (a.text < b.text) {
return -1;
}
if (a.text > b.text) {
return 1;
}
return 0;
}
if (a.language < b.language) {
return -1;
}
return 1;
});
samples.forEach(renderSample);
generateTests();
}
var TEST_CASES = [];
function renderSample(sample, index) {
console.log('TEST #' + index + ': ' + sample.name);
if (LIMIT_TO_TEST && sample.name !== LIMIT_TO_TEST) {
TEST_CASES.push({ name: sample.name });
return;
}
var testCase = {
name: sample.name,
// text: sample.text,
language: sample.language,
result: {
vs: extractColors(sample, 'vs'),
vs_dark: extractColors(sample, 'vs-dark'),
hc_black: extractColors(sample, 'hc-black'),
}
};
TEST_CASES.push(testCase);
}
function extractColors(sample, theme) {
var out = document.createElement('pre');
var txt = document.createTextNode(sample.text);
out.appendChild(txt);
document.body.appendChild(out);
monaco.editor.colorizeElement(out, {
theme: theme,
mimeType: sample.language
});
if (GENERATE_TOKENS) {
var tokens = monaco.editor.tokenize(sample.text || '', sample.language);
}
// console.log(out);
var lineElement = out.firstElementChild;
var allResult = [];
while (lineElement) {
// console.log(lineElement);
var pieces = lineElement.children;
var result = [];
if (GENERATE_TOKENS) {
var lineTokens = tokens.shift();
if (lineTokens.length > 0) {
for (var i = 0; i < lineTokens.length - 1; i++) {
lineTokens[i].length = lineTokens[i + 1].offset - lineTokens[i].offset;
}
lineTokens[lineTokens.length - 1].length = 1000000;
}
}
for (var i = 0; i < pieces.length; i++) {
var piece = pieces[i];
// console.log(piece);
var text = piece.innerText;
var r = window.getComputedStyle(piece);
var color = rgbToHex(r.color);
// var isWhitespace = /^\s+$/.test(text);
// var partTokens = undefined;
if (GENERATE_TOKENS) {
let partTokens = [];
let partText = text;
while (lineTokens.length > 0 && partText.length > 0) {
let t = lineTokens.shift();
partTokens.push(t);
partText = partText.substr(t.length);
}
result.push({
text: text,
color: color,
tokens: partTokens
});
} else {
result.push({
text: text,
color: color,
});
}
}
allResult.push(result);
lineElement = lineElement.nextElementSibling.nextElementSibling;
}
// console.log(JSON.stringify(allResult));
out.parentNode.removeChild(out);
return allResult;
}
var rgbCache = {};
function rgbToHex(rgb) {
if (!rgbCache[rgb]) {
var m = rgb.match(/rgb\((\d+), (\d+), (\d+)\)/);
var r = parseInt(m[1], 10);
var g = parseInt(m[2], 10);
var b = parseInt(m[3], 10);
var r = '#' + to2Hex(r) + to2Hex(g) + to2Hex(b);
rgbCache[rgb] = r;
}
return rgbCache[rgb];
}
function to2Hex(n) {
var r = n.toString(16);
if (r.length === 1) {
return '0' + r;
}
return r;
}
function generateTests() {
// var ta = document.createElement('textarea');
// ta.value = JSON.stringify(TEST_CASES, null, '\t');
// ta.style.display = 'fixed';
// ta.style.top = '0';
// ta.style.left = '0';
// document.body.appendChild(ta);
// ta.select();
// return;
for (var i = 0, len = TEST_CASES.length; i < len; i++) {
if (LIMIT_TO_TEST && TEST_CASES[i].name !== LIMIT_TO_TEST) {
// if (TEST_CASES[i].name !== 'sample - html') {
continue;
}
generateTest(TEST_CASES[i], EXPECTED[i]);
}
QUnit.start();
}
function mergeEqualColors(source) {
// return source;
let result = [];
for (let i = 0; i < source.length; i++) {
let color = source[i].color;
let text = source[i].text;
if (result.length > 0 && result[result.length - 1].color === color) {
result[result.length - 1].text += text;
} else {
result.push({
color: color,
text: text
});
}
}
return result;
}
function generateTest(actual, expected) {
['vs', 'vs_dark', 'hc_black'].forEach(function(theme) {
// if (actual.name !== 'sample - bat') {
// return;
// }
QUnit.test(actual.name + ' ' + theme, function(assert) {
var _actual = actual.result[theme];
var _expected = expected.result[theme];
for (var i = 0; i < _actual.length; i++) {
var lineActual = mergeEqualColors(_actual[i]);
// .slice(0);
// for (var j = 1; j < lineActual.length; j++) {
// if (lineActual[j-1].color === lineActual[j].color) {
// lineActual[j-1] = {
// color: lineActual[j-1].color,
// text: lineActual[j-1].text + lineActual[j].text
// };
// lineActual.splice(j, 1);
// j--;
// }
// }
var lineExpected = mergeEqualColors(_expected[i]);
// .slice(0);
// for (var j = 1; j < lineExpected.length; j++) {
// if (lineExpected[j-1].color === lineExpected[j].color) {
// lineExpected[j-1] = {
// color: lineExpected[j-1].color,
// text: lineExpected[j-1].text + lineExpected[j].text
// };
// // lineExpected[j-1].text += lineExpected[j].text;
// lineExpected.splice(j, 1);
// j--;
// }
// }
assert.deepEqual(lineActual, lineExpected, 'Line #' + (i+1));
}
});
});
}
QUnit.config.autostart = false;
</script>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>

177288
monaco-editor/test/tokenization.js
View file

File diff suppressed because it is too large Load diff

10
monaco-editor/typedoc/tsconfig.json
View file

@ -1,7 +1,7 @@
{ {
"compilerOptions": { "compilerOptions": {
"module": "CommonJS" "module": "CommonJS"
}, },
"include": ["monaco.d.ts"], "include": ["monaco.d.ts"],
"exclude": ["theme"] "exclude": ["theme"]
} }

12
monaco-editor/typedoc/typedoc.json
View file

@ -1,8 +1,8 @@
{ {
"entryPoints": ["monaco.d.ts"], "entryPoints": ["monaco.d.ts"],
"out": "../../monaco-editor-website/api", "out": "../../monaco-editor-website/api",
"theme": "./theme", "theme": "./theme",
"name": "Monaco Editor API", "name": "Monaco Editor API",
"readme": "none", "readme": "none",
"hideGenerator": true "hideGenerator": true
} }

265
monaco-editor/website/all.css
View file

@ -1,10 +1,10 @@
body { body {
padding: 54px 0 40px 0; padding: 54px 0 40px 0;
overflow-y: scroll; overflow-y: scroll;
} }
body.home { body.home {
padding-top: 0; padding-top: 0;
} }
body, body,
@ -13,49 +13,55 @@ button,
select, select,
textarea, textarea,
.navbar-search .search-query { .navbar-search .search-query {
font: 400 14px/1.4em "Segoe UI", "Open Sans", Calibri, Candara, Arial, sans-serif; font: 400 14px/1.4em 'Segoe UI', 'Open Sans', Calibri, Candara, Arial, sans-serif;
} }
.navbar .nav { .navbar .nav {
float: left; float: left;
margin-right: 0; margin-right: 0;
} }
a { a {
color: #0066cc; color: #0066cc;
cursor: pointer; cursor: pointer;
} }
h1, h2, h3, h4, h5, h6 { h1,
letter-spacing: -0.01em; h2,
margin: 0; h3,
line-height: normal; h4,
h5,
h6 {
letter-spacing: -0.01em;
margin: 0;
line-height: normal;
} }
/***** Bootstrap Cosmo Overrides *****/ /***** Bootstrap Cosmo Overrides *****/
h1, h2 { h1,
font-family: "Segoe UI Light", "Segoe UI", "Open Sans", Calibri, Candara, Arial, sans-serif; h2 {
font-weight: 300; font-family: 'Segoe UI Light', 'Segoe UI', 'Open Sans', Calibri, Candara, Arial, sans-serif;
font-weight: 300;
} }
h1 { h1 {
font-size: 72px; font-size: 72px;
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
.hero-unit h1 { .hero-unit h1 {
font-size: 48px; font-size: 48px;
} }
h2 { h2 {
font-size: 26px; font-size: 26px;
} }
h3 { h3 {
font-size: 26px; font-size: 26px;
} }
h4 { h4 {
font-size: 16px; font-size: 16px;
} }
h1 small, h1 small,
@ -64,7 +70,7 @@ h3 small,
h4 small, h4 small,
h5 small, h5 small,
h6 small { h6 small {
color: #999; color: #999;
} }
.alert-heading, .alert-heading,
@ -74,27 +80,27 @@ h6 small {
.alert h4, .alert h4,
.alert h5, .alert h5,
.alert h6 { .alert h6 {
color: inherit; color: inherit;
} }
.alert-info { .alert-info {
color: #3a87ad; color: #3a87ad;
background-color: #d9edf7; background-color: #d9edf7;
} }
.navbar-inverse .navbar-inner { .navbar-inverse .navbar-inner {
background-color: #68217A; background-color: #68217a;
-webkit-filter: none; -webkit-filter: none;
filter: none; filter: none;
} }
.navbar-inverse.home .navbar-inner { .navbar-inverse.home .navbar-inner {
background-color: transparent; background-color: transparent;
} }
.navbar-inverse .btn-navbar { .navbar-inverse .btn-navbar {
background: transparent; background: transparent;
margin-top: 14px; margin-top: 14px;
} }
.navbar-inverse .btn-navbar:hover, .navbar-inverse .btn-navbar:hover,
@ -103,189 +109,194 @@ h6 small {
.navbar-inverse .btn-navbar.active, .navbar-inverse .btn-navbar.active,
.navbar-inverse .btn-navbar.disabled, .navbar-inverse .btn-navbar.disabled,
.navbar-inverse .btn-navbar[disabled] { .navbar-inverse .btn-navbar[disabled] {
background: #442359; background: #442359;
} }
.btn-primary { .btn-primary {
background-color: #0072C6; background-color: #0072c6;
} }
.home .hero-unit { .home .hero-unit {
margin-top: -54px; margin-top: -54px;
position: relative; position: relative;
z-index: 100; z-index: 100;
} }
.hero-unit { .hero-unit {
font-weight: normal; font-weight: normal;
} }
.hero-unit h1 { .hero-unit h1 {
margin: 0 0 6px; margin: 0 0 6px;
} }
.nav-tabs > li > a { .nav-tabs > li > a {
color: #999; color: #999;
} }
.nav-tabs > li > a:hover { .nav-tabs > li > a:hover {
color: #555; color: #555;
} }
.nav-tabs > .active > a, .nav-tabs > .active > a,
.nav-tabs > .active > a:hover, .nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus { .nav-tabs > .active > a:focus {
color: #0072C6; color: #0072c6;
} }
/***** General *****/ /***** General *****/
body > section > .container { body > section > .container {
padding-top: 12px; padding-top: 12px;
} }
.masthead { .masthead {
background-color: #0072C6; background-color: #0072c6;
color: white; color: white;
} }
.masthead .hero-unit { .masthead .hero-unit {
padding: 30px 0 0; padding: 30px 0 0;
background: none; background: none;
} }
.navbar.home { .navbar.home {
position: relative; position: relative;
z-index: 500; z-index: 500;
} }
.navbar .nav>li>a { .navbar .nav > li > a {
text-shadow: none; text-shadow: none;
padding-top: 18px; padding-top: 18px;
font-size: 14px; font-size: 14px;
text-transform: uppercase; text-transform: uppercase;
} }
.navbar-inverse .nav-collapse .nav>li>a { .navbar-inverse .nav-collapse .nav > li > a {
color: white; color: white;
padding-left: 0; padding-left: 0;
} }
.navbar-inverse .nav>li>a.nav-item:focus, .navbar-inverse .nav>li>a.nav-item:hover { .navbar-inverse .nav > li > a.nav-item:focus,
background-color: rgba(0,0,0,.12); .navbar-inverse .nav > li > a.nav-item:hover {
background-color: rgba(0, 0, 0, 0.12);
} }
.navbar-inverse .nav .active>a.nav-item, .navbar-inverse .nav .active>a.nav-item:hover, .navbar-inverse .nav .active>a.nav-item:focus { .navbar-inverse .nav .active > a.nav-item,
color:#fff; .navbar-inverse .nav .active > a.nav-item:hover,
background-color: rgba(0,0,0,.24); .navbar-inverse .nav .active > a.nav-item:focus {
-webkit-box-shadow: none; color: #fff;
box-shadow: none; background-color: rgba(0, 0, 0, 0.24);
-webkit-box-shadow: none;
box-shadow: none;
} }
.navbar .logo { .navbar .logo {
/*background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIxIDBsLTExIDEyLTcuMzMzLTUuNjY2LTIuNjY3IDEuNjgydjEzLjk4NGwyLjY2NyAxLjY2NiA3LjMzMy01LjY2NiAxMSAxMSA3LTN2LTIyLjMzM2wtNy0zLjY2N3ptLTE4IDE5di05bDQgNS00IDR6bTExLTRsNy02djEybC03LTZ6Ii8+PC9zdmc+") left center no-repeat;*/ /*background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTIxIDBsLTExIDEyLTcuMzMzLTUuNjY2LTIuNjY3IDEuNjgydjEzLjk4NGwyLjY2NyAxLjY2NiA3LjMzMy01LjY2NiAxMSAxMSA3LTN2LTIyLjMzM2wtNy0zLjY2N3ptLTE4IDE5di05bDQgNS00IDR6bTExLTRsNy02djEybC03LTZ6Ii8+PC9zdmc+") left center no-repeat;*/
/*padding: 16px 12px 0 34px;*/ /*padding: 16px 12px 0 34px;*/
padding: 16px 12px 0 0px; padding: 16px 12px 0 0px;
height: 35px; height: 35px;
display: block; display: block;
float: left; float: left;
} }
.navbar .logo a { .navbar .logo a {
color: #fff; color: #fff;
font-size: 24px; font-size: 24px;
letter-spacing: -1px; letter-spacing: -1px;
} }
.navbar-fixed-top { .navbar-fixed-top {
z-index: 500; z-index: 500;
} }
.flgroup:after { .flgroup:after {
content: ""; content: '';
display: block; display: block;
visibility: hidden; visibility: hidden;
height: 0; height: 0;
clear: both; clear: both;
} }
/* Controls */ /* Controls */
/* Media Queries */ /* Media Queries */
@media (min-width: 1200px) { @media (min-width: 1200px) {
h1, h2 { h1,
letter-spacing: -0.04em; h2 {
} letter-spacing: -0.04em;
}
.hero-unit h1 { .hero-unit h1 {
font-size: 72px; font-size: 72px;
} }
h2 {
font-size: 36px;
}
h2 {
font-size: 36px;
}
} }
#gh-link { #gh-link {
display: none; display: none;
position: fixed; position: fixed;
top: 0; top: 0;
right: 0; right: 0;
border: 0; border: 0;
margin:0; margin: 0;
z-index: 1000; z-index: 1000;
} }
@media (min-width: 980px) { @media (min-width: 980px) {
#gh-link { #gh-link {
display: block; display: block;
} }
} }
@media (min-width: 980px) { @media (min-width: 980px) {
.navbar .nav { .navbar .nav {
float: right; float: right;
} }
.navbar-inverse .nav-collapse .nav>li>a { .navbar-inverse .nav-collapse .nav > li > a {
padding-left: 15px; padding-left: 15px;
} }
} }
@media (min-width: 768px) and (max-width: 979px) { @media (min-width: 768px) and (max-width: 979px) {
h1 { h1 {
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
} }
@media (max-width: 979px) { @media (max-width: 979px) {
body { body {
padding: inherit; padding: inherit;
} }
.navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top { .navbar-fixed-top,
margin-right: inherit; .navbar-fixed-bottom,
margin-left: inherit; .navbar-static-top {
margin-bottom: 0; margin-right: inherit;
} margin-left: inherit;
margin-bottom: 0;
}
.navbar-fixed-top .navbar-inner { .navbar-fixed-top .navbar-inner {
padding: 0 20px; padding: 0 20px;
} }
.navbar .container { .navbar .container {
width: 724px; width: 724px;
} }
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.navbar .container { .navbar .container {
width: 100%; width: 100%;
} }
} }
@media (max-width: 480px) { @media (max-width: 480px) {
.navbar .logo a { .navbar .logo a {
display: none; display: none;
} }
} }

355
monaco-editor/website/index.html
View file

@ -1,168 +1,229 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width" />
<head> <title>Monaco Editor</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width">
<title>Monaco Editor</title> <link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" />
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" />
<link data-inline="yes-please" href="./all.css" rel="stylesheet" />
<link data-inline="yes-please" href="./index/index.css" rel="stylesheet" />
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet"> <link
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet"> data-name="vs/editor/editor.main"
<link data-inline="yes-please" href="./all.css" rel="stylesheet"> rel="stylesheet"
<link data-inline="yes-please" href="./index/index.css" rel="stylesheet"> href="../release/dev/vs/editor/editor.main.css"
/>
</head>
<link data-name="vs/editor/editor.main" rel="stylesheet" href="../release/dev/vs/editor/editor.main.css"> <body>
</head> <pre data-preload="index/samples/sample.typescript.txt"></pre>
<pre data-preload="index/samples/diff.lhs.txt"></pre>
<pre data-preload="index/samples/diff.rhs.txt"></pre>
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"
><img width="149" height="149" alt="Fork me on GitHub" src="./fork.png"
/></a>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<div class="logo">
<a href="index.html">Monaco Editor</a>
</div>
<!-- collapse button for smaller screens -->
<button
type="button"
class="btn btn-navbar"
data-toggle="collapse"
data-target=".nav-collapse"
>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<body> <!-- navbar title -->
<pre data-preload="index/samples/sample.typescript.txt"></pre> <div class="nav-collapse collapse">
<pre data-preload="index/samples/diff.lhs.txt"></pre> <ul class="nav">
<pre data-preload="index/samples/diff.rhs.txt"></pre> <li><a class="nav-item" href="index.html">Home</a></li>
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"><img <li><a class="nav-item" href="api/index.html">API Doc</a></li>
width="149" height="149" alt="Fork me on GitHub" src="./fork.png"/></a> <li><a class="nav-item" href="playground.html">Playground</a></li>
<nav class="navbar navbar-inverse navbar-fixed-top"> <li><a class="nav-item" href="monarch.html">Monarch</a></li>
<div class="navbar-inner"> <li>
<a
class="nav-item"
target="_blank"
href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
>Download {{version}}</a
>
</li>
</ul>
</div>
</div>
</div>
</nav>
<section class="try">
<div class="container"> <div class="container">
<div class="logo"> <h3>About</h3>
<a href="index.html">Monaco Editor</a> <div class="row">
</div> <div class="span12">
<!-- collapse button for smaller screens --> <br />
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <p>
<span class="icon-bar"></span> The Monaco Editor is the code editor that powers
<span class="icon-bar"></span> <a href="https://github.com/Microsoft/vscode">VS Code</a>. A good page describing the
<span class="icon-bar"></span> code editor's features is
</button> <a href="https://code.visualstudio.com/docs/editor/editingevolved">here</a>.
</p>
<!-- navbar title --> <p>
<div class="nav-collapse collapse"> It is licensed under the MIT License and supports Edge, Chrome, Firefox, Safari and
<ul class="nav"> Opera.
<li><a class="nav-item" href="index.html">Home</a></li> </p>
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
<li><a class="nav-item" href="playground.html">Playground</a></li>
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
<li><a class="nav-item" target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">Download {{version}}</a></li>
</ul>
</div>
</div>
</div>
</nav>
<section class="try">
<div class="container">
<h3>About</h3>
<div class="row">
<div class="span12">
<br/>
<p>The Monaco Editor is the code editor that powers <a href="https://github.com/Microsoft/vscode">VS Code</a>.
A good page describing the code editor's features is <a href="https://code.visualstudio.com/docs/editor/editingevolved">here</a>.</p>
<p>It is licensed under the MIT License and supports Edge, Chrome, Firefox, Safari and Opera.</p> <p>
The Monaco editor is
<span style="font-weight: bold; color: #ff5722">not</span>
supported in mobile browsers or mobile web frameworks.
</p>
<p>The Monaco editor is <span style="font-weight:bold;color:#ff5722;">not</span> supported in mobile browsers or mobile web frameworks. </p> <p>
Find more information at the
<p>Find more information at the <a href="https://github.com/Microsoft/monaco-editor">Monaco Editor repo</a>.</p> <a href="https://github.com/Microsoft/monaco-editor">Monaco Editor repo</a>.
</div> </p>
</div>
<hr/>
<h3>Download v{{version}}</h3>
<div class="row">
<div class="span12">
<br/>
<p>The latest released version is <strong>{{version}}</strong>.</p>
<p>Download with this direct <a target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">download link</a>
or <a href="https://www.npmjs.com/package/monaco-editor">from npm</a>:</p>
<pre style="color:black">npm install monaco-editor@{{version}}</pre>
</div>
</div>
<hr/>
<h3>Editor</h3>
<div class="editor row">
<div class="span3">
<h4 title="Syntax colorization plus support for errors, warnings, IntelliSense, formatting and outlining">Rich IntelliSense, Validation</h4>
<p>TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML</p>
<br>
<h4 title="Syntax colorization">Basic Syntax Colorization</h4>
<p>XML, PHP, C#, C++, Razor, Markdown, Diff, Java, VB, CoffeeScript, Handlebars, Batch, Pug, F#, Lua, Powershell,
Python, Ruby, SASS, R, Objective-C</p>
<br>
<p>Colorizers are implemented using <a href="monarch.html"
target="_blank">Monarch</a>.</p>
</div>
<div class="span9">
<div class="row">
<div class="span4">
<label class="control-label">Language</label>
<select class="language-picker"></select>
</div>
<div class="span4">
<label class="control-label">Theme</label>
<select class="theme-picker">
<option>Visual Studio</option>
<option>Visual Studio Dark</option>
<option>High Contrast Dark</option>
</select>
</div>
</div> </div>
<div class="editor-frame"> </div>
<div class="loading editor" style="display: none;"> <hr />
<div class="progress progress-striped active"> <h3>Download v{{version}}</h3>
<div class="bar"></div> <div class="row">
<div class="span12">
<br />
<p>The latest released version is <strong>{{version}}</strong>.</p>
<p>
Download with this direct
<a
target="_blank"
href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
>download link</a
>
or
<a href="https://www.npmjs.com/package/monaco-editor">from npm</a>:
</p>
<pre style="color: black">npm install monaco-editor@{{version}}</pre>
</div>
</div>
<hr />
<h3>Editor</h3>
<div class="editor row">
<div class="span3">
<h4
title="Syntax colorization plus support for errors, warnings, IntelliSense, formatting and outlining"
>
Rich IntelliSense, Validation
</h4>
<p>TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML</p>
<br />
<h4 title="Syntax colorization">Basic Syntax Colorization</h4>
<p>
XML, PHP, C#, C++, Razor, Markdown, Diff, Java, VB, CoffeeScript, Handlebars, Batch,
Pug, F#, Lua, Powershell, Python, Ruby, SASS, R, Objective-C
</p>
<br />
<p>
Colorizers are implemented using
<a href="monarch.html" target="_blank">Monarch</a>.
</p>
</div>
<div class="span9">
<div class="row">
<div class="span4">
<label class="control-label">Language</label>
<select class="language-picker"></select>
</div>
<div class="span4">
<label class="control-label">Theme</label>
<select class="theme-picker">
<option>Visual Studio</option>
<option>Visual Studio Dark</option>
<option>High Contrast Dark</option>
</select>
</div> </div>
</div> </div>
<div id="editor"></div> <div class="editor-frame">
<div class="loading editor" style="display: none">
<div class="progress progress-striped active">
<div class="bar"></div>
</div>
</div>
<div id="editor"></div>
</div>
</div>
</div>
<hr />
<h3>Diff Editor</h3>
<div class="editor row">
<div class="span3">
<h4 title="As you type diffing for all supported languages">
Side by side live comparison
</h4>
<p>Supports all languages out of the box</p>
</div>
<div class="span9">
<div class="row">
<div class="span8">
<div class="checkbox">
<label class="control-label">
<input id="inline-diff-checkbox" type="checkbox" value="" />
Inline diff
</label>
</div>
</div>
</div>
<div class="editor-frame">
<div class="loading diff-editor" style="display: none">
<div class="progress progress-striped active">
<div class="bar"></div>
</div>
</div>
<div id="diff-editor"></div>
</div>
</div> </div>
</div> </div>
</div> </div>
<hr> </section>
<h3>Diff Editor</h3>
<div class="editor row">
<div class="span3">
<h4 title="As you type diffing for all supported languages">Side by side live comparison</h4>
<p>Supports all languages out of the box</p>
</div>
<div class="span9">
<div class="row">
<div class="span8">
<div class="checkbox">
<label class="control-label">
<input id="inline-diff-checkbox" type="checkbox" value=""> Inline diff
</label>
</div>
</div>
</div>
<div class="editor-frame">
<div class="loading diff-editor" style="display: none;">
<div class="progress progress-striped active">
<div class="bar"></div>
</div>
</div>
<div id="diff-editor"></div>
</div>
</div>
</div>
</div>
</section> <footer class="container">
<hr />
<p class="text-center">
<a href="https://microsoft.com" title="Microsoft">
<img
src="https://opensource.microsoft.com/assets/images/Microsoft_logo.svg"
alt="Microsoft"
style="max-height: 23px; margin-bottom: 12px"
/>
</a>
<br />
<small>&copy; {{year}} Microsoft</small>
</p>
</footer>
<footer class="container"> <script
<hr> src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"
<p class="text-center"> integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
<a href="https://microsoft.com" title="Microsoft"> crossorigin="anonymous"
<img src="https://opensource.microsoft.com/assets/images/Microsoft_logo.svg" alt="Microsoft" style="max-height:23px;margin-bottom:12px;"> ></script>
</a> <script
<br/> src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js"
<small>&copy; {{year}} Microsoft</small> integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8="
</p> crossorigin="anonymous"
</footer> ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ=" crossorigin="anonymous"></script> <script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js" integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8=" crossorigin="anonymous"></script> var require = { paths: { vs: '../release/dev/vs' } };
</script>
<script>var require = { paths: { 'vs': '../release/dev/vs' } };</script> <script src="../release/dev/vs/loader.js"></script>
<script src="../release/dev/vs/loader.js"></script> <script src="../release/dev/vs/editor/editor.main.nls.js"></script>
<script src="../release/dev/vs/editor/editor.main.nls.js"></script> <script src="../release/dev/vs/editor/editor.main.js"></script>
<script src="../release/dev/vs/editor/editor.main.js"></script> <script data-inline="yes-please" src="./index/index.js"></script>
<script data-inline="yes-please" src="./index/index.js"></script> </body>
</body>
</html> </html>

36
monaco-editor/website/index/index.css
View file

@ -26,15 +26,15 @@
.try .drops li.active h4, .try .drops li.active h4,
.try .drops li.active:hover h4 { .try .drops li.active:hover h4 {
color: #0072C6; color: #0072c6;
} }
.try .drops li:hover h4 { .try .drops li:hover h4 {
color: rgba(0, 114, 198, .5); color: rgba(0, 114, 198, 0.5);
} }
.try .editor.row { .try .editor.row {
padding: 18px 0 padding: 18px 0;
} }
.try .row h4 { .try .row h4 {
@ -53,11 +53,11 @@
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055);
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-o-box-sizing: border-box; -o-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-ms-box-sizing: border-box; -ms-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
} }
.try .tile:hover { .try .tile:hover {
@ -83,9 +83,9 @@
height: 43px; height: 43px;
width: 80px; width: 80px;
opacity: .5; opacity: 0.5;
transition: opacity .5s ease, bottom .5s ease; transition: opacity 0.5s ease, bottom 0.5s ease;
-webkit-transition: opacity .5s ease, bottom .5s ease; -webkit-transition: opacity 0.5s ease, bottom 0.5s ease;
} }
.try .tile:hover .glyph { .try .tile:hover .glyph {
@ -104,7 +104,7 @@
margin-right: 4px; margin-right: 4px;
} }
.try .editor.row .monaco-editor .find-widget input[type="text"] { .try .editor.row .monaco-editor .find-widget input[type='text'] {
margin-bottom: 0; margin-bottom: 0;
-webkit-box-shadow: none; -webkit-box-shadow: none;
-moz-box-shadow: none; -moz-box-shadow: none;
@ -140,7 +140,7 @@
position: absolute; position: absolute;
height: 100%; height: 100%;
width: 100%; width: 100%;
background-color: rgba(255, 255, 255, .5); background-color: rgba(255, 255, 255, 0.5);
margin: 0 auto; margin: 0 auto;
display: none; display: none;
z-index: 100; z-index: 100;
@ -176,7 +176,7 @@
} }
.try .editor .vs-dark.monaco-editor .context-view.monaco-menu-container a { .try .editor .vs-dark.monaco-editor .context-view.monaco-menu-container a {
color: #BBB; color: #bbb;
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
@ -219,12 +219,14 @@
/* ------- BEGIN bootstrap fixes for the editor ------- */ /* ------- BEGIN bootstrap fixes for the editor ------- */
.monaco-editor .container:before, .monaco-editor .row:before { .monaco-editor .container:before,
content: ""; .monaco-editor .row:before {
content: '';
display: inherit; display: inherit;
} }
.monaco-editor .container:after, .monaco-editor .row:after { .monaco-editor .container:after,
.monaco-editor .row:after {
clear: inherit; clear: inherit;
} }

56
monaco-editor/website/index/index.js
View file

@ -1,16 +1,19 @@
/// <reference path="../../release/monaco.d.ts" /> /// <reference path="../../release/monaco.d.ts" />
"use strict"; 'use strict';
var editor = null, diffEditor = null; var editor = null,
diffEditor = null;
$(document).ready(function() { $(document).ready(function () {
require(['vs/editor/editor.main'], function () { require(['vs/editor/editor.main'], function () {
var MODES = (function() { var MODES = (function () {
var modesIds = monaco.languages.getLanguages().map(function(lang) { return lang.id; }); var modesIds = monaco.languages.getLanguages().map(function (lang) {
return lang.id;
});
modesIds.sort(); modesIds.sort();
return modesIds.map(function(modeId) { return modesIds.map(function (modeId) {
return { return {
modeId: modeId, modeId: modeId,
sampleURL: 'index/samples/sample.' + modeId + '.txt' sampleURL: 'index/samples/sample.' + modeId + '.txt'
@ -25,15 +28,15 @@ $(document).ready(function() {
if (MODES[i].modeId === 'typescript') { if (MODES[i].modeId === 'typescript') {
startModeIndex = i; startModeIndex = i;
} }
$(".language-picker").append(o); $('.language-picker').append(o);
} }
$(".language-picker")[0].selectedIndex = startModeIndex; $('.language-picker')[0].selectedIndex = startModeIndex;
loadSample(MODES[startModeIndex]); loadSample(MODES[startModeIndex]);
$(".language-picker").change(function() { $('.language-picker').change(function () {
loadSample(MODES[this.selectedIndex]); loadSample(MODES[this.selectedIndex]);
}); });
$(".theme-picker").change(function() { $('.theme-picker').change(function () {
changeTheme(this.selectedIndex); changeTheme(this.selectedIndex);
}); });
@ -57,10 +60,10 @@ $(document).ready(function() {
}); });
var preloaded = {}; var preloaded = {};
(function() { (function () {
var elements = Array.prototype.slice.call(document.querySelectorAll('pre[data-preload]'), 0); var elements = Array.prototype.slice.call(document.querySelectorAll('pre[data-preload]'), 0);
elements.forEach(function(el) { elements.forEach(function (el) {
var path = el.getAttribute('data-preload'); var path = el.getAttribute('data-preload');
preloaded[path] = el.innerText || el.textContent; preloaded[path] = el.innerText || el.textContent;
el.parentNode.removeChild(el); el.parentNode.removeChild(el);
@ -78,14 +81,14 @@ function xhr(url, cb) {
error: function () { error: function () {
cb(this, null); cb(this, null);
} }
}).done(function(data) { }).done(function (data) {
cb(null, data); cb(null, data);
}); });
} }
function loadSample(mode) { function loadSample(mode) {
$('.loading.editor').show(); $('.loading.editor').show();
xhr(mode.sampleURL, function(err, data) { xhr(mode.sampleURL, function (err, data) {
if (err) { if (err) {
if (editor) { if (editor) {
if (editor.getModel()) { if (editor.getModel()) {
@ -96,14 +99,16 @@ function loadSample(mode) {
} }
$('.loading.editor').fadeOut({ duration: 200 }); $('.loading.editor').fadeOut({ duration: 200 });
$('#editor').empty(); $('#editor').empty();
$('#editor').append('<p class="alert alert-error">Failed to load ' + mode.modeId + ' sample</p>'); $('#editor').append(
'<p class="alert alert-error">Failed to load ' + mode.modeId + ' sample</p>'
);
return; return;
} }
if (!editor) { if (!editor) {
$('#editor').empty(); $('#editor').empty();
editor = monaco.editor.create(document.getElementById('editor'), { editor = monaco.editor.create(document.getElementById('editor'), {
model: null, model: null
}); });
} }
@ -114,34 +119,35 @@ function loadSample(mode) {
oldModel.dispose(); oldModel.dispose();
} }
$('.loading.editor').fadeOut({ duration: 300 }); $('.loading.editor').fadeOut({ duration: 300 });
}) });
} }
function loadDiffSample() { function loadDiffSample() {
var onError = function () {
var onError = function() {
$('.loading.diff-editor').fadeOut({ duration: 200 }); $('.loading.diff-editor').fadeOut({ duration: 200 });
$('#diff-editor').append('<p class="alert alert-error">Failed to load diff editor sample</p>'); $('#diff-editor').append('<p class="alert alert-error">Failed to load diff editor sample</p>');
}; };
$('.loading.diff-editor').show(); $('.loading.diff-editor').show();
var lhsData = null, rhsData = null, jsMode = null; var lhsData = null,
rhsData = null,
jsMode = null;
xhr('index/samples/diff.lhs.txt', function(err, data) { xhr('index/samples/diff.lhs.txt', function (err, data) {
if (err) { if (err) {
return onError(); return onError();
} }
lhsData = data; lhsData = data;
onProgress(); onProgress();
}) });
xhr('index/samples/diff.rhs.txt', function(err, data) { xhr('index/samples/diff.rhs.txt', function (err, data) {
if (err) { if (err) {
return onError(); return onError();
} }
rhsData = data; rhsData = data;
onProgress(); onProgress();
}) });
function onProgress() { function onProgress() {
if (lhsData && rhsData) { if (lhsData && rhsData) {
@ -163,6 +169,6 @@ function loadDiffSample() {
} }
function changeTheme(theme) { function changeTheme(theme) {
var newTheme = (theme === 1 ? 'vs-dark' : ( theme === 0 ? 'vs' : 'hc-black' )); var newTheme = theme === 1 ? 'vs-dark' : theme === 0 ? 'vs' : 'hc-black';
monaco.editor.setTheme(newTheme); monaco.editor.setTheme(newTheme);
} }

1277
monaco-editor/website/monarch.html
View file

File diff suppressed because it is too large Load diff

333
monaco-editor/website/monarch/monarch.css
View file

@ -1,219 +1,296 @@
/* common extra token classes */ /* common extra token classes */
.monaco-editor .token.invalid { border-bottom: red dotted 1px } .monaco-editor .token.invalid {
.monaco-editor .token.identifier { } border-bottom: red dotted 1px;
.monaco-editor .token.comment.doc { font-style: normal; } }
.monaco-editor .token.comment.doc {
font-style: normal;
}
.monaco-editor .token.type { color: teal; } .monaco-editor .token.type {
.monaco-editor .token.type.delimiter { color: teal; } color: teal;
.monaco-editor .token.predefined { color: navy; } }
.monaco-editor .token.namespace { color: navy; } .monaco-editor .token.type.delimiter {
.monaco-editor .token.constructor { color: purple; } color: teal;
}
.monaco-editor .token.predefined {
color: navy;
}
.monaco-editor .token.namespace {
color: navy;
}
.monaco-editor .token.constructor {
color: purple;
}
/* theme all the new token classes */ /* theme all the new token classes */
.monaco-editor.vs-dark .token.type { color: darkcyan;} .monaco-editor.vs-dark .token.type {
.monaco-editor.vs-dark .token.predefined { color: darkorchid;} color: darkcyan;
.monaco-editor.vs-dark .token.namespace { color: lightsteelblue; } }
.monaco-editor.vs-dark .token.constructor { color: palegoldenrod; } .monaco-editor.vs-dark .token.predefined {
color: darkorchid;
}
.monaco-editor.vs-dark .token.namespace {
color: lightsteelblue;
}
.monaco-editor.vs-dark .token.constructor {
color: palegoldenrod;
}
.monaco-editor.high-contrast-black .token.type { color: darkcyan;} .monaco-editor.high-contrast-black .token.type {
.monaco-editor.high-contrast-black .token.predefined { color: aquamarine;} color: darkcyan;
.monaco-editor.high-contrast-black .token.namespace { color: lightsteelblue; } }
.monaco-editor.high-contrast-black .token.constructor { color: palegoldenrod; } .monaco-editor.high-contrast-black .token.predefined {
color: aquamarine;
}
.monaco-editor.high-contrast-black .token.namespace {
color: lightsteelblue;
}
.monaco-editor.high-contrast-black .token.constructor {
color: palegoldenrod;
}
/* specials for functional languages */ /* specials for functional languages */
.token.keyword.dot { color: black; } .token.keyword.dot {
.token.typeparam { color: #555; } color: black;
.token.typevar { font-style: italic; } }
.token.typeparam {
color: #555;
}
.token.typevar {
font-style: italic;
}
.monaco-editor .current-line, .monaco-editor .current-line,
.monaco-editor.vs .current-line, .monaco-editor.vs .current-line,
.monaco-editor.monaco .current-line { border: none; } .monaco-editor.monaco .current-line {
.monaco-editor.vs .key.js { color: navy;} border: none;
}
.monaco-editor.vs .key.js {
color: navy;
}
.monaco-editor.vs .token.string.escape, .monaco-editor.vs .token.string.escape,
.token.regexp.escape { color: dimgray; } .token.regexp.escape {
.token.regexp.escape.control { color: black; } color: dimgray;
}
.token.regexp.escape.control {
color: black;
}
.token.emphasis { font-style: italic;} .token.emphasis {
.token.strong { font-weight: bold; } font-style: italic;
.token.header { color: navy ;} }
.token.strong {
font-weight: bold;
}
.token.header {
color: navy;
}
/* ------------------------------------------- /* -------------------------------------------
Workbench UI style Workbench UI style
--------------------------------------------*/ --------------------------------------------*/
#editor, #langPane { #editor,
height: 60ex; #langPane {
border: 1px solid #ccc height: 60ex;
border: 1px solid #ccc;
} }
#langPane { #langPane {
height: 72ex; height: 72ex;
} }
#main { #main {
font-family: "Segoe UI Light", "Segoe UI", Arial, "HelveticaNeue-Light", sans-serif; font-family: 'Segoe UI Light', 'Segoe UI', Arial, 'HelveticaNeue-Light', sans-serif;
font-size: 12pt; font-size: 12pt;
width: 94%; width: 94%;
padding: 0pt; padding: 0pt;
margin: 1% 3% 5ex 3%; margin: 1% 3% 5ex 3%;
} }
#leftPane { #leftPane {
float: left; float: left;
width: 58%; width: 58%;
margin: 0pt; margin: 0pt;
margin-bottom: 2ex; margin-bottom: 2ex;
} }
#rightPane { #rightPane {
width: 40%; width: 40%;
float: right; float: right;
margin: 0pt; margin: 0pt;
} }
#header, #footer { #header,
clear: both; #footer {
font-size: 18pt; clear: both;
margin-bottom: 1ex; font-size: 18pt;
margin-bottom: 1ex;
} }
#logo { #logo {
margin: 0pt 0pt 5pt -17px; margin: 0pt 0pt 5pt -17px;
padding: 0pt; padding: 0pt;
width: 17px; width: 17px;
} }
#commandbar { #commandbar {
margin-top: 4px; margin-top: 4px;
height: 90%; height: 90%;
} }
#monarchConsole { #monarchConsole {
color: black; color: black;
overflow: auto; overflow: auto;
height: 100px; height: 100px;
border: lightgray 1px solid; border: lightgray 1px solid;
padding-left: 1ex; padding-left: 1ex;
margin-top: 10px; margin-top: 10px;
white-space: pre-wrap; white-space: pre-wrap;
} }
#sampleselect { #sampleselect {
width: 15ex; width: 15ex;
} }
#themeselect, #sampleselect { #themeselect,
padding: 0; #sampleselect {
margin: 0; padding: 0;
height: auto; margin: 0;
height: auto;
} }
.paneheader { .paneheader {
margin-bottom: 0.5ex; margin-bottom: 0.5ex;
font-size: 14pt; font-size: 14pt;
} }
.selectbox { .selectbox {
float: right; float: right;
font-size: smaller; font-size: smaller;
} }
.button { .button {
border: 1px solid lightgray; border: 1px solid lightgray;
cursor: pointer; cursor: pointer;
padding: 0ex 0.5ex 0ex 0.5ex; padding: 0ex 0.5ex 0ex 0.5ex;
} }
.button:hover { .button:hover {
background-color: lightgray; background-color: lightgray;
border-color: dimgray; border-color: dimgray;
} }
.touchbutton:hover { .touchbutton:hover {
background-color: #F8F8F8; background-color: #f8f8f8;
} }
.touchbutton { .touchbutton {
border: 1px solid; border: 1px solid;
border-radius: 1000px; /* circle */ border-radius: 1000px; /* circle */
height: 3ex; height: 3ex;
width: 3ex; /* needed for safari */ width: 3ex; /* needed for safari */
cursor: pointer; cursor: pointer;
} }
.touchbutton:hover { .touchbutton:hover {
background-color: #F8F8F8; background-color: #f8f8f8;
} }
.arrowdown { .arrowdown {
font-size: 10pt; font-size: 10pt;
} }
/*------------------------------------------------------------------- /*-------------------------------------------------------------------
documentation style documentation style
-------------------------------------------------------------------*/ -------------------------------------------------------------------*/
#documentation { #documentation {
clear: both; clear: both;
border: lightgray 1px solid; border: lightgray 1px solid;
padding: 1ex 4ex 1ex 3ex; padding: 1ex 4ex 1ex 3ex;
font-family: "Segoe UI", Arial, "HelveticaNeue-Light", sans-serif; font-family: 'Segoe UI', Arial, 'HelveticaNeue-Light', sans-serif;
} }
#documentation a { #documentation a {
color: navy; color: navy;
text-decoration: none; text-decoration: none;
border-bottom: 1px dotted; border-bottom: 1px dotted;
} }
#documentation .monaco-editor.monaco .current-line, #documentation .monaco-editor.monaco .current-line,
#documentation .monaco-editor { background-color: #fafafa } #documentation .monaco-editor {
#documentation .string.escape { color: dimgray;} background-color: #fafafa;
}
#documentation .string.escape {
color: dimgray;
}
h1,h2,h3,h4 h1,
{ font-weight: normal; h2,
margin-top: 0pt; h3,
margin-left: -1.5ex; h4 {
margin-bottom: 0pt; font-weight: normal;
} margin-top: 0pt;
margin-left: -1.5ex;
margin-bottom: 0pt;
}
h2 { font-size: 16pt;} h2 {
h3 { font-size: 120%;} font-size: 16pt;
}
h3 {
font-size: 120%;
}
ul { padding-left: 1.5em ul {
; margin-left: 0pt padding-left: 1.5em;
} margin-left: 0pt;
}
.options, .options,
pre { border: 1px solid #888 pre {
; padding: 1ex border: 1px solid #888;
; background: #F8F8F8 padding: 1ex;
; font-size: 10pt; background: #f8f8f8;
} font-size: 10pt;
}
code,
pre,
dt {
font-family: Consolas, monospace;
}
code, pre,dt { font-family: Consolas, monospace } strong {
color: black;
}
strong { color: black } td {
vertical-align: top;
}
img {
margin: 2ex;
}
td { vertical-align: top } dt {
img { margin: 2ex } color: navy;
margin-top: 2ex;
padding: 2px;
}
.dt {
color: navy;
}
.adv {
color: maroon;
}
dl dl dt {
margin-top: 1ex;
}
dt { color: navy; margin-top: 2ex; padding: 2px;} #documentation .keyword {
.dt { color: navy } color: blue;
.adv { color: maroon; } }
#documentation .tag {
dl dl dt { margin-top: 1ex;} color: navy;
}
#documentation .keyword { color: blue; }
#documentation .tag { color: navy; }

38
monaco-editor/website/monarch/monarch.js
View file

@ -1,12 +1,12 @@
/// <reference path="../../release/monaco.d.ts" /> /// <reference path="../../release/monaco.d.ts" />
"use strict"; 'use strict';
/*----------------------------------------- /*-----------------------------------------
General helpers General helpers
------------------------------------------*/ ------------------------------------------*/
function clearInnerText(elem) { function clearInnerText(elem) {
elem.innerHTML = ""; elem.innerHTML = '';
} }
function getInnerText(elem) { function getInnerText(elem) {
@ -35,17 +35,16 @@ function getTextFromId(id) {
return getInnerText(elem); return getInnerText(elem);
} }
/* ----------------------------------------- /* -----------------------------------------
The main loader for the workbench UI The main loader for the workbench UI
------------------------------------------*/ ------------------------------------------*/
var outputPane = document.getElementById("monarchConsole"); var outputPane = document.getElementById('monarchConsole');
var isDirty = false; var isDirty = false;
window.onbeforeunload = function (ev) { window.onbeforeunload = function (ev) {
if (isDirty) { if (isDirty) {
return "If you leave this page any unsaved work will be lost."; return 'If you leave this page any unsaved work will be lost.';
} }
}; };
@ -53,10 +52,10 @@ function createLangModel(languageId, text) {
monaco.languages.register({ id: languageId }); monaco.languages.register({ id: languageId });
var langModel = monaco.editor.createModel(text, 'javascript'); var langModel = monaco.editor.createModel(text, 'javascript');
var update = function() { var update = function () {
var def = null; var def = null;
try { try {
def = eval("(function(){ " + langModel.getValue() + "; })()"); def = eval('(function(){ ' + langModel.getValue() + '; })()');
} catch (err) { } catch (err) {
setInnerText(outputPane, err + '\n'); setInnerText(outputPane, err + '\n');
return; return;
@ -64,7 +63,7 @@ function createLangModel(languageId, text) {
monaco.languages.setMonarchTokensProvider(languageId, def); monaco.languages.setMonarchTokensProvider(languageId, def);
setInnerText(outputPane, 'up-to-date\n'); setInnerText(outputPane, 'up-to-date\n');
}; };
langModel.onDidChangeContent(function() { langModel.onDidChangeContent(function () {
isDirty = true; isDirty = true;
update(); update();
}); });
@ -84,31 +83,31 @@ function readSamples(sampleSelect) {
var languageId = 'monarch-language-' + id; var languageId = 'monarch-language-' + id;
var sampleText = getTextFromId(id + "-sample"); var sampleText = getTextFromId(id + '-sample');
samples[id] = { samples[id] = {
languageId: languageId, languageId: languageId,
langModel: createLangModel(languageId, getTextFromId(id)), langModel: createLangModel(languageId, getTextFromId(id)),
langViewState: null, langViewState: null,
sampleModel: monaco.editor.createModel(sampleText, languageId), sampleModel: monaco.editor.createModel(sampleText, languageId),
sampleViewState: null, sampleViewState: null
}; };
} }
return samples; return samples;
} }
require(["vs/editor/editor.main"], function () { require(['vs/editor/editor.main'], function () {
var sampleSelect = document.getElementById("sampleselect"); var sampleSelect = document.getElementById('sampleselect');
var langPane = document.getElementById("langPane"); var langPane = document.getElementById('langPane');
var editorPane = document.getElementById("editor"); var editorPane = document.getElementById('editor');
// Adjust height of editors // Adjust height of editors
var screenHeight = window.innerHeight; var screenHeight = window.innerHeight;
if (screenHeight) { if (screenHeight) {
var paneHeight = 0.76 * screenHeight; var paneHeight = 0.76 * screenHeight;
langPane.style.height = paneHeight + "px"; langPane.style.height = paneHeight + 'px';
editorPane.style.height = (paneHeight - 112) + "px"; // 100px + margin 10px + borders 2px editorPane.style.height = paneHeight - 112 + 'px'; // 100px + margin 10px + borders 2px
} }
var SAMPLES = readSamples(sampleSelect); var SAMPLES = readSamples(sampleSelect);
@ -124,8 +123,8 @@ require(["vs/editor/editor.main"], function () {
scrollBeyondLastLine: false scrollBeyondLastLine: false
}); });
var select = document.getElementById("themeselect"); var select = document.getElementById('themeselect');
var currentTheme = "vs"; var currentTheme = 'vs';
select.onchange = function () { select.onchange = function () {
currentTheme = select.options[select.selectedIndex].value; currentTheme = select.options[select.selectedIndex].value;
monaco.editor.setTheme(currentTheme); monaco.editor.setTheme(currentTheme);
@ -135,7 +134,7 @@ require(["vs/editor/editor.main"], function () {
function refreshLayout() { function refreshLayout() {
langEditor.layout(); langEditor.layout();
sampleEditor.layout(); sampleEditor.layout();
}; }
window.onresize = refreshLayout; window.onresize = refreshLayout;
// Switch to another sample // Switch to another sample
@ -170,5 +169,4 @@ require(["vs/editor/editor.main"], function () {
} }
sampleSelect.onchange = refreshSample; sampleSelect.onchange = refreshSample;
refreshSample(); // initialize initial text refreshSample(); // initialize initial text
}); // require }); // require

157
monaco-editor/website/playground.html
View file

@ -1,83 +1,108 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width" />
<head> <title>Monaco Editor Playground</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width">
<title>Monaco Editor Playground</title> <link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" />
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" />
<link data-inline="yes-please" href="./all.css" rel="stylesheet" type="text/css" />
<link data-inline="yes-please" href="./playground/spinner.css" rel="stylesheet" />
<link data-inline="yes-please" href="./playground/playground.css" rel="stylesheet" />
<link data-inline="yes-please" href="./lib/bootstrap-cosmo.css" rel="stylesheet" /> <link
<link data-inline="yes-please" href="./lib/bootstrap-responsive.min.css" rel="stylesheet" /> data-name="vs/editor/editor.main"
<link data-inline="yes-please" href="./all.css" rel="stylesheet" type="text/css" /> rel="stylesheet"
<link data-inline="yes-please" href="./playground/spinner.css" rel="stylesheet" /> href="../release/dev/vs/editor/editor.main.css"
<link data-inline="yes-please" href="./playground/playground.css" rel="stylesheet" /> />
</head>
<body class="playground-page">
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.js"></pre>
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.css"></pre>
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.html"></pre>
<link data-name="vs/editor/editor.main" rel="stylesheet" href="../release/dev/vs/editor/editor.main.css"> <a id="gh-link" href="https://github.com/Microsoft/monaco-editor"
</head> ><img width="149" height="149" alt="Fork me on GitHub" src="./fork.png"
<body class="playground-page"> /></a>
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.js"></pre>
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.css"></pre>
<pre data-preload="playground/new-samples/creating-the-editor/hello-world/sample.html"></pre>
<a id="gh-link" href="https://github.com/Microsoft/monaco-editor"><img <nav class="navbar navbar-inverse navbar-fixed-top">
width="149" height="149" alt="Fork me on GitHub" src="./fork.png"/></a> <div class="navbar-inner">
<div class="container">
<div class="logo">
<a href="index.html">Monaco Editor</a>
</div>
<!-- collapse button for smaller screens -->
<button
type="button"
class="btn btn-navbar"
data-toggle="collapse"
data-target=".nav-collapse"
>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<nav class="navbar navbar-inverse navbar-fixed-top"> <!-- navbar title -->
<div class="navbar-inner"> <div class="nav-collapse collapse">
<div class="container"> <ul class="nav">
<div class="logo"> <li><a class="nav-item" href="index.html">Home</a></li>
<a href="index.html">Monaco Editor</a> <li><a class="nav-item" href="api/index.html">API Doc</a></li>
</div> <li><a class="nav-item" href="playground.html">Playground</a></li>
<!-- collapse button for smaller screens --> <li><a class="nav-item" href="monarch.html">Monarch</a></li>
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <li>
<span class="icon-bar"></span> <a
<span class="icon-bar"></span> class="nav-item"
<span class="icon-bar"></span> target="_blank"
</button> href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz"
>Download {{version}}</a
<!-- navbar title --> >
<div class="nav-collapse collapse"> </li>
<ul class="nav"> </ul>
<li><a class="nav-item" href="index.html">Home</a></li> </div>
<li><a class="nav-item" href="api/index.html">API Doc</a></li>
<li><a class="nav-item" href="playground.html">Playground</a></li>
<li><a class="nav-item" href="monarch.html">Monarch</a></li>
<li><a class="nav-item" target="_blank" href="https://registry.npmjs.org/monaco-editor/-/monaco-editor-{{version}}.tgz">Download {{version}}</a></li>
</ul>
</div> </div>
</div> </div>
</nav>
<div id="loading">
<div class="spinner">
<div class="rect1"></div>
<div class="rect2"></div>
<div class="rect3"></div>
<div class="rect4"></div>
<div class="rect5"></div>
</div>
</div> </div>
</nav>
<div id="loading">
<div class="spinner">
<div class="rect1"></div>
<div class="rect2"></div>
<div class="rect3"></div>
<div class="rect4"></div>
<div class="rect5"></div>
</div>
</div>
<section id="playground"> <section id="playground"></section>
</section>
<footer class="container"> <footer class="container">
<hr> <hr />
<p class="text-center"> <p class="text-center">
<small>&copy; {{year}} Microsoft</small> <small>&copy; {{year}} Microsoft</small>
</p> </p>
</footer> </footer>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ=" crossorigin="anonymous"></script> <script
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js" integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8=" crossorigin="anonymous"></script> src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"
integrity="sha256-wS9gmOZBqsqWxgIVgA8Y9WcQOa7PgSIX+rPA0VL2rbQ="
crossorigin="anonymous"
></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.0/bootstrap.min.js"
integrity="sha256-u+l2mGjpmGK/mFgUncmMcFKdMijvV+J3odlDJZSNUu8="
crossorigin="anonymous"
></script>
<script>var require = { paths: { 'vs': '../release/dev/vs' } };</script> <script>
<script src="../release/dev/vs/loader.js"></script> var require = { paths: { vs: '../release/dev/vs' } };
<script src="../release/dev/vs/editor/editor.main.nls.js"></script> </script>
<script src="../release/dev/vs/editor/editor.main.js"></script> <script src="../release/dev/vs/loader.js"></script>
<script src="../release/dev/vs/editor/editor.main.nls.js"></script>
<script src="../release/dev/vs/editor/editor.main.js"></script>
<script data-inline="yes-please" src="./playground/new-samples/all.js"></script> <script data-inline="yes-please" src="./playground/new-samples/all.js"></script>
<script data-inline="yes-please" src="./playground/playground.js"></script> <script data-inline="yes-please" src="./playground/playground.js"></script>
</body> </body>
</html> </html>

364
monaco-editor/website/playground/new-samples/all.js
View file

@ -1,186 +1,184 @@
(function() { (function () {
var PLAY_SAMPLES = [
{
chapter: 'Creating the editor',
name: 'Hello world!',
id: 'creating-the-editor-hello-world',
path: 'creating-the-editor/hello-world'
},
{
chapter: 'Creating the editor',
name: 'Editor basic options',
id: 'creating-the-editor-editor-basic-options',
path: 'creating-the-editor/editor-basic-options'
},
{
chapter: 'Creating the editor',
name: 'Hard wrapping',
id: 'creating-the-editor-hard-wrapping',
path: 'creating-the-editor/hard-wrapping'
},
{
chapter: 'Creating the editor',
name: 'Syntax highlighting for HTML elements',
id: 'creating-the-editor-syntax-highlighting-for-html-elements',
path: 'creating-the-editor/syntax-highlighting-for-html-elements'
},
{
chapter: 'Interacting with the editor',
name: 'Adding a command to an editor instance',
id: 'interacting-with-the-editor-adding-a-command-to-an-editor-instance',
path: 'interacting-with-the-editor/adding-a-command-to-an-editor-instance'
},
{
chapter: 'Interacting with the editor',
name: 'Adding an action to an editor instance',
id: 'interacting-with-the-editor-adding-an-action-to-an-editor-instance',
path: 'interacting-with-the-editor/adding-an-action-to-an-editor-instance'
},
{
chapter: 'Interacting with the editor',
name: 'Revealing a position',
id: 'interacting-with-the-editor-revealing-a-position',
path: 'interacting-with-the-editor/revealing-a-position'
},
{
chapter: 'Interacting with the editor',
name: 'Rendering glyphs in the margin',
id: 'interacting-with-the-editor-rendering-glyphs-in-the-margin',
path: 'interacting-with-the-editor/rendering-glyphs-in-the-margin'
},
{
chapter: 'Interacting with the editor',
name: 'Line and Inline decorations',
id: 'interacting-with-the-editor-line-and-inline-decorations',
path: 'interacting-with-the-editor/line-and-inline-decorations'
},
{
chapter: 'Interacting with the editor',
name: 'Customizing the line numbers',
id: 'interacting-with-the-editor-customizing-the-line-numbers',
path: 'interacting-with-the-editor/customizing-the-line-numbers'
},
{
chapter: 'Interacting with the editor',
name: 'Listening to mouse events',
id: 'interacting-with-the-editor-listening-to-mouse-events',
path: 'interacting-with-the-editor/listening-to-mouse-events'
},
{
chapter: 'Interacting with the editor',
name: 'Listening to key events',
id: 'interacting-with-the-editor-listening-to-key-events',
path: 'interacting-with-the-editor/listening-to-key-events'
},
{
chapter: 'Customizing the appearence',
name: 'Exposed colors',
id: 'customizing-the-appearence-exposed-colors',
path: 'customizing-the-appearence/exposed-colors'
},
{
chapter: 'Customizing the appearence',
name: 'Scrollbars',
id: 'customizing-the-appearence-scrollbars',
path: 'customizing-the-appearence/scrollbars'
},
{
chapter: 'Customizing the appearence',
name: 'Tokens and colors',
id: 'customizing-the-appearence-tokens-and-colors',
path: 'customizing-the-appearence/tokens-and-colors'
},
{
chapter: 'Creating the DiffEditor',
name: 'Hello diff world!',
id: 'creating-the-diffeditor-hello-diff-world',
path: 'creating-the-diffeditor/hello-diff-world'
},
{
chapter: 'Creating the DiffEditor',
name: 'Multi-line example',
id: 'creating-the-diffeditor-multi-line-example',
path: 'creating-the-diffeditor/multi-line-example'
},
{
chapter: 'Creating the DiffEditor',
name: 'Inline Diff Example',
id: 'creating-the-diffeditor-inline-diff-example',
path: 'creating-the-diffeditor/inline-diff-example'
},
{
chapter: 'Creating the DiffEditor',
name: 'Navigating a Diff',
id: 'creating-the-diffeditor-navigating-a-diff',
path: 'creating-the-diffeditor/navigating-a-diff'
},
{
chapter: 'Extending Language Services',
name: 'Custom languages',
id: 'extending-language-services-custom-languages',
path: 'extending-language-services/custom-languages'
},
{
chapter: 'Extending Language Services',
name: 'Completion provider example',
id: 'extending-language-services-completion-provider-example',
path: 'extending-language-services/completion-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Codelens provider example',
id: 'extending-language-services-codelens-provider-example',
path: 'extending-language-services/codelens-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Color provider example',
id: 'extending-language-services-color-provider-example',
path: 'extending-language-services/color-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Symbols provider example',
id: 'extending-language-services-symbols-provider-example',
path: 'extending-language-services/symbols-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Folding provider example',
id: 'extending-language-services-folding-provider-example',
path: 'extending-language-services/folding-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Hover provider example',
id: 'extending-language-services-hover-provider-example',
path: 'extending-language-services/hover-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Semantic tokens provider example',
id: 'extending-language-services-semantic-tokens-provider-example',
path: 'extending-language-services/semantic-tokens-provider-example'
},
{
chapter: 'Extending Language Services',
name: 'Configure JavaScript defaults',
id: 'extending-language-services-configure-javascript-defaults',
path: 'extending-language-services/configure-javascript-defaults'
},
{
chapter: 'Extending Language Services',
name: 'Configure JSON defaults',
id: 'extending-language-services-configure-json-defaults',
path: 'extending-language-services/configure-json-defaults'
}
];
var PLAY_SAMPLES = [ if (typeof exports !== 'undefined') {
{ exports.PLAY_SAMPLES = PLAY_SAMPLES;
chapter: "Creating the editor", } else {
name: "Hello world!", self.PLAY_SAMPLES = PLAY_SAMPLES;
id: "creating-the-editor-hello-world",
path: "creating-the-editor/hello-world"
},
{
chapter: "Creating the editor",
name: "Editor basic options",
id: "creating-the-editor-editor-basic-options",
path: "creating-the-editor/editor-basic-options"
},
{
chapter: "Creating the editor",
name: "Hard wrapping",
id: "creating-the-editor-hard-wrapping",
path: "creating-the-editor/hard-wrapping"
},
{
chapter: "Creating the editor",
name: "Syntax highlighting for HTML elements",
id: "creating-the-editor-syntax-highlighting-for-html-elements",
path: "creating-the-editor/syntax-highlighting-for-html-elements"
},
{
chapter: "Interacting with the editor",
name: "Adding a command to an editor instance",
id: "interacting-with-the-editor-adding-a-command-to-an-editor-instance",
path: "interacting-with-the-editor/adding-a-command-to-an-editor-instance"
},
{
chapter: "Interacting with the editor",
name: "Adding an action to an editor instance",
id: "interacting-with-the-editor-adding-an-action-to-an-editor-instance",
path: "interacting-with-the-editor/adding-an-action-to-an-editor-instance"
},
{
chapter: "Interacting with the editor",
name: "Revealing a position",
id: "interacting-with-the-editor-revealing-a-position",
path: "interacting-with-the-editor/revealing-a-position"
},
{
chapter: "Interacting with the editor",
name: "Rendering glyphs in the margin",
id: "interacting-with-the-editor-rendering-glyphs-in-the-margin",
path: "interacting-with-the-editor/rendering-glyphs-in-the-margin"
},
{
chapter: "Interacting with the editor",
name: "Line and Inline decorations",
id: "interacting-with-the-editor-line-and-inline-decorations",
path: "interacting-with-the-editor/line-and-inline-decorations"
},
{
chapter: "Interacting with the editor",
name: "Customizing the line numbers",
id: "interacting-with-the-editor-customizing-the-line-numbers",
path: "interacting-with-the-editor/customizing-the-line-numbers"
},
{
chapter: "Interacting with the editor",
name: "Listening to mouse events",
id: "interacting-with-the-editor-listening-to-mouse-events",
path: "interacting-with-the-editor/listening-to-mouse-events"
},
{
chapter: "Interacting with the editor",
name: "Listening to key events",
id: "interacting-with-the-editor-listening-to-key-events",
path: "interacting-with-the-editor/listening-to-key-events"
},
{
chapter: "Customizing the appearence",
name: "Exposed colors",
id: "customizing-the-appearence-exposed-colors",
path: "customizing-the-appearence/exposed-colors"
},
{
chapter: "Customizing the appearence",
name: "Scrollbars",
id: "customizing-the-appearence-scrollbars",
path: "customizing-the-appearence/scrollbars"
},
{
chapter: "Customizing the appearence",
name: "Tokens and colors",
id: "customizing-the-appearence-tokens-and-colors",
path: "customizing-the-appearence/tokens-and-colors"
},
{
chapter: "Creating the DiffEditor",
name: "Hello diff world!",
id: "creating-the-diffeditor-hello-diff-world",
path: "creating-the-diffeditor/hello-diff-world"
},
{
chapter: "Creating the DiffEditor",
name: "Multi-line example",
id: "creating-the-diffeditor-multi-line-example",
path: "creating-the-diffeditor/multi-line-example"
},
{
chapter: "Creating the DiffEditor",
name: "Inline Diff Example",
id: "creating-the-diffeditor-inline-diff-example",
path: "creating-the-diffeditor/inline-diff-example"
},
{
chapter: "Creating the DiffEditor",
name: "Navigating a Diff",
id: "creating-the-diffeditor-navigating-a-diff",
path: "creating-the-diffeditor/navigating-a-diff"
},
{
chapter: "Extending Language Services",
name: "Custom languages",
id: "extending-language-services-custom-languages",
path: "extending-language-services/custom-languages"
},
{
chapter: "Extending Language Services",
name: "Completion provider example",
id: "extending-language-services-completion-provider-example",
path: "extending-language-services/completion-provider-example"
},
{
chapter: "Extending Language Services",
name: "Codelens provider example",
id: "extending-language-services-codelens-provider-example",
path: "extending-language-services/codelens-provider-example"
},
{
chapter: "Extending Language Services",
name: "Color provider example",
id: "extending-language-services-color-provider-example",
path: "extending-language-services/color-provider-example"
},
{
chapter: "Extending Language Services",
name: "Symbols provider example",
id: "extending-language-services-symbols-provider-example",
path: "extending-language-services/symbols-provider-example"
},
{
chapter: "Extending Language Services",
name: "Folding provider example",
id: "extending-language-services-folding-provider-example",
path: "extending-language-services/folding-provider-example"
},
{
chapter: "Extending Language Services",
name: "Hover provider example",
id: "extending-language-services-hover-provider-example",
path: "extending-language-services/hover-provider-example"
},
{
chapter: "Extending Language Services",
name: "Semantic tokens provider example",
id: "extending-language-services-semantic-tokens-provider-example",
path: "extending-language-services/semantic-tokens-provider-example"
},
{
chapter: "Extending Language Services",
name: "Configure JavaScript defaults",
id: "extending-language-services-configure-javascript-defaults",
path: "extending-language-services/configure-javascript-defaults"
},
{
chapter: "Extending Language Services",
name: "Configure JSON defaults",
id: "extending-language-services-configure-json-defaults",
path: "extending-language-services/configure-json-defaults"
} }
];
if (typeof exports !== 'undefined') {
exports.PLAY_SAMPLES = PLAY_SAMPLES
} else {
self.PLAY_SAMPLES = PLAY_SAMPLES;
}
})(); })();

2
monaco-editor/website/playground/new-samples/creating-the-diffeditor/hello-diff-world/sample.html
View file

@ -1 +1 @@
<div id="container" style="height:100%;"></div> <div id="container" style="height: 100%"></div>

6
monaco-editor/website/playground/new-samples/creating-the-diffeditor/hello-diff-world/sample.js
View file

@ -1,7 +1,7 @@
var originalModel = monaco.editor.createModel("heLLo world!", "text/plain"); var originalModel = monaco.editor.createModel('heLLo world!', 'text/plain');
var modifiedModel = monaco.editor.createModel("hello orlando!", "text/plain"); var modifiedModel = monaco.editor.createModel('hello orlando!', 'text/plain');
var diffEditor = monaco.editor.createDiffEditor(document.getElementById("container")); var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'));
diffEditor.setModel({ diffEditor.setModel({
original: originalModel, original: originalModel,
modified: modifiedModel modified: modifiedModel

2
monaco-editor/website/playground/new-samples/creating-the-diffeditor/inline-diff-example/sample.html
View file

@ -1 +1 @@
<div id="container" style="height:100%;"></div> <div id="container" style="height: 100%"></div>

12
monaco-editor/website/playground/new-samples/creating-the-diffeditor/inline-diff-example/sample.js
View file

@ -1,7 +1,13 @@
var originalModel = monaco.editor.createModel("This line is removed on the right.\njust some text\nabcd\nefgh\nSome more text", "text/plain"); var originalModel = monaco.editor.createModel(
var modifiedModel = monaco.editor.createModel("just some text\nabcz\nzzzzefgh\nSome more text\nThis line is removed on the left.", "text/plain"); '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"), { var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'), {
// You can optionally disable the resizing // You can optionally disable the resizing
enableSplitViewResizing: false, enableSplitViewResizing: false,

2
monaco-editor/website/playground/new-samples/creating-the-diffeditor/multi-line-example/sample.html
View file

@ -1 +1 @@
<div id="container" style="height:100%;"></div> <div id="container" style="height: 100%"></div>

12
monaco-editor/website/playground/new-samples/creating-the-diffeditor/multi-line-example/sample.js
View file

@ -1,7 +1,13 @@
var originalModel = monaco.editor.createModel("This line is removed on the right.\njust some text\nabcd\nefgh\nSome more text", "text/plain"); var originalModel = monaco.editor.createModel(
var modifiedModel = monaco.editor.createModel("just some text\nabcz\nzzzzefgh\nSome more text.\nThis line is removed on the left.", "text/plain"); '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"), { var diffEditor = monaco.editor.createDiffEditor(document.getElementById('container'), {
// You can optionally disable the resizing // You can optionally disable the resizing
enableSplitViewResizing: false enableSplitViewResizing: false
}); });

2
monaco-editor/website/playground/new-samples/creating-the-diffeditor/navigating-a-diff/sample.html
View file

@ -1 +1 @@
<div id="container" style="height:100%;"></div> <div id="container" style="height: 100%"></div>

15
monaco-editor/website/playground/new-samples/creating-the-diffeditor/navigating-a-diff/sample.js
View file

@ -1,9 +1,14 @@
// 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. // 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 originalModel = monaco.editor.createModel(
var modifiedModel = monaco.editor.createModel("just some Text\n\nHello World\n\nSome more changes", "text/plain"); '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'));
var diffEditor = monaco.editor.createDiffEditor(document.getElementById("container"));
diffEditor.setModel({ diffEditor.setModel({
original: originalModel, original: originalModel,
modified: modifiedModel modified: modifiedModel
@ -14,6 +19,6 @@ var navi = monaco.editor.createDiffNavigator(diffEditor, {
ignoreCharChanges: true // jump from line to line ignoreCharChanges: true // jump from line to line
}); });
window.setInterval(function() { window.setInterval(function () {
navi.next(); navi.next();
}, 2000); }, 2000);

2
monaco-editor/website/playground/new-samples/creating-the-editor/editor-basic-options/sample.html
View file

@ -1 +1 @@
<div id="container" style="height:100%;"></div> <div id="container" style="height: 100%"></div>

Some files were not shown because too many files have changed in this diff Show more