Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ packages/svelte2tsx/test/emitDts/samples/*/expected/**
packages/language-server/test/**/*.svelte
packages/language-server/test/**/testfiles/**/*.ts
packages/svelte-vscode/syntaxes/*.yaml
packages/svelte-vscode/test/*/samples/**/*
packages/typescript-plugin/src/**/*.js
packages/typescript-plugin/src/**/*.d.ts
**/dist
Expand Down
5 changes: 3 additions & 2 deletions packages/svelte-vscode/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"build": "npm run build:ts && npm run build:grammar",
"vscode:prepublish": "npm run build && npm prune --production",
"watch": "npm run build:grammar && tsc -w -p ./",
"test": "echo 'NOOP'"
"test": "npm run build:grammar && node test/grammar/test.js"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The reason for this test.js script is that we can just read the dummy directory to build the argument list instead of having to write a big long list in the package.json

},
"repository": {
"type": "git",
Expand Down Expand Up @@ -568,7 +568,8 @@
"@types/node": "^13.9.0",
"@types/vscode": "*",
"js-yaml": "^3.14.0",
"typescript": "*"
"typescript": "*",
"vscode-tmgrammar-test": "^0.0.11"
},
"dependencies": {
"lodash": "^4.17.21",
Expand Down
16 changes: 16 additions & 0 deletions packages/svelte-vscode/syntaxes/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,19 @@ A good document to read in more detail about TextMate: https://www.apeth.com/non
## Developing the grammar

The grammar for pug and markdown is written in JSON. You can edit that directly. The main grammar is written in `yaml` because that's easier to structure than JSON. However, VS Code expects a JSON format. Therefore you need to run the `build:grammar` script afterwards. This will produce a JSON version of the file. Afterwards you need to restart your extension window for the changes to take effect.

### Snapshot test for the grammar

The snapshot test is run by [vscode-textmate-test](https://github.com/PanAeon/vscode-tmgrammar-test). The `test` command called a node script to build the argument and execute the `vscode-textmate-test` command. If you updated the svelte grammar file, Be sure to add the test cases to the `test/sample` directory.

Then run the test to check if the update affect existing cases

```bash
yarn test
```

Update existing snapshot to match the changes

```bash
yarn test --updateSnapshot
```
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy CoffeeScript TextMate grammar for use in testing",
"scopeName": "source.coffee"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy CSS TextMate grammar for use in testing",
"scopeName": "source.css"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy HTML TextMate grammar for use in testing",
"scopeName": "text.html"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy JS TextMate grammar for use in testing",
"scopeName": "source.js"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy Less TextMate grammar for use in testing",
"scopeName": "source.css.less"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy Pug TextMate grammar for use in testing",
"scopeName": "text.pug"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy Sass TextMate grammar for use in testing",
"scopeName": "source.sass"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy Scss TextMate grammar for use in testing",
"scopeName": "source.css.scss"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy Stylus TextMate grammar for use in testing",
"scopeName": "source.stylus"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"comment": "Dummy TS TextMate grammar for use in testing",
"scopeName": "source.ts"
}
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<input use:action>
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
><input use:action>
#^ source.svelte meta.tag.void.svelte punctuation.definition.tag.begin.svelte
# ^^^^^ source.svelte meta.tag.void.svelte entity.name.tag.svelte
# ^ source.svelte meta.tag.void.svelte
# ^^^ source.svelte meta.tag.void.svelte meta.directive.use.svelte keyword.control.svelte
# ^ source.svelte meta.tag.void.svelte meta.directive.use.svelte punctuation.definition.keyword.svelte
# ^^^^^^ source.svelte meta.tag.void.svelte meta.directive.use.svelte variable.function.svelte
# ^ source.svelte meta.tag.void.svelte punctuation.definition.tag.begin.svelte
>
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{#each list as item, index (item)}
<li animate:flip>{item}</li>
{/each}

{#each list as item, index (item)}
<li animate:flip={{ delay: 500 }}>{item}</li>
{/each}
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
>{#each list as item, index (item)}
#^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte keyword.control.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte
# ^^ source.svelte meta.special.each.svelte meta.special.start.svelte keyword.control.as.svelte
# ^^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.separator.svelte
# ^^^^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.brace.round.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.brace.round.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
> <li animate:flip>{item}</li>
#^ source.svelte text.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte entity.name.tag.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte
# ^^^^^^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte keyword.other.animation.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte variable.function.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
# ^ source.svelte punctuation.section.embedded.begin.svelte
# ^^^^ source.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte punctuation.section.embedded.end.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte entity.name.tag.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
>{/each}
#^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.end.svelte keyword.control.svelte
# ^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
>{#each list as item, index (item)}
#^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte keyword.control.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte
# ^^ source.svelte meta.special.each.svelte meta.special.start.svelte keyword.control.as.svelte
# ^^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.separator.svelte
# ^^^^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.brace.round.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte meta.brace.round.svelte
# ^ source.svelte meta.special.each.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
> <li animate:flip={{ delay: 500 }}>{item}</li>
#^ source.svelte text.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte entity.name.tag.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte
# ^^^^^^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte keyword.other.animation.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte variable.function.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte punctuation.separator.key-value.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte punctuation.section.embedded.begin.svelte
# ^^^^^^^^^^^^^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte meta.directive.animate.svelte punctuation.section.embedded.end.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
# ^ source.svelte punctuation.section.embedded.begin.svelte
# ^^^^ source.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte punctuation.section.embedded.end.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
# ^^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte entity.name.tag.svelte
# ^ source.svelte meta.scope.tag.li.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
>{/each}
#^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.special.each.svelte meta.special.end.svelte keyword.control.svelte
# ^ source.svelte meta.special.each.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
{#await Promise.resolve('') then v}
{v}
{/await}

{#await Promise.resolve('')}
{:then}
{v}
{/await}

{#await Promise.reject('')}
{:catch err}
{err}
{/await}

{#await Promise.reject('') catch name}...{/await}
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
>{#await Promise.resolve('') then v}
#^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte
# ^^^^^^^^^^^^^^^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte
# ^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte keyword.control.flow.svelte
# ^^ source.svelte meta.special.await.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
> {v}
#^^^^ source.svelte text.svelte
# ^ source.svelte punctuation.section.embedded.begin.svelte
# ^ source.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte punctuation.section.embedded.end.svelte
>{/await}
#^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.end.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
>{#await Promise.resolve('')}
#^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte
# ^^^^^^^^^^^^^^^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
>{:then}
#^ source.svelte meta.special.then.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.then.svelte punctuation.definition.keyword.svelte
# ^^^^ source.svelte meta.special.then.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.then.svelte punctuation.definition.block.end.svelte
> {v}
#^^^^ source.svelte text.svelte
# ^ source.svelte punctuation.section.embedded.begin.svelte
# ^ source.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte punctuation.section.embedded.end.svelte
>{/await}
#^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.end.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
>{#await Promise.reject('')}
#^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte
# ^^^^^^^^^^^^^^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
>{:catch err}
#^ source.svelte meta.special.catch.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.catch.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.catch.svelte keyword.control.flow.svelte
# ^^^^ source.svelte meta.special.catch.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.catch.svelte punctuation.definition.block.end.svelte
> {err}
#^^^^ source.svelte text.svelte
# ^ source.svelte punctuation.section.embedded.begin.svelte
# ^^^ source.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte punctuation.section.embedded.end.svelte
>{/await}
#^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.end.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
>{#await Promise.reject('') catch name}...{/await}
#^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte
# ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ source.svelte meta.special.await.svelte meta.special.start.svelte meta.embedded.expression.svelte source.ts
# ^ source.svelte meta.special.await.svelte meta.special.start.svelte punctuation.definition.block.end.svelte
# ^^^ source.svelte text.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.begin.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.keyword.svelte
# ^^^^^ source.svelte meta.special.await.svelte meta.special.end.svelte keyword.control.flow.svelte
# ^ source.svelte meta.special.await.svelte meta.special.end.svelte punctuation.definition.block.end.svelte
>
7 changes: 7 additions & 0 deletions packages/svelte-vscode/test/grammar/samples/bind/input.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<script>
let value;
</script>

<input bind:value>

<Input bind:value />
Loading