add button unit tests

package.json

@@ -23,7 +23,11 @@
   },
   "devDependencies": {
     "@stencil/core": "^1.8.3",
-    "@types/jest": "^24.9.0"
+    "@types/jest": "24.0.25",
+    "@types/puppeteer": "1.20.3",
+    "jest": "24.9.0",
+    "jest-cli": "24.9.0",
+    "puppeteer": "1.20.0"
   },
   "license": "MIT",
   "dependencies": {

src/components/button/button.spec.ts

+import { Button } from "./button";
+import { newSpecPage } from "@stencil/core/testing";
+
+it("should render correctly without attributes", async () => {
+  const page = await newSpecPage({
+    components: [Button],
+    html: `<hy-button>Hello tests!</hy-button>`
+  });
+  expect(page.root).toEqualHtml(`
+  <hy-button>
+     <button class="default hy-button">
+       <span class="button-text">
+         Hello tests!
+       </span>
+     </button>
+    </hy-button>
+  `);
+});
+
+it("should have classname matching the variant", async () => {
+  const page = await newSpecPage({
+    components: [Button],
+    html: `<hy-button variant="secondary">Hello icons!<hy-button>`
+  });
+  const button = page.doc.querySelector("button.secondary");
+  expect(button).toBeTruthy();
+});
+
+it("should display arrow element", async () => {
+  const page = await newSpecPage({
+    components: [Button],
+    html: `<hy-button
+      icon="hy-icon-arrow-left"
+      >Hello icons!<hy-button>`
+  });
+  const icon = page.doc.querySelector("span.button-icon");
+  expect(icon).toHaveClass("button-icon-left");
+});
+
+it("supports icons on both sides", async () => {
+  const page = await newSpecPage({
+    components: [Button],
+    html: `<hy-button
+      variant="secondary"
+      icon="hy-icon-arrow-left"
+      icon-right="hy-icon-arrow-right">Hello icons!<hy-button>`
+  });
+  const icons = page.doc.querySelectorAll("span.button-icon");
+  expect(icons.length).toBe(2);
+  expect(icons[0]).toHaveClass("button-icon-left");
+  expect(icons[1]).toHaveClass("button-icon-right");
+});