From 9ff62ff3236c39c59b2a038e381d6dedbaf84c07 Mon Sep 17 00:00:00 2001
From: Marco Pasqualetti <marco.pasqualetti@live.com>
Date: Thu, 3 Sep 2020 09:01:42 +0200
Subject: [PATCH] bugfix(ArrayObserver): #3343 - set this of callback using
 ractive

---
 src/Ractive/prototype/observe/Array.ts |  2 +-
 tests/browser/methods/observe.js       | 23 +++++++++++++++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/Ractive/prototype/observe/Array.ts b/src/Ractive/prototype/observe/Array.ts
index e0c9b79ff0..4c4050a900 100755
--- a/src/Ractive/prototype/observe/Array.ts
+++ b/src/Ractive/prototype/observe/Array.ts
@@ -53,7 +53,7 @@ export default class ArrayObserver {
 
   dispatch(): void {
     try {
-      this.callback(this.pending);
+      this.callback.call(this.ractive, this.pending);
     } catch (err) {
       warnIfDebug(
         `Failed to execute array observer callback for '${this.keypath}': ${err.message || err}`
diff --git a/tests/browser/methods/observe.js b/tests/browser/methods/observe.js
index 5ebbc282d3..de650a734f 100644
--- a/tests/browser/methods/observe.js
+++ b/tests/browser/methods/observe.js
@@ -1805,6 +1805,29 @@ export default function() {
     r.push('list', 1);
   });
 
+  test('array observers callback must have ractive instance as this (#3343)', t => {
+    t.expect(2);
+    let thisInsideObserveInitProperty;
+
+    const r = new Ractive({
+      data: { list: [] },
+      observe: {
+        list: {
+          handler() {
+            thisInsideObserveInitProperty = this;
+          },
+          array: true
+        }
+      }
+    });
+
+    r.observe('list', function() {
+      t.equal(this, r);
+    });
+
+    t.equal(r, thisInsideObserveInitProperty);
+  });
+
   test(`plain observers allow a hook to set the 'old' value`, t => {
     t.expect(4);