test: Add cases for summary, summary-card and turbo configs to run tests

.gitignore

@@ -3,3 +3,4 @@
 dist
 node_modules
 storybook-static
+coverage

package.json

@@ -12,6 +12,8 @@
         "lint": "turbo run lint",
         "clean": "turbo run clean && rm -rf node_modules",
         "format": "prettier --write \"**/*.{ts,tsx,md}\"",
+        "test" : "turbo run test",
+        "test:ci" : "turbo run test:ci",
         "changeset": "changeset",
         "version-packages": "changeset version",
         "release": "turbo run build && changeset publish"

packages/ui/package.json

@@ -15,7 +15,8 @@
         "dev": "tsup --watch",
         "lint": "eslint \"src/**/*.ts*\"",
         "test": "vitest run",
-        "test:watch": "vitest"
+        "test:watch": "vitest",
+        "test:ci": "vitest run --coverage"
     },
     "dependencies": {
         "@mantine/core": "^7.0.0",
@@ -36,6 +37,7 @@
         "@types/ramda": "^0.29.3",
         "@types/react": "^18",
         "@types/react-dom": "^18",
+        "@vitest/coverage-v8": "^0.34.5",
         "eslint": "^8",
         "eslint-config-cartesi": "*",
         "jsdom": "^22.1.0",

packages/ui/src/SummaryCard.tsx

@@ -14,7 +14,12 @@ export const SummaryCard: FC<SummaryCardProps> = (props) => {
     return (
         <Card shadow="xs">
             <Group gap={5}>
-                {props.icon && <props.icon size={20} />}
+                {props.icon && (
+                    <props.icon
+                        size={20}
+                        data-testid={`summary-card-${props.title?.toLowerCase()}-icon`}
+                    />
+                )}
                 <Text c="dimmed">{props.title}</Text>
             </Group>
             <Text fw="bold" fz="2rem">

packages/ui/test/Summary.test.tsx

@@ -0,0 +1,23 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { Summary } from "../src";
+import withMantineTheme from "./utils/WithMantineTheme";
+
+const SummaryE = withMantineTheme(Summary);
+
+describe("Rollups Summary", () => {
+    it("should display totals for inputs and applications including icons", () => {
+        render(<SummaryE applications={10} inputs={2} />);
+
+        expect(screen.getByText("Applications")).toBeInTheDocument();
+        expect(
+            screen.getByTestId("summary-card-applications-icon")
+        ).toBeInTheDocument();
+        expect(screen.getByText("10")).toBeInTheDocument();
+        expect(screen.getByText("Inputs")).toBeInTheDocument();
+        expect(
+            screen.getByTestId("summary-card-inputs-icon")
+        ).toBeInTheDocument();
+        expect(screen.getByText("2")).toBeInTheDocument();
+    });
+});

packages/ui/test/SummaryCard.test.tsx

@@ -0,0 +1,25 @@
+import { render, screen } from "@testing-library/react";
+import { TbUser } from "react-icons/tb";
+import { describe, expect, it } from "vitest";
+import { SummaryCard } from "../src";
+import withMantineTheme from "./utils/WithMantineTheme";
+
+const SummaryCardE = withMantineTheme(SummaryCard);
+
+describe("Rollups SummaryCard", () => {
+    it("should display the title and number as configured", async () => {
+        render(<SummaryCardE title="Applications" value={100} />);
+
+        expect(screen.getByText("Applications")).toBeInTheDocument();
+        expect(screen.queryByText("100")).toBeInTheDocument();
+    });
+
+    it("should display icon when defined", () => {
+        const { container } = render(
+            <SummaryCardE title="Applications" value={10} icon={TbUser} />
+        );
+        expect(
+            screen.getByTestId("summary-card-applications-icon")
+        ).toBeInTheDocument();
+    });
+});

packages/ui/test/utils/WithMantineTheme.tsx

@@ -0,0 +1,19 @@
+import { MantineProvider, createTheme } from "@mantine/core";
+import { FC } from "react";
+
+const theme = createTheme({
+    fontFamily: "Open Sans, sans-serif",
+    primaryColor: "cyan",
+});
+
+export const withMantineTheme = <T,>(Component: FC<T>): FC<T> => {
+    const NewComp: FC<T> = (props: T) => (
+        <MantineProvider theme={theme}>{Component(props)}</MantineProvider>
+    );
+
+    NewComp.displayName = Component.displayName;
+
+    return NewComp;
+};
+
+export default withMantineTheme;

packages/ui/vitest-setup.ts

@@ -16,6 +16,13 @@ Object.defineProperty(window, "matchMedia", {
     })),
 });
 
+
+global.ResizeObserver = vi.fn().mockImplementation(() => ({
+    observe: vi.fn(),
+    unobserve: vi.fn(),
+    disconnect: vi.fn(),
+}));
+
 beforeAll(() => {
     Globals.assign({
         skipAnimation: true,

turbo.json

@@ -31,6 +31,16 @@
                 "test/**/*.ts",
                 "test/**/*.tsx"
             ]
+        },
+        "test:ci": {
+            "dependsOn": ["^build"],
+            "outputs": ["coverage/**"],
+            "inputs": [
+                "src/**/*.ts",
+                "src/**/*.tsx",
+                "test/**/*.ts",
+                "test/**/*.tsx"
+            ]
         }
     }
 }

yarn.lock

@@ -22,7 +22,7 @@
   resolved "https://registry.yarnpkg.com/@adraffy/ens-normalize/-/ens-normalize-1.9.4.tgz#aae21cb858bbb0411949d5b7b3051f4209043f62"
   integrity sha512-UK0bHA7hh9cR39V+4gl2/NnBBjoXIxkuWAPCaY4X7fbH4L/azIi7ilWOCjMUYfpJgraLUAqkRi2BqrjME8Rynw==
 
-"@ampproject/remapping@^2.2.0":
+"@ampproject/remapping@^2.2.0", "@ampproject/remapping@^2.2.1":
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.1.tgz#99e8e11851128b8702cd57c33684f1d0f260b630"
   integrity sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==
@@ -4673,6 +4673,23 @@
     "@types/babel__core" "^7.20.2"
     react-refresh "^0.14.0"
 
+"@vitest/coverage-v8@^0.34.5":
+  version "0.34.5"
+  resolved "https://registry.yarnpkg.com/@vitest/coverage-v8/-/coverage-v8-0.34.5.tgz#bbef8960ee69dcd03b1da9b5f51bb40467b2fbdc"
+  integrity sha512-97xjhRTSdmeeHCm2nNHhT3hLsMYkAhHXm/rwj6SZ3voka8xiCJrwgtfIjoZIFEL4OO0KezGmVuHWQXcMunULIA==
+  dependencies:
+    "@ampproject/remapping" "^2.2.1"
+    "@bcoe/v8-coverage" "^0.2.3"
+    istanbul-lib-coverage "^3.2.0"
+    istanbul-lib-report "^3.0.1"
+    istanbul-lib-source-maps "^4.0.1"
+    istanbul-reports "^3.1.5"
+    magic-string "^0.30.1"
+    picocolors "^1.0.0"
+    std-env "^3.3.3"
+    test-exclude "^6.0.0"
+    v8-to-istanbul "^9.1.0"
+
 "@vitest/[email protected]":
   version "0.34.5"
   resolved "https://registry.yarnpkg.com/@vitest/expect/-/expect-0.34.5.tgz#1f58829e746311162220d6580f72d6329efb9081"
@@ -9005,7 +9022,7 @@ istanbul-lib-instrument@^5.0.4:
     istanbul-lib-coverage "^3.2.0"
     semver "^6.3.0"
 
-istanbul-lib-report@^3.0.0:
+istanbul-lib-report@^3.0.0, istanbul-lib-report@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz#908305bac9a5bd175ac6a74489eafd0fc2445a7d"
   integrity sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==
@@ -9014,7 +9031,16 @@ istanbul-lib-report@^3.0.0:
     make-dir "^4.0.0"
     supports-color "^7.1.0"
 
-istanbul-reports@^3.1.4:
+istanbul-lib-source-maps@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/istanbul-lib-source-maps/-/istanbul-lib-source-maps-4.0.1.tgz#895f3a709fcfba34c6de5a42939022f3e4358551"
+  integrity sha512-n3s8EwkdFIJCG3BPKBYvskgXGoy88ARzvegkitk60NxRdwltLOTaH7CUiMRXvwYorl0Q712iEjcWB+fK/MrWVw==
+  dependencies:
+    debug "^4.1.1"
+    istanbul-lib-coverage "^3.0.0"
+    source-map "^0.6.1"
+
+istanbul-reports@^3.1.4, istanbul-reports@^3.1.5:
   version "3.1.6"
   resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-3.1.6.tgz#2544bcab4768154281a2f0870471902704ccaa1a"
   integrity sha512-TLgnMkKg3iTDsQ9PbPTdpfAK2DzjF9mqUG7RMgcQl8oFjad8ob4laGxv5XV5U9MAfx8D6tSJiUyuAwzLicaxlg==
@@ -13219,7 +13245,7 @@ v8-compile-cache-lib@^3.0.1:
   resolved "https://registry.yarnpkg.com/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
   integrity sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==
 
-v8-to-istanbul@^9.0.0:
+v8-to-istanbul@^9.0.0, v8-to-istanbul@^9.1.0:
   version "9.1.0"
   resolved "https://registry.yarnpkg.com/v8-to-istanbul/-/v8-to-istanbul-9.1.0.tgz#1b83ed4e397f58c85c266a570fc2558b5feb9265"
   integrity sha512-6z3GW9x8G1gd+JIIgQQQxXuiJtCXeAjp6RaPEPLv62mH3iPHPxV6W3robxtCzNErRo6ZwTmzWhsbNvjyEBKzKA==