From 3457af332106f83c5b0ec8df0c6d02be1d3d37d9 Mon Sep 17 00:00:00 2001 From: Phil Pluckthun Date: Fri, 1 Mar 2024 15:27:34 +0100 Subject: [PATCH 1/4] =?UTF-8?q?fix:=20Fix=20vscode-graphql-syntax=E2=80=99?= =?UTF-8?q?s=20grammar=20to=20support=20string=20literals=20on=20separate?= =?UTF-8?q?=20lines=20(#3518)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Allow newlines after `graphql(` before start of query string * Fix mistaken reverse order of optional `(` and generic `<.*>` * Replace `(` in second match with newline one * Match graphql calls separately for string literals inside calls * Add missing endCaptures to new rule --- .changeset/famous-games-begin.md | 5 + .../grammars/graphql.js.json | 49 +- .../tests/__fixtures__/test-js.md | 44 ++ .../tests/__fixtures__/test.js | 13 +- .../tests/__fixtures__/test.ts | 20 +- .../__snapshots__/js-grammar.spec.ts.snap | 500 +++++++++++------- .../markdown-grammar.spec.ts.snap | 44 ++ 7 files changed, 459 insertions(+), 216 deletions(-) create mode 100644 .changeset/famous-games-begin.md diff --git a/.changeset/famous-games-begin.md b/.changeset/famous-games-begin.md new file mode 100644 index 00000000000..ae10f9af58d --- /dev/null +++ b/.changeset/famous-games-begin.md @@ -0,0 +1,5 @@ +--- +'vscode-graphql-syntax': patch +--- + +Fix TextMate grammar to support string literals that don’t immediately follow a function call's left-parenthesis (`(`). diff --git a/packages/vscode-graphql-syntax/grammars/graphql.js.json b/packages/vscode-graphql-syntax/grammars/graphql.js.json index 9c65649db9d..89704e30495 100644 --- a/packages/vscode-graphql-syntax/grammars/graphql.js.json +++ b/packages/vscode-graphql-syntax/grammars/graphql.js.json @@ -4,39 +4,33 @@ "patterns": [ { "contentName": "meta.embedded.block.graphql", - "begin": "\\s*+(?:(?:(Relay)\\??\\.)(QL)|(gql|graphql|graphql\\.experimental)|(/\\* GraphQL \\*/))\\s*\\(?\\s*(`|')", - "beginCaptures": { - "1": { - "name": "variable.other.class.js" - }, - "2": { - "name": "entity.name.function.tagged-template.js" - }, - "3": { - "name": "entity.name.function.tagged-template.js" - }, - "4": { - "name": "comment.graphql.js" - }, - "5": { - "name": "punctuation.definition.string.template.begin.js" - } - }, - "end": "(`|')", - "endCaptures": { - "0": { - "name": "punctuation.definition.string.template.end.js" - } - }, + "begin": "(?<=(?:(?:Relay\\??\\.)QL|gql|graphql|graphql\\.experimental)\\s*(?:<.*>)?\\s*)\\(", + "end": "\\)", "patterns": [ { - "include": "source.graphql" + "begin": "(`|')", + "end": "(`|')", + "beginCaptures": { + "0": { + "name": "punctuation.definition.string.template.begin.js" + } + }, + "endCaptures": { + "0": { + "name": "punctuation.definition.string.template.end.js" + } + }, + "patterns": [ + { + "include": "source.graphql" + } + ] } ] }, { "contentName": "meta.embedded.block.graphql", - "begin": "\\s*+(?:(?:(Relay)\\??\\.)(QL)|(gql|graphql|graphql\\.experimental))\\s*\\(?\\s*(?:<.*>)(`|')", + "begin": "\\s*+(?:(?:(?:(Relay)\\??\\.)(QL)|(gql|graphql|graphql\\.experimental)\\s*(?:<.*>)?\\s*)|(/\\* GraphQL \\*/))\\s*(`|')", "beginCaptures": { "1": { "name": "variable.other.class.js" @@ -48,6 +42,9 @@ "name": "entity.name.function.tagged-template.js" }, "4": { + "name": "comment.graphql.js" + }, + "5": { "name": "punctuation.definition.string.template.begin.js" } }, diff --git a/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md b/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md index 76601d15497..71ab2138dda 100644 --- a/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md +++ b/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md @@ -26,6 +26,50 @@ const Component = () => { }; ``` +```js +const variable = 1; + +const queryA = graphql(` + query { + something(arg: ${variable}) + } +`); + +const queryB = graphql( + ` + query { + something(arg: ${variable}) + } + ` +); + +const queryC = graphql( + 'query { something(arg: ${variable}) }' +); +``` + +```ts +const variable: number = 1; + +const queryA = graphql(` + query { + something(arg: ${variable}) + } +`); + +const queryB = graphql( + ` + query { + something(arg: ${variable}) + } + ` +); + +const queryC = graphql( + 'query { something(arg: ${variable}) }' +); +``` + ### svelte ```svelte diff --git a/packages/vscode-graphql-syntax/tests/__fixtures__/test.js b/packages/vscode-graphql-syntax/tests/__fixtures__/test.js index 1112c7adbfa..616f41dd27e 100644 --- a/packages/vscode-graphql-syntax/tests/__fixtures__/test.js +++ b/packages/vscode-graphql-syntax/tests/__fixtures__/test.js @@ -37,8 +37,18 @@ const graphql = graphql(` } `); +const graphql = graphql( + ` + query($id: ID!) { test } + `, + [var1, var2] +); + const query = /* GraphQL */ 'query { id } '; -const query = graphql('query { id } '); +const query = graphql('query($id: ID!) { id } '); +const query = graphql( + 'query($id: ID!) { test }' +); const queryWithInlineComment = `#graphql query { @@ -59,7 +69,6 @@ const queryWithInlineComment = `#graphql } } `; -// TODO: fix this const queryWithInlineComment = ` #graphql query { diff --git a/packages/vscode-graphql-syntax/tests/__fixtures__/test.ts b/packages/vscode-graphql-syntax/tests/__fixtures__/test.ts index b8e507901b6..5ae8cefaad3 100644 --- a/packages/vscode-graphql-syntax/tests/__fixtures__/test.ts +++ b/packages/vscode-graphql-syntax/tests/__fixtures__/test.ts @@ -25,9 +25,27 @@ const query = graphql` } `; -// TODO: Fix this const query = graphql('query { id }'); +const query = graphql( + 'query { id }' +); + +const query = graphql( + 'query { id }' +); + +const query = graphql(` + query { id } +`); + +const query = graphql( + ` + query { id } + `, + [var1, var2] +); + const queryWithInlineComment = `#graphql query { user(id: "5", name: boolean) { diff --git a/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap b/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap index 1be3ebd280f..3921a4178b3 100644 --- a/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap +++ b/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap @@ -108,11 +108,9 @@ something | meta.embedded.block.graphql meta.select \` | punctuation.definition.string.template.end.js ; | | -const graphql = | - | -graphql | entity.name.function.tagged-template.js +const graphql = graphql | ( | -\` | punctuation.definition.string.template.begin.js +\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js | meta.embedded.block.graphql """ | meta.embedded.block.graphql comment.line.graphql.js punctuation.whitespace.comment.leading.graphql this is a comment | meta.embedded.block.graphql comment.line.graphql.js @@ -147,8 +145,35 @@ something | meta.embedded.block.graphql meta.select } | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | punctuation.definition.string.template.end.js -); | +\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | + | +const graphql = graphql | +( | + | meta.embedded.block.graphql +\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql +( | meta.embedded.block.graphql meta.brace.round.graphql +$id | meta.embedded.block.graphql meta.variables.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.variables.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.variables.graphql +ID | meta.embedded.block.graphql meta.variables.graphql support.type.builtin.graphql +! | meta.embedded.block.graphql meta.variables.graphql keyword.operator.nulltype.graphql +) | meta.embedded.block.graphql meta.brace.round.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +test | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql +\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +, | meta.embedded.block.graphql + [var1, var2] | meta.embedded.block.graphql +) | +; | | const query = | | @@ -165,12 +190,17 @@ id | meta.embedded.block.graphql meta.select | meta.embedded.block.graphql ' | punctuation.definition.string.template.end.js ; | -const query = | - | -graphql | entity.name.function.tagged-template.js +const query = graphql | ( | -' | punctuation.definition.string.template.begin.js +' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql +( | meta.embedded.block.graphql meta.brace.round.graphql +$id | meta.embedded.block.graphql meta.variables.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.variables.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.variables.graphql +ID | meta.embedded.block.graphql meta.variables.graphql support.type.builtin.graphql +! | meta.embedded.block.graphql meta.variables.graphql keyword.operator.nulltype.graphql +) | meta.embedded.block.graphql meta.brace.round.graphql | meta.embedded.block.graphql meta.selectionset.graphql { | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql @@ -178,8 +208,30 @@ id | meta.embedded.block.graphql meta.select | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql -' | punctuation.definition.string.template.end.js -); | +' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | +const query = graphql | +( | + | meta.embedded.block.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +query | meta.embedded.block.graphql keyword.operation.graphql +( | meta.embedded.block.graphql meta.brace.round.graphql +$id | meta.embedded.block.graphql meta.variables.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.variables.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.variables.graphql +ID | meta.embedded.block.graphql meta.variables.graphql support.type.builtin.graphql +! | meta.embedded.block.graphql meta.variables.graphql keyword.operator.nulltype.graphql +) | meta.embedded.block.graphql meta.brace.round.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +test | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | | const queryWithInlineComment = | \` | taggedTemplates punctuation.definition.string.template.begin.js @@ -276,7 +328,6 @@ something | taggedTemplates meta.embedded.block.gra } | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql \` | taggedTemplates punctuation.definition.string.template.end.js ; | -// TODO: fix this | const queryWithInlineComment = \` | #graphql | query { | @@ -364,180 +415,255 @@ hello | meta.embedded.block.graphql meta.selectionset.graphql v `; exports[`inline.graphql grammar > should tokenize a simple typescript file 1`] = ` -/* eslint-disable */ | -// @ts-nocheck | - | -gql | entity.name.function.tagged-template.js -\` | punctuation.definition.string.template.begin.js - | meta.embedded.block.graphql -query | meta.embedded.block.graphql keyword.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql -( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql -id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql -5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql -, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql -) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | punctuation.definition.string.template.end.js -; | - | -graphql | entity.name.function.tagged-template.js - | -\` | punctuation.definition.string.template.begin.js - | meta.embedded.block.graphql -query | meta.embedded.block.graphql keyword.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql -( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql -id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql -5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql -, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql -) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | punctuation.definition.string.template.end.js -; | - | -const query = | - | -graphql | entity.name.function.tagged-template.js - | -\` | punctuation.definition.string.template.begin.js - | meta.embedded.block.graphql -query | meta.embedded.block.graphql keyword.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql -( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql -id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql -5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql -, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql -) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | punctuation.definition.string.template.end.js -; | - | -// TODO: Fix this | -const query = graphql('query { id }'); | - | -const queryWithInlineComment = | -\` | taggedTemplates punctuation.definition.string.template.begin.js -#graphql | taggedTemplates comment.line.graphql.js - | taggedTemplates meta.embedded.block.graphql -query | taggedTemplates meta.embedded.block.graphql keyword.operation.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql -{ | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql -user | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql variable.graphql -( | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql -id | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -" | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql -5 | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql -" | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql -, | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -name | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - boolean | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql -) | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -{ | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -something | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -} | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql -} | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | taggedTemplates punctuation.definition.string.template.end.js -; | - | -const queryWithLeadingComment = | - | -/* GraphQL */ | comment.graphql.js - | -\` | punctuation.definition.string.template.begin.js - | meta.embedded.block.graphql -query | meta.embedded.block.graphql keyword.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql -( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql -id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql -5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql -" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql -, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql -name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql -: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql - boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql -) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql - | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql - | meta.embedded.block.graphql meta.selectionset.graphql -} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | punctuation.definition.string.template.end.js -; | - | +/* eslint-disable */ | +// @ts-nocheck | + | +gql | entity.name.function.tagged-template.js +\` | punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql +( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql +5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql +, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql +) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | punctuation.definition.string.template.end.js +; | + | +graphql | entity.name.function.tagged-template.js + | +\` | punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql +( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql +5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql +, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql +) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | punctuation.definition.string.template.end.js +; | + | +const query = | + | +graphql | entity.name.function.tagged-template.js + | +\` | punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql +( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql +5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql +, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql +) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | punctuation.definition.string.template.end.js +; | + | +const query = graphql | +( | +' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | + | +const query = graphql | +( | + | meta.embedded.block.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | + | +const query = graphql | +( | + | meta.embedded.block.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | + | +const query = graphql | +( | +\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +) | +; | + | +const query = graphql | +( | + | meta.embedded.block.graphql +\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql +\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +, | meta.embedded.block.graphql + [var1, var2] | meta.embedded.block.graphql +) | +; | + | +const queryWithInlineComment = | +\` | taggedTemplates punctuation.definition.string.template.begin.js +#graphql | taggedTemplates comment.line.graphql.js + | taggedTemplates meta.embedded.block.graphql +query | taggedTemplates meta.embedded.block.graphql keyword.operation.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql +{ | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql +user | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql variable.graphql +( | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql +id | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +" | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql +5 | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql +" | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql +, | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +name | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + boolean | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql +) | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +{ | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +something | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +} | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql +} | taggedTemplates meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | taggedTemplates punctuation.definition.string.template.end.js +; | + | +const queryWithLeadingComment = | + | +/* GraphQL */ | comment.graphql.js + | +\` | punctuation.definition.string.template.begin.js + | meta.embedded.block.graphql +query | meta.embedded.block.graphql keyword.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +user | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql +( | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql +id | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.begin.graphql +5 | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql +" | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql string.quoted.double.graphql punctuation.definition.string.end.graphql +, | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.comma.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql +name | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql variable.parameter.graphql +: | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql punctuation.colon.graphql + boolean | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql constant.character.enum.graphql +) | meta.embedded.block.graphql meta.selectionset.graphql meta.arguments.graphql meta.brace.round.directive.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +{ | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +something | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql variable.graphql + | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql + | meta.embedded.block.graphql meta.selectionset.graphql +} | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql +\` | punctuation.definition.string.template.end.js +; | + | `; exports[`inline.graphql grammar > should tokenize a simple vue sfc comp file 1`] = ` diff --git a/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap b/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap index cb1a88a0b80..02b0aafc8b8 100644 --- a/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap +++ b/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap @@ -107,6 +107,50 @@ graphql\` | const Component = () => { | return
; | }; | +\`\`\` | + | +\`\`\`js | +const variable = 1; | + | +const queryA = graphql(\` | + query { | + something(arg: \${variable}) | + } | +\`); | + | +const queryB = graphql( | + \` | + query { | + something(arg: \${variable}) | + } | + \` | +); | + | +const queryC = graphql( | + 'query { something(arg: \${variable}) }' | +); | +\`\`\` | + | +\`\`\`ts | +const variable: number = 1; | + | +const queryA = graphql(\` | + query { | + something(arg: \${variable}) | + } | +\`); | + | +const queryB = graphql( | + \` | + query { | + something(arg: \${variable}) | + } | + \` | +); | + | +const queryC = graphql( | + 'query { something(arg: \${variable}) }' | +); | \`\`\` | | ### svelte | From 39cdd1e58d07f3b19df15d25750f623d1a67bd8a Mon Sep 17 00:00:00 2001 From: Phil Pluckthun Date: Sat, 2 Mar 2024 16:30:51 +0000 Subject: [PATCH 2/4] Remove lookbehind in grammar and add inner TS/JS source patterns MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Using a positive lookbehind can subtly break Textmate/VSCode’s syntax highlighting. The positive lookbehind (according to some online sources) can fail unexpectedly when they contain whitespace matches. This means that we should instead match explicitly, like the other patterns do. This means however, that we might match too much and I noticed that arguments to the function aren't highlighted correctly. According to the interpolation rule in `graphql.json` we now include patterns for JS/TS/etc as a fallback pattern. This fixes the issue and prevents the case where the rule was conflicting with normal JS/TS patterns in a different tmLanguage grammar. --- .../grammars/graphql.js.json | 23 +++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) diff --git a/packages/vscode-graphql-syntax/grammars/graphql.js.json b/packages/vscode-graphql-syntax/grammars/graphql.js.json index 89704e30495..245be94eb77 100644 --- a/packages/vscode-graphql-syntax/grammars/graphql.js.json +++ b/packages/vscode-graphql-syntax/grammars/graphql.js.json @@ -3,11 +3,22 @@ "injectionSelector": "L:(meta.embedded.block.javascript | meta.embedded.block.typescript | source.js | source.ts | source.tsx | source.vue | source.svelte | source.astro) -source.graphql -inline.graphql -string -comment", "patterns": [ { - "contentName": "meta.embedded.block.graphql", - "begin": "(?<=(?:(?:Relay\\??\\.)QL|gql|graphql|graphql\\.experimental)\\s*(?:<.*>)?\\s*)\\(", + "begin": "\\s*+(?:(Relay)\\??\\.)(QL)|(gql|graphql|graphql\\.experimental)\\s*(?:<.*>)?\\s*\\(", "end": "\\)", + "beginCaptures": { + "1": { + "name": "variable.other.class.js" + }, + "2": { + "name": "entity.name.function.tagged-template.js" + }, + "3": { + "name": "entity.name.function.tagged-template.js" + } + }, "patterns": [ { + "contentName": "meta.embedded.block.graphql", "begin": "(`|')", "end": "(`|')", "beginCaptures": { @@ -25,6 +36,14 @@ "include": "source.graphql" } ] + }, + { + "patterns": [ + { "include": "source.js" }, + { "include": "source.ts" }, + { "include": "source.js.jsx" }, + { "include": "source.tsx" } + ] } ] }, From 69cc36e01376f66a1d688b1fcabe7f6576ab2bb9 Mon Sep 17 00:00:00 2001 From: Phil Pluckthun Date: Sat, 2 Mar 2024 16:33:21 +0000 Subject: [PATCH 3/4] =?UTF-8?q?Update=20test=20and=20add=20new=20=E2=80=9C?= =?UTF-8?q?after=E2=80=9D=20variable=20case?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../tests/__fixtures__/test.js | 4 + .../__snapshots__/js-grammar.spec.ts.snap | 89 +++++++++++-------- 2 files changed, 55 insertions(+), 38 deletions(-) diff --git a/packages/vscode-graphql-syntax/tests/__fixtures__/test.js b/packages/vscode-graphql-syntax/tests/__fixtures__/test.js index 616f41dd27e..dbf470ebe42 100644 --- a/packages/vscode-graphql-syntax/tests/__fixtures__/test.js +++ b/packages/vscode-graphql-syntax/tests/__fixtures__/test.js @@ -37,6 +37,8 @@ const graphql = graphql(` } `); +const after1 = 'after'; + const graphql = graphql( ` query($id: ID!) { test } @@ -44,6 +46,8 @@ const graphql = graphql( [var1, var2] ); +const after2 = 'after'; + const query = /* GraphQL */ 'query { id } '; const query = graphql('query($id: ID!) { id } '); const query = graphql( diff --git a/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap b/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap index 3921a4178b3..12a88876f2a 100644 --- a/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap +++ b/packages/vscode-graphql-syntax/tests/__snapshots__/js-grammar.spec.ts.snap @@ -108,9 +108,10 @@ something | meta.embedded.block.graphql meta.select \` | punctuation.definition.string.template.end.js ; | | -const graphql = graphql | +const graphql = | +graphql | entity.name.function.tagged-template.js ( | -\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +\` | punctuation.definition.string.template.begin.js | meta.embedded.block.graphql """ | meta.embedded.block.graphql comment.line.graphql.js punctuation.whitespace.comment.leading.graphql this is a comment | meta.embedded.block.graphql comment.line.graphql.js @@ -145,14 +146,17 @@ something | meta.embedded.block.graphql meta.select } | meta.embedded.block.graphql meta.selectionset.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +\` | punctuation.definition.string.template.end.js ) | ; | | -const graphql = graphql | +const after1 = 'after'; | + | +const graphql = | +graphql | entity.name.function.tagged-template.js ( | - | meta.embedded.block.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | +\` | punctuation.definition.string.template.begin.js | meta.embedded.block.graphql query | meta.embedded.block.graphql keyword.operation.graphql ( | meta.embedded.block.graphql meta.brace.round.graphql @@ -169,12 +173,14 @@ test | meta.embedded.block.graphql meta.select | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js -, | meta.embedded.block.graphql - [var1, var2] | meta.embedded.block.graphql +\` | punctuation.definition.string.template.end.js +, | + [var1, var2] | ) | ; | | +const after2 = 'after'; | + | const query = | | /* GraphQL */ | comment.graphql.js @@ -190,9 +196,10 @@ id | meta.embedded.block.graphql meta.select | meta.embedded.block.graphql ' | punctuation.definition.string.template.end.js ; | -const query = graphql | +const query = | +graphql | entity.name.function.tagged-template.js ( | -' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +' | punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql ( | meta.embedded.block.graphql meta.brace.round.graphql $id | meta.embedded.block.graphql meta.variables.graphql variable.parameter.graphql @@ -208,13 +215,14 @@ id | meta.embedded.block.graphql meta.select | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +' | punctuation.definition.string.template.end.js ) | ; | -const query = graphql | +const query = | +graphql | entity.name.function.tagged-template.js ( | - | meta.embedded.block.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | +' | punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql ( | meta.embedded.block.graphql meta.brace.round.graphql $id | meta.embedded.block.graphql meta.variables.graphql variable.parameter.graphql @@ -229,7 +237,7 @@ ID | meta.embedded.block.graphql meta.variab test | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +' | punctuation.definition.string.template.end.js ) | ; | | @@ -518,9 +526,10 @@ something | meta.embedded.block.graphql meta.selectionset. \` | punctuation.definition.string.template.end.js ; | | -const query = graphql | -( | -' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +const query = | +graphql | entity.name.function.tagged-template.js +( | +' | punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql { | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql @@ -528,14 +537,15 @@ query | meta.embedded.block.graphql keyword.operation. id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +' | punctuation.definition.string.template.end.js ) | ; | | -const query = graphql | +const query = | +graphql | entity.name.function.tagged-template.js ( | - | meta.embedded.block.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | +' | punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql { | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql @@ -543,14 +553,15 @@ query | meta.embedded.block.graphql keyword.operation. id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +' | punctuation.definition.string.template.end.js ) | ; | | -const query = graphql | -( | - | meta.embedded.block.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +const query = | +graphql | entity.name.function.tagged-template.js +( | + | +' | punctuation.definition.string.template.begin.js query | meta.embedded.block.graphql keyword.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql { | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql @@ -558,13 +569,14 @@ query | meta.embedded.block.graphql keyword.operation. id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -' | meta.embedded.block.graphql punctuation.definition.string.template.end.js +' | punctuation.definition.string.template.end.js ) | ; | | -const query = graphql | +const query = | +graphql | entity.name.function.tagged-template.js ( | -\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js +\` | punctuation.definition.string.template.begin.js | meta.embedded.block.graphql query | meta.embedded.block.graphql keyword.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql @@ -573,14 +585,15 @@ query | meta.embedded.block.graphql keyword.operation. id | meta.embedded.block.graphql meta.selectionset.graphql variable.graphql | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js +\` | punctuation.definition.string.template.end.js ) | ; | | -const query = graphql | +const query = | +graphql | entity.name.function.tagged-template.js ( | - | meta.embedded.block.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.begin.js + | +\` | punctuation.definition.string.template.begin.js | meta.embedded.block.graphql query | meta.embedded.block.graphql keyword.operation.graphql | meta.embedded.block.graphql meta.selectionset.graphql @@ -590,9 +603,9 @@ id | meta.embedded.block.graphql meta.selectionset. | meta.embedded.block.graphql meta.selectionset.graphql } | meta.embedded.block.graphql meta.selectionset.graphql punctuation.operation.graphql | meta.embedded.block.graphql -\` | meta.embedded.block.graphql punctuation.definition.string.template.end.js -, | meta.embedded.block.graphql - [var1, var2] | meta.embedded.block.graphql +\` | punctuation.definition.string.template.end.js +, | + [var1, var2] | ) | ; | | From 1bd052b360655415f65bab05aeff5fd129ec1576 Mon Sep 17 00:00:00 2001 From: Phil Pluckthun Date: Mon, 11 Mar 2024 10:05:10 +0000 Subject: [PATCH 4/4] Revert changes to tests/__fixtures__/test-js.md --- .../tests/__fixtures__/test-js.md | 44 ------------------- .../markdown-grammar.spec.ts.snap | 44 ------------------- 2 files changed, 88 deletions(-) diff --git a/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md b/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md index 71ab2138dda..76601d15497 100644 --- a/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md +++ b/packages/vscode-graphql-syntax/tests/__fixtures__/test-js.md @@ -26,50 +26,6 @@ const Component = () => { }; ``` -```js -const variable = 1; - -const queryA = graphql(` - query { - something(arg: ${variable}) - } -`); - -const queryB = graphql( - ` - query { - something(arg: ${variable}) - } - ` -); - -const queryC = graphql( - 'query { something(arg: ${variable}) }' -); -``` - -```ts -const variable: number = 1; - -const queryA = graphql(` - query { - something(arg: ${variable}) - } -`); - -const queryB = graphql( - ` - query { - something(arg: ${variable}) - } - ` -); - -const queryC = graphql( - 'query { something(arg: ${variable}) }' -); -``` - ### svelte ```svelte diff --git a/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap b/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap index 02b0aafc8b8..cb1a88a0b80 100644 --- a/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap +++ b/packages/vscode-graphql-syntax/tests/__snapshots__/markdown-grammar.spec.ts.snap @@ -107,50 +107,6 @@ graphql\` | const Component = () => { | return
; | }; | -\`\`\` | - | -\`\`\`js | -const variable = 1; | - | -const queryA = graphql(\` | - query { | - something(arg: \${variable}) | - } | -\`); | - | -const queryB = graphql( | - \` | - query { | - something(arg: \${variable}) | - } | - \` | -); | - | -const queryC = graphql( | - 'query { something(arg: \${variable}) }' | -); | -\`\`\` | - | -\`\`\`ts | -const variable: number = 1; | - | -const queryA = graphql(\` | - query { | - something(arg: \${variable}) | - } | -\`); | - | -const queryB = graphql( | - \` | - query { | - something(arg: \${variable}) | - } | - \` | -); | - | -const queryC = graphql( | - 'query { something(arg: \${variable}) }' | -); | \`\`\` | | ### svelte |