From dc82f0aa7903ba41d770b10a128401b2c20f2edc Mon Sep 17 00:00:00 2001
From: raivaibhav <raivaibhav08@gmail.com>
Date: Sat, 2 Oct 2021 23:07:28 +0530
Subject: [PATCH] Fix 6794: var scope should not extend outside the reactive
 block

Fixes: https://github.com/sveltejs/svelte/issues/6794
---
 src/compiler/compile/Component.ts             | 13 ++++++++++++
 src/compiler/compile/compiler_errors.ts       |  4 ++++
 .../invalid-reactive-var-1/errors.json        |  7 +++++++
 .../invalid-reactive-var-1/input.svelte       | 20 +++++++++++++++++++
 .../invalid-reactive-var-2/errors.json        |  7 +++++++
 .../invalid-reactive-var-2/input.svelte       |  8 ++++++++
 .../samples/valid-reactive-vars/errors.json   |  1 +
 .../samples/valid-reactive-vars/input.svelte  | 18 +++++++++++++++++
 8 files changed, 78 insertions(+)
 create mode 100644 test/validator/samples/invalid-reactive-var-1/errors.json
 create mode 100644 test/validator/samples/invalid-reactive-var-1/input.svelte
 create mode 100644 test/validator/samples/invalid-reactive-var-2/errors.json
 create mode 100644 test/validator/samples/invalid-reactive-var-2/input.svelte
 create mode 100644 test/validator/samples/valid-reactive-vars/errors.json
 create mode 100644 test/validator/samples/valid-reactive-vars/input.svelte

diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts
index 2f8874de7a..1ffd8a32c6 100644
--- a/src/compiler/compile/Component.ts
+++ b/src/compiler/compile/Component.ts
@@ -1303,10 +1303,23 @@ export default class Component {
 				const module_dependencies = new Set<string>();
 
 				let scope = this.instance_scope;
+				const {declarations: outset_scope_decalarations} = this.instance_scope;
 				const map = this.instance_scope_map;
 
 				walk(node.body, {
 					enter(node: Node, parent) {
+						if (node.type === 'VariableDeclaration' && node.kind === 'var') {
+							const names = extract_names(node.declarations[0].id);
+							const is_var_in_outset = names.every((i: string) => {
+								if (outset_scope_decalarations.has(i)) {
+									const varNode = outset_scope_decalarations.get(i);
+									return varNode === node;
+								}
+							});
+							if (is_var_in_outset) {
+								return component.error(node as any, compiler_errors.invalid_var_declaration);
+							}
+						}
 						if (map.has(node)) {
 							scope = map.get(node);
 						}
diff --git a/src/compiler/compile/compiler_errors.ts b/src/compiler/compile/compiler_errors.ts
index c1a7d8bc5c..d88134b880 100644
--- a/src/compiler/compile/compiler_errors.ts
+++ b/src/compiler/compile/compiler_errors.ts
@@ -281,5 +281,9 @@ export default {
 	invalid_component_style_directive: {
 		code: 'invalid-component-style-directive',
 		message: 'Style directives cannot be used on components'
+	},
+	invalid_var_declaration: {
+		code: 'invalid_var_declaration',
+		message: '"var" scope should not extend outside the reactive block'
 	}
 };
diff --git a/test/validator/samples/invalid-reactive-var-1/errors.json b/test/validator/samples/invalid-reactive-var-1/errors.json
new file mode 100644
index 0000000000..1390a0e6ab
--- /dev/null
+++ b/test/validator/samples/invalid-reactive-var-1/errors.json
@@ -0,0 +1,7 @@
+[{
+	"code": "invalid_var_declaration",
+	"message": "\"var\" scope should not extend outside the reactive block",
+  "start": { "line": 14, "column": 7, "character": 204 },
+  "end": { "line": 14, "column": 16, "character": 213 },
+  "pos": 204
+}]
diff --git a/test/validator/samples/invalid-reactive-var-1/input.svelte b/test/validator/samples/invalid-reactive-var-1/input.svelte
new file mode 100644
index 0000000000..7fe774959d
--- /dev/null
+++ b/test/validator/samples/invalid-reactive-var-1/input.svelte
@@ -0,0 +1,20 @@
+<script>
+	var a;
+	var {a, b: [d, f], c}= {a: 1, b: [1, 2], c: 2};
+	$: {
+		function one() {
+			var a = 'a';
+			function two() {
+				var a = 'b';
+				return a;
+			}
+			return two();
+		}
+		a = one();
+		for (var i = 0; i<5; i ++ ) {
+			// Todo
+		}
+	}
+</script>
+
+<h1>Hello {a}</h1>
diff --git a/test/validator/samples/invalid-reactive-var-2/errors.json b/test/validator/samples/invalid-reactive-var-2/errors.json
new file mode 100644
index 0000000000..1a4ef816be
--- /dev/null
+++ b/test/validator/samples/invalid-reactive-var-2/errors.json
@@ -0,0 +1,7 @@
+[{
+	"code": "invalid_var_declaration",
+	"message": "\"var\" scope should not extend outside the reactive block",
+  "start": { "line": 4, "column": 2, "character": 32 },
+  "end": { "line": 4, "column": 50, "character": 80 },
+  "pos": 32
+}]
diff --git a/test/validator/samples/invalid-reactive-var-2/input.svelte b/test/validator/samples/invalid-reactive-var-2/input.svelte
new file mode 100644
index 0000000000..b3a1c4272c
--- /dev/null
+++ b/test/validator/samples/invalid-reactive-var-2/input.svelte
@@ -0,0 +1,8 @@
+<script>
+	$: {
+		let f = 'f';
+		var {a, b: [c, d], e} = {a: 1, b: [2, 3], e: 4};
+	}
+</script>
+
+<h1>Hello</h1>
diff --git a/test/validator/samples/valid-reactive-vars/errors.json b/test/validator/samples/valid-reactive-vars/errors.json
new file mode 100644
index 0000000000..fe51488c70
--- /dev/null
+++ b/test/validator/samples/valid-reactive-vars/errors.json
@@ -0,0 +1 @@
+[]
diff --git a/test/validator/samples/valid-reactive-vars/input.svelte b/test/validator/samples/valid-reactive-vars/input.svelte
new file mode 100644
index 0000000000..0052101bd9
--- /dev/null
+++ b/test/validator/samples/valid-reactive-vars/input.svelte
@@ -0,0 +1,18 @@
+<script>
+  var name = 'name';
+  var c = 'cc';
+  let d = 'd';
+  $: {
+      function a() {
+        function b() {
+          var c = 'c';
+          return c;
+        }
+        return b;
+      }
+    let d = 'dd';
+    name = a()();
+  }
+</script>
+
+<h1>Hello {name}</h1>