150 lines
16 KiB
Plaintext
150 lines
16 KiB
Plaintext
<Comment><!--</Comment><br/>
|
|
<Comment> </Comment><SPDX Tag>SPDX-FileCopyrightText:</SPDX Tag><Comment> 2024 James Zuccon</Comment><br/>
|
|
<Comment> </Comment><SPDX Tag>SPDX-License-Identifier:</SPDX Tag><SPDX Value> </SPDX Value><SPDX License>MIT</SPDX License><br/>
|
|
<Comment>--></Comment><br/>
|
|
<Comment><!--</Comment><br/>
|
|
<Comment> This uses HTML syntax as a base with some customizations for handling Vue-Template-specific syntax.</Comment><br/>
|
|
<Comment> It uses the following third-party scripts.</Comment><br/>
|
|
<Comment> Script:</Comment><br/>
|
|
<Comment> - JS (default - no lang attribute)</Comment><br/>
|
|
<Comment> - Typescript (lang="ts")</Comment><br/>
|
|
<Comment> Style:</Comment><br/>
|
|
<Comment> - CSS (default - no lang attribute)</Comment><br/>
|
|
<Comment> - SASS (lang="sass")</Comment><br/>
|
|
<Comment> - SCSS (lang="scss")</Comment><br/>
|
|
<Comment> </Comment><Alert Level 3>NOTE</Alert Level 3><Comment>: The tests below test attributes before/after the lang="..." attribute as doing this requires pushing a new context.</Comment><br/>
|
|
<Comment> In practice, a Vue Template would generally only contain zero or one <template>, <script> or <style> blocks.</Comment><br/>
|
|
<Comment>--></Comment><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Template without attributes --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>div</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment><!-- Vue event-shorthand should support "@" prefix --></Comment><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>p</Element><Attribute> @click</Attribute><Attribute Separator>=</Attribute Separator><Value>"test"</Value><Element Symbols>></Element Symbols><Normal Text>Testing HTML</Normal Text><Element Symbols></</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><Normal Text>{{ someVar }}</Normal Text><Element Symbols></</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment><!-- Important to test this as it is used at root also --></Comment><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> Nested template tag</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Element Symbols></</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols></</Element Symbols><Element>div</Element><Element Symbols>></Element Symbols><br/>
|
|
<Element Symbols></</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Template with attributes --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>template</Element><Attribute> loneAttribute attribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"value"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>div</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment><!-- Vue event-shorthand should support "@" prefix --></Comment><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>p</Element><Attribute> @click</Attribute><Attribute Separator>=</Attribute Separator><Value>"test"</Value><Element Symbols>></Element Symbols><Normal Text>Testing HTML</Normal Text><Element Symbols></</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><Normal Text>{{ someVar }}</Normal Text><Element Symbols></</Element Symbols><Element>p</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment><!-- Important to test this as it is used at root also --></Comment><br/>
|
|
<Normal Text> </Normal Text><Element Symbols><</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> Nested template tag</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Element Symbols></</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Element Symbols></</Element Symbols><Element>div</Element><Element Symbols>></Element Symbols><br/>
|
|
<Element Symbols></</Element Symbols><Element>template</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style without attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for CSS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Selector Tag>body</Selector Tag><Normal Text> </Normal Text><Block Symbol>{</Block Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Color>#333</Color><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Block Symbol>}</Block Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style with attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for CSS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Attribute> loneAttribute attribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"value"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Selector Tag>body</Selector Tag><Normal Text> </Normal Text><Block Symbol>{</Block Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Color>#333</Color><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Block Symbol>}</Block Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style lang="sass" without attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for SASS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Attribute> lang=</Attribute><Value>"sass"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment>// single-line comment to make sure it's SASS and not CSS</Comment><br/>
|
|
<Normal Text> </Normal Text><Variable>$font-stack</Variable><Normal Text>: Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><br/>
|
|
<Normal Text> </Normal Text><Variable>$primary-color</Variable><Normal Text>: </Normal Text><Color>#333</Color><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Normal Text> body</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> </Normal Text><Variable>$font-stack</Variable><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Variable>$primary-color</Variable><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style lang="sass" with attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for SASS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Attribute> beforeLangLoneAttribute beforeLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Attribute> lang=</Attribute><Value>"sass"</Value><Attribute> afterLangLoneAttribute afterLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment>// single-line comment to make sure it's SASS and not CSS</Comment><br/>
|
|
<Normal Text> </Normal Text><Variable>$font-stack</Variable><Normal Text>: Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><br/>
|
|
<Normal Text> </Normal Text><Variable>$primary-color</Variable><Normal Text>: </Normal Text><Color>#333</Color><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Normal Text> body</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> </Normal Text><Variable>$font-stack</Variable><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Variable>$primary-color</Variable><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style lang="scss" without attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for SCSS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Attribute> lang=</Attribute><Value>"scss"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment>// single-line comment to make sure it's SCSS and not CSS</Comment><br/>
|
|
<Normal Text> </Normal Text><Variable>$font-stack</Variable><Property Separator>:</Property Separator><Normal Text> Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><br/>
|
|
<Normal Text> </Normal Text><Variable>$primary-color</Variable><Normal Text>: </Normal Text><Color>#333</Color><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Normal Text> body </Normal Text><Block Symbol>{</Block Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> </Normal Text><Variable>$font-stack</Variable><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Variable>$primary-color</Variable><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Block Symbol>}</Block Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Style lang="scss" with attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for SCSS. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>style</Element><Attribute> beforeLangLoneAttribute beforeLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Attribute> lang=</Attribute><Value>"scss"</Value><Attribute> afterLangLoneAttribute afterLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text> </Normal Text><Comment>// single-line comment to make sure it's SCSS and not CSS</Comment><br/>
|
|
<Normal Text> </Normal Text><Variable>$font-stack</Variable><Property Separator>:</Property Separator><Normal Text> Helvetica</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Value>sans-serif</Value><br/>
|
|
<Normal Text> </Normal Text><Variable>$primary-color</Variable><Normal Text>: </Normal Text><Color>#333</Color><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Normal Text> body </Normal Text><Block Symbol>{</Block Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>font</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Number>100</Number><Unit>%</Unit><Normal Text> </Normal Text><Variable>$font-stack</Variable><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Property>color</Property><Property Separator>:</Property Separator><Normal Text> </Normal Text><Variable>$primary-color</Variable><Separator Symbol>;</Separator Symbol><br/>
|
|
<Normal Text> </Normal Text><Block Symbol>}</Block Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>style</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Script without attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for Javascript. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>script</Element><Element Symbols>></Element Symbols><br/>
|
|
<Comment>// Single-line comment</Comment><br/>
|
|
<Keyword>const</Keyword><Normal Text> a </Normal Text><Symbol>=</Symbol><Normal Text> </Normal Text><String>'abc'</String><Symbol>;</Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>script</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Script with attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for Javascript. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>script</Element><Attribute> loneAttribute attribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"value"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Comment>// Single-line comment</Comment><br/>
|
|
<Keyword>const</Keyword><Normal Text> a </Normal Text><Symbol>=</Symbol><Normal Text> </Normal Text><String>'abc'</String><Symbol>;</Symbol><br/>
|
|
<Element Symbols></</Element Symbols><Element>script</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Script lang="ts" without attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for Typescript. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>script</Element><Attribute> lang=</Attribute><Value>"ts"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Comment>// Single-line comment</Comment><br/>
|
|
<Keyword>const</Keyword><Normal Text> </Normal Text><Normal Text>a </Normal Text><Symbol>=</Symbol><Normal Text> </Normal Text><String>'abc'</String><Symbol>;</Symbol><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment>// Typescript</Comment><br/>
|
|
<Reserved>interface</Reserved><Normal Text> </Normal Text><Normal Text>SomeInterface </Normal Text><Normal Text>{</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Parameter>value</Parameter><Symbol>:</Symbol><Normal Text> </Normal Text><Types>string</Types><Symbol>;</Symbol><br/>
|
|
<Normal Text>}</Normal Text><br/>
|
|
<Element Symbols></</Element Symbols><Element>script</Element><Element Symbols>></Element Symbols><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment><!-- Script lang="ts" with attributes --></Comment><br/>
|
|
<Comment><!-- This references the syntax highlighting file for Typescript. --></Comment><br/>
|
|
<Element Symbols><</Element Symbols><Element>script</Element><Attribute> beforeLangLoneAttribute beforeLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Attribute> lang=</Attribute><Value>"ts"</Value><Attribute> afterLangLoneAttribute afterLangAttribute</Attribute><Attribute Separator>=</Attribute Separator><Value>"asd"</Value><Element Symbols>></Element Symbols><br/>
|
|
<Comment>// Single-line comment</Comment><br/>
|
|
<Keyword>const</Keyword><Normal Text> </Normal Text><Normal Text>a </Normal Text><Symbol>=</Symbol><Normal Text> </Normal Text><String>'abc'</String><Symbol>;</Symbol><br/>
|
|
<Normal Text></Normal Text><br/>
|
|
<Comment>// Typescript</Comment><br/>
|
|
<Reserved>interface</Reserved><Normal Text> </Normal Text><Normal Text>SomeInterface </Normal Text><Normal Text>{</Normal Text><br/>
|
|
<Normal Text> </Normal Text><Parameter>value</Parameter><Symbol>:</Symbol><Normal Text> </Normal Text><Types>string</Types><Symbol>;</Symbol><br/>
|
|
<Normal Text>}</Normal Text><br/>
|
|
<Element Symbols></</Element Symbols><Element>script</Element><Element Symbols>></Element Symbols><br/>
|