test(plugin.legend): add tests for legend navigation

Author: adrianbrs

test/fixtures/plugin.legend/legend-doughnut-horizontal-multiline-legend.json

@@ -0,0 +1,29 @@
+{
+  "config": {
+    "type": "doughnut",
+    "data": {
+      "labels": ["", ["", "", ""], "", "", "", "", "", "", "", "", "", ""],
+      "datasets": [
+        {
+          "data": [10, 20, 30, 40, 50, 60, 70, 10, 20, 30, 40, 50],
+          "backgroundColor": "#00ff00",
+          "borderWidth": 0
+        }
+      ]
+    },
+    "options": {
+      "plugins": {
+        "legend": {
+          "position": "top",
+          "align": "center"
+        }
+      }
+    }
+  },
+  "options": {
+    "canvas": {
+      "height": 256,
+      "width": 512
+    }
+  }
+}

test/fixtures/plugin.legend/legend-doughnut-horizontal-multiline-legend.png

@@ -0,0 +1,33 @@
+{
+  "config": {
+    "type": "doughnut",
+    "data": {
+      "labels": ["Label 1", "Label 2", "Label 3", "Label 4", "Label 5"],
+      "datasets": [
+        {
+          "data": [10, 20, 30, 40, 50],
+          "backgroundColor": "#00ff00",
+          "borderWidth": 0
+        }
+      ]
+    },
+    "options": {
+      "plugins": {
+        "legend": {
+          "position": "top",
+          "align": "start",
+          "navigation": {
+            "display": "auto",
+            "maxRows": 1
+          }
+        }
+      }
+    }
+  },
+  "options": {
+    "canvas": {
+      "height": 256,
+      "width": 512
+    }
+  }
+}

test/fixtures/plugin.legend/navigation/legend-navigation-horizontal-auto-hidden.json

@@ -0,0 +1,44 @@
+{
+  "config": {
+    "type": "doughnut",
+    "data": {
+      "labels": [
+        "Label 1",
+        "Label 2",
+        "Label 3",
+        "Label 4",
+        "Label 5",
+        "Label 6",
+        "Label 7",
+        "Label 8",
+        "Label 9",
+        "Label 10"
+      ],
+      "datasets": [
+        {
+          "data": [10, 20, 30, 40, 50, 60, 70, 80, 90, 100],
+          "backgroundColor": "#00ff00",
+          "borderWidth": 0
+        }
+      ]
+    },
+    "options": {
+      "plugins": {
+        "legend": {
+          "position": "top",
+          "align": "start",
+          "navigation": {
+            "display": "auto",
+            "maxRows": 1
+          }
+        }
+      }
+    }
+  },
+  "options": {
+    "canvas": {
+      "height": 256,
+      "width": 512
+    }
+  }
+}

test/fixtures/plugin.legend/navigation/legend-navigation-horizontal-auto-hidden.png

@@ -0,0 +1,55 @@
+{
+  "config": {
+    "type": "doughnut",
+    "data": {
+      "labels": [
+        "Label 1",
+        ["Label 2", "Second line"],
+        "Label 3",
+        "Label 4",
+        "Label 5",
+        "Label 6",
+        "Label 7",
+        "Label 8",
+        "Label 9",
+        "Label 10",
+        "Label 11",
+        "Label 12",
+        "Label 13",
+        "Label 14",
+        "Label 15"
+      ],
+      "datasets": [
+        {
+          "data": [
+            10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150
+          ],
+          "backgroundColor": "#00ff00",
+          "borderWidth": 0
+        }
+      ]
+    },
+    "options": {
+      "plugins": {
+        "legend": {
+          "position": "top",
+          "align": "start",
+          "maxHeight": 300,
+          "navigation": {
+            "display": true,
+            "maxRows": 2,
+            "grid": {
+              "x": true
+            }
+          }
+        }
+      }
+    }
+  },
+  "options": {
+    "canvas": {
+      "height": 256,
+      "width": 512
+    }
+  }
+}

test/fixtures/plugin.legend/navigation/legend-navigation-horizontal-auto-visible.json

@@ -0,0 +1,34 @@
+{
+  "config": {
+    "type": "doughnut",
+    "data": {
+      "labels": ["Label 1", "Label 2", "Label 3"],
+      "datasets": [
+        {
+          "data": [10, 20, 30],
+          "backgroundColor": "#00ff00",
+          "borderWidth": 0
+        }
+      ]
+    },
+    "options": {
+      "plugins": {
+        "legend": {
+          "position": "top",
+          "align": "center",
+          "navigation": {
+            "display": true,
+            "maxRows": 1,
+            "align": "center"
+          }
+        }
+      }
+    }
+  },
+  "options": {
+    "canvas": {
+      "height": 256,
+      "width": 512
+    }
+  }
+}