Merge pull request #5568 from XavierChevalier/fix/sidebar-reactive-dismissable-property

fix(sidebar): dismissable property should still be reactive after mount

components/lib/sidebar/BaseSidebar.vue

@@ -52,6 +52,15 @@ export default {
         return {
             $parentInstance: this
         };
-    }
+    },
+    watch: {
+        dismissable(newValue) {
+            if (newValue) {
+                this.bindOutsideClickListener();
+            } else {
+                this.unbindOutsideClickListener();
+            }
+        }
+    },
 };
 </script>

components/lib/sidebar/Sidebar.spec.js

@@ -119,4 +119,12 @@ describe('Sidebar.vue', () => {
 
         expect(wrapper.vm.containerVisible).toBeFalsy();
     });
+
+    it('When component is mounted , dismissable property should still be reactive', async () => {
+        await wrapper.setProps({ dismissable: false, visible: true });
+
+        await wrapper.setProps({ dismissable: true });
+
+        expect(wrapper.vm.containerVisible).toBeTruthy();
+    });
 });