Merge pull request #136 from grapoza/fixups-for-previous-fubars

Fixes the last of the child/selection issues

Author: grapoza

package.json

@@ -3,7 +3,7 @@
   "description": "Yet another Vue treeview component.",
   "author": "Gregg Rapoza <grapoza@gmail.com>",
   "license": "MIT",
-  "version": "1.3.6",
+  "version": "1.3.7",
   "browser": "index.js",
   "repository": {
     "url": "https://github.com/grapoza/vue-tree",

src/mixins/TreeViewAria.js

@@ -69,15 +69,22 @@ export default {
       if (firstSelectedNode === null && this.focusableNodeModel.selectable && this.selectionMode === 'selectionFollowsFocus') {
         this.focusableNodeModel.state.selected = true;
       }
+
+      this.$_treeViewNode_enforceSelectionMode();
     }
   },
   watch: {
-    selectionMode(newValue) {
-      if (newValue === 'single') {
+    selectionMode() {
+      this.$_treeViewNode_enforceSelectionMode();
+    }
+  },
+  methods: {
+    $_treeViewNode_enforceSelectionMode() {
+      if (this.selectionMode === 'single') {
         // This is in TreeViewAria instead of TreeView because the default mixin merge strategy only keeps one 'watch' per prop.
         this.$_treeView_enforceSingleSelectionMode();
       }
-      else if (newValue === 'selectionFollowsFocus') {
+      else if (this.selectionMode === 'selectionFollowsFocus') {
         // Make sure the actual focused item is selected if the mode changes, and deselect all others
         this.$_treeView_depthFirstTraverse((node) => {
           let idPropName = this.$_treeView_getIdPropName(node);
@@ -92,9 +99,7 @@ export default {
           }
         });
       }
-    }
-  },
-  methods: {
+    },
     $_treeViewAria_handleFocusableChange(newNodeModel) {
       if (this.focusableNodeModel) {
         this.focusableNodeModel.focusable = false;

src/mixins/TreeViewNodeAria.js

@@ -156,8 +156,9 @@ export default {
       }
       else {
         let lastModel = this.model[this.childrenPropName][childIndex - 1];
-        while (lastModel.children.length > 0 && lastModel.expandable && lastModel.state.expanded) {
-          lastModel = lastModel[this.$_treeViewNode_getChildrenPropNameForNode(lastModel)][lastModel.children.length - 1];
+        let lastModelChildren = lastModel[this.$_treeViewNode_getChildrenPropNameForNode(lastModel)];
+        while (lastModelChildren.length > 0 && lastModel.expandable && lastModel.state.expanded) {
+          lastModel = lastModelChildren[lastModelChildren.length - 1];
         }
 
         lastModel.focusable = true;
@@ -168,8 +169,9 @@ export default {
       // If the node has a next sibling, focus that
       // Otherwise, punt this up to this node's parent
       let childIndex = this.model[this.childrenPropName].indexOf(childNode);
-      if (!ignoreChild && childNode.children.length > 0 && childNode.expandable && childNode.state.expanded) {
-        childNode[this.$_treeViewNode_getChildrenPropNameForNode(childNode)][0].focusable = true;
+      let childNodeChildrenPropName = this.$_treeViewNode_getChildrenPropNameForNode(childNode);
+      if (!ignoreChild && childNode[childNodeChildrenPropName].length > 0 && childNode.expandable && childNode.state.expanded) {
+        childNode[childNodeChildrenPropName][0].focusable = true;
       }
       else if (childIndex < this.model[this.childrenPropName].length - 1) {
         this.model[this.childrenPropName][childIndex + 1].focusable = true;