diff --git a/README.md b/README.md index 84f2b10c..767be4d8 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,7 @@ Colorization and configuration supports for multiple languages for the Monaco Ed * dockerfile * fsharp * go +* graphql * handlebars * html * ini diff --git a/scripts/bundle.js b/scripts/bundle.js index 614d5c83..76acc9e9 100644 --- a/scripts/bundle.js +++ b/scripts/bundle.js @@ -70,6 +70,7 @@ bundleOne('perl/perl'), bundleOne('powerquery/powerquery') bundleOne('azcli/azcli') bundleOne('apex/apex'); +bundleOne('graphql/graphql'); function bundleOne(moduleId, exclude) { requirejs.optimize({ diff --git a/src/graphql/graphql.contribution.ts b/src/graphql/graphql.contribution.ts new file mode 100644 index 00000000..a999c9e6 --- /dev/null +++ b/src/graphql/graphql.contribution.ts @@ -0,0 +1,19 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ +'use strict'; + +import { registerLanguage } from '../_.contribution'; + +// Allow for running under nodejs/requirejs in tests +const _monaco: typeof monaco = + typeof monaco === 'undefined' ? (self).monaco : monaco; + +registerLanguage({ + id: 'graphql', + extensions: ['.graphql', '.gql'], + aliases: ['GraphQL', 'graphql', 'gql'], + mimetypes: ['application/graphql'], + loader: () => _monaco.Promise.wrap(import('./graphql')), +}); diff --git a/src/graphql/graphql.test.ts b/src/graphql/graphql.test.ts new file mode 100644 index 00000000..20f112b4 --- /dev/null +++ b/src/graphql/graphql.test.ts @@ -0,0 +1,143 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +'use strict'; + +import { testTokenization } from '../test/testRunner'; + +testTokenization('graphql', [ + // Keywords + [{ + line: 'scalar Date', + tokens: [ + { startIndex: 0, type: 'keyword.gql' }, + { startIndex: 6, type: '' }, + { startIndex: 7, type: 'type.identifier.gql' }, + ] + }], + + // Root schema definition + [{ + line: 'schema { query: Query, mutation: Mutation subscription: Subscription }', + tokens: [ + { startIndex: 0, type: "keyword.gql" }, + { startIndex: 6, type: "" }, + { startIndex: 7, type: "delimiter.curly.gql" }, + { startIndex: 8, type: "" }, + { startIndex: 9, type: "keyword.gql" }, // this should be identifier + { startIndex: 14, type: "operator.gql" }, + { startIndex: 15, type: "" }, + { startIndex: 16, type: "type.identifier.gql" }, + { startIndex: 21, type: "delimiter.gql" }, + { startIndex: 22, type: "" }, + { startIndex: 23, type: "keyword.gql" }, // this should be identifier + { startIndex: 31, type: "operator.gql" }, + { startIndex: 32, type: "" }, + { startIndex: 33, type: "type.identifier.gql" }, + { startIndex: 41, type: "" }, + { startIndex: 42, type: "keyword.gql" }, // this should be identifier + { startIndex: 54, type: "operator.gql" }, + { startIndex: 55, type: "" }, + { startIndex: 56, type: "type.identifier.gql" }, + { startIndex: 68, type: "" }, + { startIndex: 69, type: "delimiter.curly.gql" }, + ] + }], + + [{ + line: `query testQuery($intValue:Int=3){value(arg:{string:"string" int:$intValue}){field1 field2}}`, + tokens: [ + { startIndex: 0, type: "keyword.gql" }, // 'query' + { startIndex: 5, type: "" }, // ' ' + { startIndex: 6, type: "identifier.gql" }, // 'testQuery' + { startIndex: 15, type: "delimiter.parenthesis.gql" }, // '(' + { startIndex: 16, type: "identifier.gql" }, // '$intValue' + { startIndex: 25, type: "operator.gql" }, // ':' + { startIndex: 26, type: "keyword.gql" }, // 'Int' + { startIndex: 29, type: "operator.gql" }, // '=' + { startIndex: 30, type: "number.gql" }, // '3' + { startIndex: 31, type: "delimiter.parenthesis.gql" }, // ')' + { startIndex: 32, type: "delimiter.curly.gql" }, // '{' + { startIndex: 33, type: "identifier.gql" }, // 'value' + { startIndex: 38, type: "delimiter.parenthesis.gql" }, // '(' + { startIndex: 39, type: "identifier.gql" }, // 'arg' + { startIndex: 42, type: "operator.gql" }, // ':' + { startIndex: 43, type: "delimiter.curly.gql" }, // '{' + { startIndex: 44, type: "identifier.gql" }, // 'string' + { startIndex: 50, type: "operator.gql" }, // ':' + { startIndex: 51, type: "string.quote.gql" }, // '"' + { startIndex: 52, type: "string.gql" }, // 'string' + { startIndex: 58, type: "string.quote.gql" }, // '"' + { startIndex: 59, type: "" }, // ' ' + { startIndex: 60, type: "identifier.gql" }, // 'int' + { startIndex: 63, type: "operator.gql" }, // ':' + { startIndex: 64, type: "identifier.gql" }, // '$intValue' + { startIndex: 73, type: "delimiter.curly.gql" }, // '}' + { startIndex: 74, type: "delimiter.parenthesis.gql" }, // ')' + { startIndex: 75, type: "delimiter.curly.gql" }, // '{' + { startIndex: 76, type: "identifier.gql" }, // 'field1' + { startIndex: 82, type: "" }, // ' ' + { startIndex: 83, type: "identifier.gql" }, // 'field2' + { startIndex: 89, type: "delimiter.curly.gql" }, // '}}' + ], + }], + + // More complex test: + // """ + // Node interface + // - allows (re)fetch arbitrary entity only by ID + // """ + // interface Node { + // id: ID! + // } + [ + { + line: '"""', + tokens: [ + { startIndex: 0, type: "string.gql" } + ], + }, + { + line: 'This is MarkDown', + tokens: [ + { startIndex: 0, type: "" } + ], + }, + { + line: '"""', + tokens: [ + { startIndex: 0, type: "string.gql" } + ], + }, + { + line: 'interface Node {', + tokens: [ + { startIndex: 0, type: "keyword.gql" }, + { startIndex: 9, type: "" }, + { startIndex: 10, type: "type.identifier.gql" }, + { startIndex: 14, type: "" }, + { startIndex: 15, type: "delimiter.curly.gql" }, + ], + }, + { + line: ' id: ID!', + tokens: [ + { startIndex: 0, type: "" }, + { startIndex: 2, type: "identifier.gql" }, + { startIndex: 4, type: "operator.gql" }, + { startIndex: 5, type: "" }, + { startIndex: 6, type: "keyword.gql" }, + { startIndex: 8, type: "operator.gql" }, + ], + }, + { + line: '}', + tokens: [ + { startIndex: 0, type: "delimiter.curly.gql", }, + ], + }, + ] + +]); diff --git a/src/graphql/graphql.ts b/src/graphql/graphql.ts new file mode 100644 index 00000000..5d4cbd07 --- /dev/null +++ b/src/graphql/graphql.ts @@ -0,0 +1,141 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +'use strict'; + +import IRichLanguageConfiguration = monaco.languages.LanguageConfiguration; +import ILanguage = monaco.languages.IMonarchLanguage; + +export const conf: IRichLanguageConfiguration = { + comments: { + lineComment: '#' + }, + brackets: [ + ['{', '}'], + ['[', ']'], + ['(', ')'] + ], + autoClosingPairs: [ + { open: '{', close: '}' }, + { open: '[', close: ']' }, + { open: '(', close: ')' }, + { open: '"""', close: '"""', notIn: ['string', 'comment'] }, + { open: '"', close: '"', notIn: ['string', 'comment'] }, + ], + surroundingPairs: [ + { open: '{', close: '}' }, + { open: '[', close: ']' }, + { open: '(', close: ')' }, + { open: '"""', close: '"""' }, + { open: '"', close: '"' }, + ], + folding: { + offSide: true + } +}; + +export const language = { + // Set defaultToken to invalid to see what you do not tokenize yet + defaultToken: 'invalid', + tokenPostfix: '.gql', + + keywords: [ + 'null', 'true', 'false', + 'query', 'mutation', 'subscription', + 'extend', 'schema', 'directive', + 'scalar', 'type', 'interface', 'union', 'enum', 'input', 'implements', + 'fragment', 'on', + ], + + typeKeywords: ['Int', 'Float', 'String', 'Boolean', 'ID'], + + directiveLocations: [ + 'SCHEMA', 'SCALAR', 'OBJECT', 'FIELD_DEFINITION', 'ARGUMENT_DEFINITION', + 'INTERFACE', 'UNION', 'ENUM', 'ENUM_VALUE', 'INPUT_OBJECT', 'INPUT_FIELD_DEFINITION', + 'QUERY', 'MUTATION', 'SUBSCRIPTION', 'FIELD', 'FRAGMENT_DEFINITION', + 'FRAGMENT_SPREAD', 'INLINE_FRAGMENT', 'VARIABLE_DEFINITION', + ], + + operators: ['=', '!', '?', ':', '&', '|'], + + // we include these common regular expressions + symbols: /[=!?:&|]+/, + + // https://facebook.github.io/graphql/draft/#sec-String-Value + escapes: /\\(?:["\\\/bfnrt]|u[0-9A-Fa-f]{4})/, + + // The main tokenizer for our languages + tokenizer: { + root: [ + // identifiers and keywords + [ + /[a-z_$][\w$]*/, + { + cases: { + '@keywords': 'keyword', + '@default': 'identifier', + }, + }, + ], + [ + /[A-Z][\w\$]*/, + { + cases: { + '@typeKeywords': 'keyword', + '@default': 'type.identifier', + }, + }, + ], // to show class names nicely + + // whitespace + { include: '@whitespace' }, + + // delimiters and operators + [/[{}()\[\]]/, '@brackets'], + [ + /@symbols/, + { cases: { '@operators': 'operator', '@default': '' } }, + ], + + // @ annotations. + // As an example, we emit a debugging log message on these tokens. + // Note: message are supressed during the first load -- change some lines to see them. + [ + /@\s*[a-zA-Z_\$][\w\$]*/, + { token: 'annotation', log: 'annotation token: $0' }, + ], + + // numbers + [/\d*\.\d+([eE][\-+]?\d+)?/, 'number.float'], + [/0[xX][0-9a-fA-F]+/, 'number.hex'], + [/\d+/, 'number'], + + // delimiter: after number because of .\d floats + [/[;,.]/, 'delimiter'], + + [/"""/, + { token: 'string', next: '@mlstring', nextEmbedded: 'markdown' } + ], + + // strings + [/"([^"\\]|\\.)*$/, 'string.invalid'], // non-teminated string + [/"/, { token: 'string.quote', bracket: '@open', next: '@string' }], + ], + + mlstring: [ + [/[^"]+/, 'string'], + ['"""', { token: 'string', next: '@pop', nextEmbedded: '@pop' }] + ], + + string: [ + [/[^\\"]+/, 'string'], + [/@escapes/, 'string.escape'], + [/\\./, 'string.escape.invalid'], + [/"/, { token: 'string.quote', bracket: '@close', next: '@pop' }], + ], + + whitespace: [[/[ \t\r\n]+/, ''], [/#.*$/, 'comment']], + }, +}; diff --git a/src/monaco.contribution.ts b/src/monaco.contribution.ts index ae9aad59..134795de 100644 --- a/src/monaco.contribution.ts +++ b/src/monaco.contribution.ts @@ -53,3 +53,4 @@ import './shell/shell.contribution'; import './perl/perl.contribution'; import './azcli/azcli.contribution'; import './apex/apex.contribution'; +import './graphql/graphql.contribution'; diff --git a/test/setup.js b/test/setup.js index fe8c8534..e7ed6372 100644 --- a/test/setup.js +++ b/test/setup.js @@ -38,6 +38,7 @@ define(['require'], function () { 'release/dev/dockerfile/dockerfile.test', 'release/dev/fsharp/fsharp.test', 'release/dev/go/go.test', + 'release/dev/graphql/graphql.test', 'release/dev/handlebars/handlebars.test', 'release/dev/html/html.test', 'release/dev/java/java.test',