@dxc-technology/halstack-react 0.0.0-a9c6846 → 0.0.0-acb1a24

package/test/Slider.test.js

@@ -4,7 +4,7 @@ import DxcSlider from "../src/slider/Slider";
 
 describe("Slider component tests", () => {
   test("Slider renders with correct text", () => {
-    const { getByText } = render(<DxcSlider minValue={0} maxValue={100} showLimitsValues></DxcSlider>);
+    const { getByText } = render(<DxcSlider minValue={0} maxValue={100} showLimitsValues />);
     expect(getByText("0")).toBeTruthy();
     expect(getByText("100")).toBeTruthy();
   });
@@ -12,37 +12,29 @@ describe("Slider component tests", () => {
   test("Calls correct function onChange in controlled slider", () => {
     const onChange = jest.fn();
     const { getByRole } = render(
-      <DxcSlider minValue={0} maxValue={100} onChange={onChange} showLimitsValues value={13} showInput></DxcSlider>
+      <DxcSlider minValue={0} maxValue={100} onChange={onChange} showLimitsValues value={13} showInput />
     );
     act(() => {
       fireEvent.change(getByRole("textbox"), { target: { value: 25 } });
     });
-    expect(onChange).toHaveBeenCalledWith("25");
+    expect(onChange).toHaveBeenCalledWith(25);
   });
 
   test("Calls correct function onChange in uncontrolled slider", () => {
     const onChange = jest.fn();
     const { getByRole } = render(
-      <DxcSlider minValue={0} maxValue={100} onChange={onChange} showLimitsValues showInput></DxcSlider>
+      <DxcSlider minValue={0} maxValue={100} onChange={onChange} showLimitsValues showInput />
     );
     act(() => {
       fireEvent.change(getByRole("textbox"), { target: { value: 25 } });
     });
-    expect(onChange).toHaveBeenCalledWith("25");
+    expect(onChange).toHaveBeenCalledWith(25);
   });
 
   test("Disabled slider have disabled input", () => {
     const onChange = jest.fn();
     const { getByRole } = render(
-      <DxcSlider
-        minValue={0}
-        maxValue={100}
-        onChange={onChange}
-        showLimitsValues
-        disabled
-        showInput
-        value={13}
-      ></DxcSlider>
+      <DxcSlider minValue={0} maxValue={100} onChange={onChange} showLimitsValues disabled showInput value={13} />
     );
     act(() => {
       fireEvent.change(getByRole("textbox"), { target: { value: 25 } });
@@ -54,7 +46,7 @@ describe("Slider component tests", () => {
   test("Calls correct function onDragEnd", () => {
     const onDragEnd = jest.fn();
     const { getByRole } = render(
-      <DxcSlider minValue={0} maxValue={100} showLimitsValues showInput onDragEnd={onDragEnd} value={25}></DxcSlider>
+      <DxcSlider minValue={0} maxValue={100} showLimitsValues showInput onDragEnd={onDragEnd} value={25} />
     );
     act(() => {
       fireEvent.mouseDown(getByRole("slider"));
@@ -64,7 +56,7 @@ describe("Slider component tests", () => {
   });
 
   test("Calls correct function labelFormatCallback", () => {
-    const labelFormatCallback = jest.fn(x => `${x}$`);
+    const labelFormatCallback = jest.fn((x) => `${x}$`);
     const { getByText } = render(
       <DxcSlider
         minValue={0}
@@ -73,7 +65,7 @@ describe("Slider component tests", () => {
         showInput
         value={25}
         labelFormatCallback={labelFormatCallback}
-      ></DxcSlider>
+      />
     );
     expect(getByText("0$")).toBeTruthy();
     expect(getByText("100$")).toBeTruthy();

package/test/{NewInputText.test.js → TextInput.test.js}

@@ -2,7 +2,7 @@ import React from "react";
 import { render, fireEvent, waitForElementToBeRemoved } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 
-import DxcNewInputText from "../src/new-input-text/NewInputText";
+import DxcTextInput from "../src/text-input/TextInput";
 
 const countries = [
   "Afghanistan",
@@ -29,38 +29,36 @@ const countries = [
   "Djibouti",
 ];
 
-describe("NewInputText component tests", () => {
+describe("TextInput component tests", () => {
   test("Renders with correct label", () => {
-    const { getByText } = render(<DxcNewInputText label="Example label" />);
+    const { getByText } = render(<DxcTextInput label="Example label" />);
     expect(getByText("Example label")).toBeTruthy();
   });
   test("Renders with correct label and helper text", () => {
-    const { getByText } = render(<DxcNewInputText label="Example label" helperText="Example helper text" />);
+    const { getByText } = render(<DxcTextInput label="Example label" helperText="Example helper text" />);
     expect(getByText("Example label")).toBeTruthy();
     expect(getByText("Example helper text")).toBeTruthy();
   });
   test("Renders with correct label and optional", () => {
-    const { getByText } = render(<DxcNewInputText label="Example label" helperText="Example helper text" optional />);
+    const { getByText } = render(<DxcTextInput label="Example label" helperText="Example helper text" optional />);
     expect(getByText("Example label")).toBeTruthy();
     expect(getByText("(Optional)")).toBeTruthy();
     expect(getByText("Example helper text")).toBeTruthy();
   });
   test("Renders with correct placeholder", () => {
-    const { getByRole } = render(<DxcNewInputText label="Example label" placeholder="Placeholder" />);
+    const { getByRole } = render(<DxcTextInput label="Example label" placeholder="Placeholder" />);
     const input = getByRole("textbox");
     expect(input.getAttribute("placeholder")).toBe("Placeholder");
   });
   test("Renders with error message", () => {
-    const { getByText } = render(
-      <DxcNewInputText label="Error label" placeholder="Placeholder" error="Error message." />
-    );
+    const { getByText } = render(<DxcTextInput label="Error label" placeholder="Placeholder" error="Error message." />);
     expect(getByText("Error message.")).toBeTruthy();
   });
   test("Not optional constraint (onBlur)", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByRole } = render(
-      <DxcNewInputText label="Input label" placeholder="Placeholder" onChange={onChange} onBlur={onBlur} clearable />
+      <DxcTextInput label="Input label" placeholder="Placeholder" onChange={onChange} onBlur={onBlur} clearable />
     );
     const input = getByRole("textbox");
 
@@ -76,7 +74,7 @@ describe("NewInputText component tests", () => {
   test("Not optional constraint (onChange)", () => {
     const onChange = jest.fn();
     const { getByRole } = render(
-      <DxcNewInputText label="Input label" placeholder="Placeholder" onChange={onChange} clearable />
+      <DxcTextInput label="Input label" placeholder="Placeholder" onChange={onChange} clearable />
     );
     const input = getByRole("textbox");
 
@@ -90,8 +88,8 @@ describe("NewInputText component tests", () => {
   test("Pattern constraint", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
-    const { getByRole, getByText, queryByText } = render(
-      <DxcNewInputText
+    const { getByRole } = render(
+      <DxcTextInput
         label="Input label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -120,8 +118,8 @@ describe("NewInputText component tests", () => {
   test("Length constraint", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
-    const { getByRole, getByText, queryByText } = render(
-      <DxcNewInputText
+    const { getByRole } = render(
+      <DxcTextInput
         label="Input label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -150,8 +148,8 @@ describe("NewInputText component tests", () => {
   test("Pattern and length constraints", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
-    const { getByRole, getByText, queryByText } = render(
-      <DxcNewInputText
+    const { getByRole } = render(
+      <DxcTextInput
         label="Input label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -185,7 +183,7 @@ describe("NewInputText component tests", () => {
   });
   test("onChange function is called correctly", () => {
     const onChange = jest.fn();
-    const { getByRole } = render(<DxcNewInputText label="Input label" onChange={onChange} />);
+    const { getByRole } = render(<DxcTextInput label="Input label" onChange={onChange} />);
     const input = getByRole("textbox");
     userEvent.type(input, "onchange event test");
     expect(input.value).toBe("onchange event test");
@@ -195,7 +193,7 @@ describe("NewInputText component tests", () => {
   test("onBlur function is called correctly", () => {
     const onBlur = jest.fn();
     const onChange = jest.fn();
-    const { getByRole } = render(<DxcNewInputText label="Input label" onChange={onChange} onBlur={onBlur} />);
+    const { getByRole } = render(<DxcTextInput label="Input label" onChange={onChange} onBlur={onBlur} />);
     const input = getByRole("textbox");
     fireEvent.change(input, { target: { value: "Blur test" } });
     fireEvent.blur(input);
@@ -203,7 +201,7 @@ describe("NewInputText component tests", () => {
     expect(onBlur).toHaveBeenCalledWith({ value: "Blur test", error: null });
   });
   test("Clear action onClick cleans the input", () => {
-    const { getByRole } = render(<DxcNewInputText label="Input label" clearable />);
+    const { getByRole } = render(<DxcTextInput label="Input label" clearable />);
     const input = getByRole("textbox");
     userEvent.type(input, "Test");
     const closeAction = getByRole("button");
@@ -228,7 +226,7 @@ describe("NewInputText component tests", () => {
         </svg>
       ),
     };
-    const { getByRole } = render(<DxcNewInputText label="Disabled input label" action={action} disabled />);
+    const { getByRole } = render(<DxcTextInput label="Disabled input label" action={action} disabled />);
     const input = getByRole("textbox");
     expect(input.disabled).toBeTruthy();
     userEvent.click(getByRole("button"));
@@ -236,7 +234,7 @@ describe("NewInputText component tests", () => {
   });
   test("Disabled input (clear default action should not be displayed, even with text written on the input)", () => {
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Disabled input label" value="Sample text" disabled clearable />
+      <DxcTextInput label="Disabled input label" value="Sample text" disabled clearable />
     );
     const input = getByRole("textbox");
     expect(input.disabled).toBeTruthy();
@@ -244,7 +242,7 @@ describe("NewInputText component tests", () => {
   });
   test("Disabled input (suffix and preffix must be displayed)", () => {
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Disabled input label" value="Sample text" prefix="+34" suffix="USD" disabled />
+      <DxcTextInput label="Disabled input label" value="Sample text" prefix="+34" suffix="USD" disabled />
     );
     const input = getByRole("textbox");
     expect(input.disabled).toBeTruthy();
@@ -269,13 +267,13 @@ describe("NewInputText component tests", () => {
         </svg>
       ),
     };
-    const { getByRole, getByTestId } = render(<DxcNewInputText label="Input label" action={action} />);
+    const { getByRole, getByTestId } = render(<DxcTextInput label="Input label" action={action} />);
     expect(getByTestId("image")).toBeTruthy();
     userEvent.click(getByRole("button"));
     expect(onClick).toHaveBeenCalled();
   });
   test("Renders with correct prefix and suffix", () => {
-    const { getByText } = render(<DxcNewInputText label="Input label" prefix="+34" suffix="USD" />);
+    const { getByText } = render(<DxcTextInput label="Input label" prefix="+34" suffix="USD" />);
     expect(getByText("+34")).toBeTruthy();
     expect(getByText("USD")).toBeTruthy();
   });
@@ -297,7 +295,7 @@ describe("NewInputText component tests", () => {
         </svg>
       ),
     };
-    const { getByRole, getAllByRole } = render(<DxcNewInputText label="Example label" clearable action={action} />);
+    const { getByRole, getAllByRole } = render(<DxcTextInput label="Example label" clearable action={action} />);
     const input = getByRole("textbox");
     expect(input.getAttribute("aria-autocomplete")).toBeNull();
     expect(input.getAttribute("aria-controls")).toBeNull();
@@ -312,7 +310,7 @@ describe("NewInputText component tests", () => {
   });
   test("Autosuggest has correct accesibility attributes", () => {
     const { getByRole, getAllByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" optional suggestions={countries} />
+      <DxcTextInput label="Autocomplete Countries" optional suggestions={countries} />
     );
     const input = getByRole("combobox");
     const inputId = input.id;
@@ -329,11 +327,11 @@ describe("NewInputText component tests", () => {
   });
 });
 
-describe("NewInputText component synchronous autosuggest tests", () => {
+describe("TextInput component synchronous autosuggest tests", () => {
   test("Autosuggest is displayed when the input gains focus", async () => {
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -347,7 +345,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
   test("Autosuggest is displayed when the user clicks the input", async () => {
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     userEvent.click(input);
@@ -361,7 +359,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
   test("Autosuggest is displayed while the user is writing (if closed previously, if open stays open)", async () => {
     const onChange = jest.fn();
     const { getByRole, queryByRole, getByText, getAllByText } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -380,7 +378,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
   test("Autosuggest is not displayed when prop suggestions is an empty array", async () => {
     const onChange = jest.fn();
     const { queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={[]} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={[]} onChange={onChange} />
     );
     const input = queryByRole("textbox");
     fireEvent.focus(input);
@@ -389,7 +387,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
   test("Autosuggest shows 'No results found' message when there are no matches with the user's input", async () => {
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -400,10 +398,10 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     expect(list).toBeTruthy();
     expect(getByText("No results found")).toBeTruthy();
   });
-  test("Autosuggest uncontrolled suggestion selected", async () => {
+  test("Autosuggest uncontrolled - Suggestion selected by click", async () => {
     const onChange = jest.fn();
     const { getByRole, getByText, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -416,10 +414,10 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     expect(input.value).toBe("Albania");
     expect(queryByRole("listbox")).toBeFalsy();
   });
-  test("Autosuggest controlled suggestions selected", async () => {
+  test("Autosuggest controlled - Suggestion selected by click", async () => {
     const onChange = jest.fn();
     const { getByRole, getByText, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" value="Andor" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" value="Andor" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -435,7 +433,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText
+      <DxcTextInput
         label="Autocomplete Countries"
         suggestions={countries}
         onChange={onChange}
@@ -458,7 +456,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByText, getByRole } = render(
-      <DxcNewInputText
+      <DxcTextInput
         label="Autocomplete Countries"
         suggestions={countries}
         onChange={onChange}
@@ -481,7 +479,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     Element.prototype.scrollTo = () => {};
     const onChange = jest.fn();
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.keyDown(input, { key: "ArrowDown", code: "ArrowDown", keyCode: 40, charCode: 40 });
@@ -495,7 +493,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     Element.prototype.scrollTo = () => {};
     const onChange = jest.fn();
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.keyDown(input, { key: "ArrowUp", code: "ArrowUp", keyCode: 38, charCode: 38 });
@@ -509,7 +507,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     Element.prototype.scrollTo = () => {};
     const onChange = jest.fn();
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -524,7 +522,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     Element.prototype.scrollTo = () => {};
     const onChange = jest.fn();
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -538,13 +536,13 @@ describe("NewInputText component synchronous autosuggest tests", () => {
     Element.prototype.scrollTo = () => {};
     const onChange = jest.fn();
     const { getByRole, queryByRole } = render(
-      <DxcNewInputText label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
+      <DxcTextInput label="Autocomplete Countries" suggestions={countries} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
     userEvent.type(input, "Ba");
     fireEvent.keyDown(input, { key: "ArrowUp", code: "ArrowUp", keyCode: 38, charCode: 38 });
-    fireEvent.keyDown(input, { key: "ArrowUp", code: "ArrowUp", keyCode: 38, charCode: 38 });
+    fireEvent.keyDown(input, { key: "ArrowUp", code: "ArrowUpp", keyCode: 38, charCode: 38 });
     fireEvent.keyDown(input, { key: "ArrowDown", code: "ArrowDown", keyCode: 40, charCode: 40 });
     fireEvent.keyDown(input, { key: "Enter", code: "Enter", keyCode: 13, charCode: 13 });
     expect(input.value).toBe("Barbados");
@@ -555,7 +553,7 @@ describe("NewInputText component synchronous autosuggest tests", () => {
   });
 });
 
-describe("NewInputText component asynchronous autosuggest tests", () => {
+describe("TextInput component asynchronous autosuggest tests", () => {
   test("Autosuggest 'Searching...' message is shown", async () => {
     const callbackFunc = jest.fn((newValue) => {
       const result = new Promise((resolve) =>
@@ -569,7 +567,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
+      <DxcTextInput label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -599,7 +597,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, queryByText, queryByRole } = render(
-      <DxcNewInputText label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
+      <DxcTextInput label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -623,7 +621,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText, queryByText, queryByRole } = render(
-      <DxcNewInputText label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
+      <DxcTextInput label="Autosuggest Countries" suggestions={callbackFunc} onChange={onChange} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -655,7 +653,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autosuggest Countries" onChange={onChange} suggestions={callbackFunc} />
+      <DxcTextInput label="Autosuggest Countries" onChange={onChange} suggestions={callbackFunc} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -680,7 +678,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText, queryByRole } = render(
-      <DxcNewInputText label="Autosuggest Countries" value="Denm" onChange={onChange} suggestions={callbackFunc} />
+      <DxcTextInput label="Autosuggest Countries" value="Denm" onChange={onChange} suggestions={callbackFunc} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -705,7 +703,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autosuggest Countries" onChange={onChange} suggestions={callbackFunc} />
+      <DxcTextInput label="Autosuggest Countries" onChange={onChange} suggestions={callbackFunc} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);
@@ -724,7 +722,7 @@ describe("NewInputText component asynchronous autosuggest tests", () => {
     });
     const onChange = jest.fn();
     const { getByRole, getByText } = render(
-      <DxcNewInputText label="Autosuggest Countries" onChange={onChange} suggestions={errorCallbackFunc} />
+      <DxcTextInput label="Autosuggest Countries" onChange={onChange} suggestions={errorCallbackFunc} />
     );
     const input = getByRole("combobox");
     fireEvent.focus(input);

package/test/{NewTextarea.test.js → Textarea.test.js}

@@ -1,21 +1,21 @@
 import React from "react";
 import { render, fireEvent } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import DxcNewTextarea from "../src/new-textarea/NewTextarea";
+import DxcTextarea from "../src/textarea/Textarea";
 
-describe("NewTextarea component tests", () => {
+describe("Textarea component tests", () => {
   test("Renders with correct label", () => {
-    const { getByText } = render(<DxcNewTextarea label="Example label" />);
+    const { getByText } = render(<DxcTextarea label="Example label" />);
     expect(getByText("Example label")).toBeTruthy();
   });
   test("Renders with correct label and helper text", () => {
-    const { getByText } = render(<DxcNewTextarea label="Example label" helperText="Example helper text" />);
+    const { getByText } = render(<DxcTextarea label="Example label" helperText="Example helper text" />);
     expect(getByText("Example label")).toBeTruthy();
     expect(getByText("Example helper text")).toBeTruthy();
   });
   test("Renders with correct label and optional", () => {
     const { getByText, getByRole } = render(
-      <DxcNewTextarea label="Example label" helperText="Example helper text" optional />
+      <DxcTextarea label="Example label" helperText="Example helper text" optional />
     );
     const textarea = getByRole("textbox");
     expect(getByText("Example label")).toBeTruthy();
@@ -24,24 +24,24 @@ describe("NewTextarea component tests", () => {
     expect(textarea.getAttribute("aria-required")).toBe("false");
   });
   test("Renders with correct placeholder", () => {
-    const { getByRole } = render(<DxcNewTextarea placeholder="Placeholder" />);
+    const { getByRole } = render(<DxcTextarea placeholder="Placeholder" />);
     const textarea = getByRole("textbox");
     expect(textarea.getAttribute("placeholder")).toBe("Placeholder");
   });
   test("Renders with error message", () => {
-    const { getByText, getByRole } = render(<DxcNewTextarea error="Error message." />);
+    const { getByText, getByRole } = render(<DxcTextarea error="Error message." />);
     const textarea = getByRole("textbox");
     expect(getByText("Error message.")).toBeTruthy();
     expect(textarea.getAttribute("aria-invalid")).toBe("true");
     expect(textarea.getAttribute("aria-describedBy")).not.toBeNull();
   });
   test("Renders with correct default rows", () => {
-    const { getByLabelText } = render(<DxcNewTextarea label="Example label" rows={10} />);
+    const { getByLabelText } = render(<DxcTextarea label="Example label" rows={10} />);
     const textarea = getByLabelText("Example label");
     expect(textarea.rows).toBe(10);
   });
   test("Renders with correct accesibility attributes", () => {
-    const { getByLabelText } = render(<DxcNewTextarea label="Example label" />);
+    const { getByLabelText } = render(<DxcTextarea label="Example label" />);
     const textarea = getByLabelText("Example label");
     expect(textarea.getAttribute("aria-invalid")).toBe("false");
     expect(textarea.getAttribute("aria-describedBy")).toBeNull();
@@ -51,7 +51,7 @@ describe("NewTextarea component tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByLabelText } = render(
-      <DxcNewTextarea label="Example label" placeholder="Placeholder" onChange={onChange} onBlur={onBlur} />
+      <DxcTextarea label="Example label" placeholder="Placeholder" onChange={onChange} onBlur={onBlur} />
     );
     const textarea = getByLabelText("Example label");
 
@@ -67,7 +67,7 @@ describe("NewTextarea component tests", () => {
   test("Not optional constraint (onChange)", () => {
     const onChange = jest.fn();
     const { getByLabelText } = render(
-      <DxcNewTextarea label="Example label" placeholder="Placeholder" onChange={onChange} />
+      <DxcTextarea label="Example label" placeholder="Placeholder" onChange={onChange} />
     );
     const textarea = getByLabelText("Example label");
 
@@ -83,7 +83,7 @@ describe("NewTextarea component tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByLabelText } = render(
-      <DxcNewTextarea
+      <DxcTextarea
         label="Example label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -112,7 +112,7 @@ describe("NewTextarea component tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByLabelText } = render(
-      <DxcNewTextarea
+      <DxcTextarea
         label="Example label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -141,7 +141,7 @@ describe("NewTextarea component tests", () => {
     const onChange = jest.fn();
     const onBlur = jest.fn();
     const { getByLabelText, getByText, queryByText } = render(
-      <DxcNewTextarea
+      <DxcTextarea
         label="Example label"
         placeholder="Placeholder"
         onChange={onChange}
@@ -174,7 +174,7 @@ describe("NewTextarea component tests", () => {
   });
   test("onBlur function is called correctly", () => {
     const onBlur = jest.fn();
-    const { getByLabelText } = render(<DxcNewTextarea label="Example label" onBlur={onBlur} />);
+    const { getByLabelText } = render(<DxcTextarea label="Example label" onBlur={onBlur} />);
     const textarea = getByLabelText("Example label");
     fireEvent.change(textarea, { target: { value: "Blur test" } });
     fireEvent.blur(textarea);
@@ -183,9 +183,7 @@ describe("NewTextarea component tests", () => {
   });
   test("onChange function is called correctly", () => {
     const onChange = jest.fn();
-    const { getByLabelText } = render(
-      <DxcNewTextarea label="Example label" value="Test value" onChange={onChange} />
-    );
+    const { getByLabelText } = render(<DxcTextarea label="Example label" value="Test value" onChange={onChange} />);
     const textarea = getByLabelText("Example label");
     fireEvent.change(textarea, { target: { value: "Controlled test" } });
     expect(onChange).toHaveBeenCalled();

package/test/ToggleGroup.test.js

@@ -23,7 +23,11 @@ const options = [
 
 describe("Toggle group component tests", () => {
   test("Toggle group renders with correct labels", () => {
-    const { getByText } = render(<DxcToggleGroup options={options} />);
+    const { getByText } = render(
+      <DxcToggleGroup label="Toggle group label" helperText="Toggle group helper text" options={options} />
+    );
+    expect(getByText("Toggle group label")).toBeTruthy();
+    expect(getByText("Toggle group helper text")).toBeTruthy();
     expect(getByText("Amazon")).toBeTruthy();
     expect(getByText("Ebay")).toBeTruthy();
     expect(getByText("Apple")).toBeTruthy();

package/test/Upload.test.js

@@ -34,7 +34,7 @@ describe("Upload component tests", () => {
   });
 
   test("Calls correct function callbackUpload", () => {
-    const onCallbackUpload = jest.fn(() => new Promise(resolve => setTimeout(resolve, 1000)));
+    const onCallbackUpload = jest.fn(() => new Promise((resolve) => setTimeout(resolve, 1000)));
     const myfunction = jest.fn();
     const { getByText } = render(<DxcUpload margin="small" callbackUpload={onCallbackUpload}></DxcUpload>);