Merge branch 'master' into master

Author: David-Desmaisons

README.md

@@ -91,6 +91,11 @@ npm i -S vuedraggable@next
         components: {
             draggable,
         },
+        data() {
+          return {
+            drag: false,
+          }
+        },
   ...
 ```
 

src/util/tags.js

@@ -127,11 +127,7 @@ function isTransition(name) {
 }
 
 function isHtmlAttribute(value) {
-  return (
-    ["id", "class", "style"].includes(value) ||
-    value.startsWith("data-") ||
-    value.startsWith("on")
-  );
+  return ["id", "class", "role", "style"].includes(value) || value.startsWith("data-") || value.startsWith("aria-");
 }
 
 export { isHtmlTag, isHtmlAttribute, isTransition };

src/vuedraggable.js

@@ -165,6 +165,7 @@ const draggableComponent = defineComponent({
     $attrs: {
       handler(newOptionValue) {
         const { _sortable } = this;
+        if (!_sortable) return;
         getValidSortableEntries(newOptionValue).forEach(([key, value]) => {
           _sortable.option(key, value);
         });

tests/unit/util/tags.spec.js

@@ -1,4 +1,4 @@
-import { isHtmlTag, isTransition } from "@/util/tags";
+import { isHtmlTag, isTransition, isHtmlAttribute } from "@/util/tags";
 
 describe("isHtmlTag", () => {
   test.each([
@@ -17,6 +17,25 @@ describe("isHtmlTag", () => {
   )
 });
 
+describe("isHtmlAttribute", () => {
+  test.each([
+    ["class", true],
+    ["id", true],
+    ["role", true],
+    ["data-whatever", true],
+    ["aria-whatever", true],
+    ["notattribute", false],
+    ["href", false],
+    ["name", false],
+  ])(
+    "for %s returns %s",
+    (value, expected) =>{
+      const actual = isHtmlAttribute(value);
+      expect(actual).toEqual(expected);
+    }
+  )
+});
+
 describe("isTransition", () => {
   test.each([
     ["TransitionGroup", true],