@madie/madie-design-system 1.2.34 → 1.2.36

package/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@madie/madie-design-system",
-  "version": "1.2.34",
+  "version": "1.2.36",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@madie/madie-design-system",
-      "version": "1.2.34",
+      "version": "1.2.36",
       "license": "CC0-1.0",
       "dependencies": {
         "@cmsgov/design-system": "^5.0.2",
@@ -20,7 +20,7 @@
         "@reach/portal": "^0.16.2",
         "@reach/tooltip": "^0.16.2",
         "axios": "^1.7.4",
-        "cookie": "^0.4.1",
+        "cookie": "^0.7.2",
         "cross-env": "^7.0.3",
         "d3-selection": "^1.4.2",
         "d3-shape": "^1.3.7",
@@ -8732,9 +8732,10 @@
       "dev": true
     },
     "node_modules/cookie": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
-      "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.6"
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@madie/madie-design-system",
-  "version": "1.2.34",
+  "version": "1.2.36",
   "description": "Shared style guide across the Madie program.",
   "main": "dist/index.js",
   "homepage": "https://github.com/MeasureAuthoringTool/madie-design-system",
@@ -117,7 +117,7 @@
     "@reach/portal": "^0.16.2",
     "@reach/tooltip": "^0.16.2",
     "axios": "^1.7.4",
-    "cookie": "^0.4.1",
+    "cookie": "^0.7.2",
     "cross-env": "^7.0.3",
     "d3-selection": "^1.4.2",
     "d3-shape": "^1.3.7",

package/test/components/TextField.test.js

@@ -2,7 +2,12 @@ import "@testing-library/jest-dom";
 import { describe, expect, test } from "@jest/globals";
 import TextField from "../../components/TextField/index";
 import { act, Simulate } from "react-dom/test-utils";
-import { findByTestId, render, fireEvent } from "@testing-library/react";
+import {
+    findByTestId,
+    render,
+    fireEvent,
+    screen,
+} from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 
 import * as React from "react";
@@ -98,43 +103,70 @@ describe("TextField", () => {
                     size="small"
                 />
             );
-            const tooltipTrigger = await findByTestId("testName-tooltip-button")
+            const tooltipTrigger = await findByTestId(
+                "testName-tooltip-button"
+            );
 
             // click and escape
             act(() => {
                 fireEvent.click(tooltipTrigger);
-            })
+            });
             expect(getByText("tooltip text")).toBeInTheDocument();
             act(() => {
                 fireEvent.keyDown(getByText(/tooltip text/i), {
                     key: "Escape",
                     code: "Escape",
                     keyCode: 27,
-                    charCode: 27
-              });
-            })
-            expect(getByTestId("testName-tooltip")).toHaveClass("hidden")
+                    charCode: 27,
+                });
+            });
+            expect(getByTestId("testName-tooltip")).toHaveClass("hidden");
 
             // enter and leave
             act(() => {
                 fireEvent.mouseEnter(getByTestId("testName-tooltip-button"));
-            })
-            expect(getByTestId("testName-tooltip")).not.toHaveClass("hidden")
+            });
+            expect(getByTestId("testName-tooltip")).not.toHaveClass("hidden");
             act(() => {
                 fireEvent.mouseLeave(getByTestId("testName-tooltip-button"));
-            })
-            expect(getByTestId("testName-tooltip")).toHaveClass("hidden")
+            });
+            expect(getByTestId("testName-tooltip")).toHaveClass("hidden");
 
             // focus, blur
             act(() => {
                 fireEvent.focus(getByTestId("testName-tooltip-button"));
-            })
-            expect(getByTestId("testName-tooltip")).not.toHaveClass("hidden")
+            });
+            expect(getByTestId("testName-tooltip")).not.toHaveClass("hidden");
 
             act(() => {
                 fireEvent.blur(getByTestId("testName-tooltip-button"));
-            })
-            expect(getByTestId("testName-tooltip")).toHaveClass("hidden")
+            });
+            expect(getByTestId("testName-tooltip")).toHaveClass("hidden");
+        });
+    });
+
+    test("Textfield has different color for label", async () => {
+        await act(async () => {
+            const { findByTestId, getByTestId } = render(
+                <TextField
+                    placeholder="test Name"
+                    required
+                    label="test Name"
+                    labelColor={"#1976d2"}
+                    id="testName"
+                    inputProps={{ "data-testid": "test-name-input" }}
+                    data-testid="test-name-text-field"
+                    size="small"
+                />
+            );
+            screen.debug(undefined, 60000);
+            expect(
+                await findByTestId("test-name-text-field")
+            ).toBeInTheDocument();
+            const textNode = await getByTestId("test-name-input");
+            userEvent.type(textNode, "newVal");
+            Simulate.change(textNode);
+            expect(textNode.value).toBe("newVal");
         });
     });
 });