diff --git a/packages/svelte/src/compiler/phases/1-parse/index.js b/packages/svelte/src/compiler/phases/1-parse/index.js index e318e9dba5..6c1aa6f871 100644 --- a/packages/svelte/src/compiler/phases/1-parse/index.js +++ b/packages/svelte/src/compiler/phases/1-parse/index.js @@ -299,8 +299,15 @@ class Finish { : /** @type {any} */ ({}); if (node.type === 'SvelteElement') { // a tag named in text is the literal Svelte writes by hand, quoted its way - if (node.tag.type === 'Literal' && node.tag.raw === node.tag.value) + if (node.tag.type === 'Literal' && node.tag.raw === node.tag.value) { + const { start, end } = /** @type {{ start: number; end: number }} */ (node.tag); + const quoted = this.template[start - 1] === '"' || this.template[start - 1] === "'"; + w.svelte_element_invalid_this({ + start: this.template.lastIndexOf('this', start), + end: quoted ? end + 1 : end + }); node.tag.raw = `'${node.tag.value}'`; + } node.metadata.expression = new ExpressionMetadata(); } if (node.type === 'SvelteComponent' || node.type === 'Component') { diff --git a/packages/svelte/tests/validator/samples/svelte-element-invalid-this/input.svelte b/packages/svelte/tests/validator/samples/svelte-element-invalid-this/input.svelte new file mode 100644 index 0000000000..347d5e8ae1 --- /dev/null +++ b/packages/svelte/tests/validator/samples/svelte-element-invalid-this/input.svelte @@ -0,0 +1,2 @@ + +text diff --git a/packages/svelte/tests/validator/samples/svelte-element-invalid-this/warnings.json b/packages/svelte/tests/validator/samples/svelte-element-invalid-this/warnings.json new file mode 100644 index 0000000000..143d9ec88f --- /dev/null +++ b/packages/svelte/tests/validator/samples/svelte-element-invalid-this/warnings.json @@ -0,0 +1,26 @@ +[ + { + "code": "svelte_element_invalid_this", + "message": "`this` should be an `{expression}`. Using a string attribute value will cause an error in future versions of Svelte", + "start": { + "column": 16, + "line": 1 + }, + "end": { + "column": 26, + "line": 1 + } + }, + { + "code": "svelte_element_invalid_this", + "message": "`this` should be an `{expression}`. Using a string attribute value will cause an error in future versions of Svelte", + "start": { + "column": 16, + "line": 2 + }, + "end": { + "column": 25, + "line": 2 + } + } +]