Merge pull request #15 from Lodin/fix/context-regression

Fix context regression in toggle function

Author: Lodin

__tests__/FixedSizeTree.spec.tsx

@@ -428,7 +428,11 @@ describe('FixedSizeTree', () => {
         const foo1 = component.state('records')['foo-1'];
 
         treeWalkerSpy.mockClear();
-        await foo1.toggle();
+
+        // Imitate the behavior of Node component where toggle is sent without
+        // context
+        const {toggle} = foo1;
+        await toggle();
 
         expect(treeWalkerSpy).toHaveBeenCalledWith(false);
         expect(foo1.isOpen).toBeFalsy();

__tests__/VariableSizeTree.spec.tsx

@@ -478,7 +478,11 @@ describe('VariableSizeTree', () => {
         foo1.height = 50;
 
         treeWalkerSpy.mockClear();
-        await foo1.toggle();
+
+        // Imitate the behavior of Node component where toggle is sent without
+        // context
+        const {toggle} = foo1;
+        await toggle();
 
         expect(treeWalkerSpy).toHaveBeenCalledWith(false);
         expect(foo1.height).toBe(defaultHeight);

src/FixedSizeTree.tsx

@@ -70,17 +70,19 @@ const computeTree = <T extends {}>(
     } else {
       ({id} = value);
       const {isOpenByDefault} = value;
-      const record = records[id as string];
+      let record = records[id as string];
 
       if (!record) {
-        records[id as string] = {
+        record = {
           data: value,
           isOpen: isOpenByDefault,
-          async toggle(this: FixedSizeNodeRecord<T>): Promise<void> {
-            this.isOpen = !this.isOpen;
-            await recomputeTree({refreshNodes: this.isOpen});
+          async toggle(): Promise<void> {
+            record.isOpen = !record.isOpen;
+            await recomputeTree({refreshNodes: record.isOpen});
           },
         };
+
+        records[id as string] = record;
       } else {
         record.data = value;
 

src/VariableSizeTree.tsx

@@ -105,29 +105,27 @@ const computeTree = <T extends {}>(
     } else {
       ({id} = value);
       const {defaultHeight, isOpenByDefault} = value;
-      const record = records[id as string];
+      let record = records[id as string];
 
       if (!record) {
-        records[id as string] = {
+        record = {
           data: value,
           height: defaultHeight,
           isOpen: isOpenByDefault,
-          resize(
-            this: VariableSizeNodeRecord<T>,
-            height: number,
-            shouldForceUpdate?: boolean,
-          ): void {
-            this.height = height;
-            resetAfterId(this.data.id, shouldForceUpdate);
+          resize(height: number, shouldForceUpdate?: boolean): void {
+            record.height = height;
+            resetAfterId(record.data.id, shouldForceUpdate);
           },
-          async toggle(this: VariableSizeNodeRecord<T>): Promise<void> {
-            this.isOpen = !this.isOpen;
+          async toggle(): Promise<void> {
+            record.isOpen = !record.isOpen;
             await recomputeTree({
-              refreshNodes: this.isOpen,
+              refreshNodes: record.isOpen,
               useDefaultHeight: true,
             });
           },
         };
+
+        records[id as string] = record;
       } else {
         record.data = value;