diff --git a/packages/pluggableWidgets/fieldset-web/package.json b/packages/pluggableWidgets/fieldset-web/package.json index fbfc9352bd..bca2c5a23b 100644 --- a/packages/pluggableWidgets/fieldset-web/package.json +++ b/packages/pluggableWidgets/fieldset-web/package.json @@ -37,7 +37,7 @@ "publish-marketplace": "rui-publish-marketplace", "release": "pluggable-widgets-tools release:web", "start": "pluggable-widgets-tools start:server", - "test": "pluggable-widgets-tools test:unit:web", + "test": "pluggable-widgets-tools test:unit:web:enzyme-free", "update-changelog": "rui-update-changelog-widget", "verify": "rui-verify-package-format" }, diff --git a/packages/pluggableWidgets/fieldset-web/src/__tests__/Fieldset.spec.tsx b/packages/pluggableWidgets/fieldset-web/src/__tests__/Fieldset.spec.tsx index 7d20cfd5a3..b5ded80743 100644 --- a/packages/pluggableWidgets/fieldset-web/src/__tests__/Fieldset.spec.tsx +++ b/packages/pluggableWidgets/fieldset-web/src/__tests__/Fieldset.spec.tsx @@ -1,4 +1,5 @@ -import { shallow } from "enzyme"; +import "@testing-library/jest-dom"; +import { render } from "@testing-library/react"; import { createElement, Fragment, ReactNode } from "react"; import { Fieldset, FieldsetProps } from "../components/Fieldset"; @@ -20,17 +21,17 @@ describe("Fieldset", () => { ); it("renders children and legend", () => { - const fieldset = shallow(
{defaultChildren}
); + const fieldset = render(
{defaultChildren}
); - expect(fieldset).toMatchSnapshot(); + expect(fieldset.asFragment()).toMatchSnapshot(); }); it("renders only children when no legend is passed", () => { - const fieldset = shallow( + const fieldset = render(
{defaultChildren}
); - expect(fieldset).toMatchSnapshot(); + expect(fieldset.asFragment()).toMatchSnapshot(); }); }); diff --git a/packages/pluggableWidgets/fieldset-web/src/__tests__/__snapshots__/Fieldset.spec.tsx.snap b/packages/pluggableWidgets/fieldset-web/src/__tests__/__snapshots__/Fieldset.spec.tsx.snap index 0176024dbb..d014dafac0 100644 --- a/packages/pluggableWidgets/fieldset-web/src/__tests__/__snapshots__/Fieldset.spec.tsx.snap +++ b/packages/pluggableWidgets/fieldset-web/src/__tests__/__snapshots__/Fieldset.spec.tsx.snap @@ -1,40 +1,42 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Fieldset renders children and legend 1`] = ` -
- - legend - - - -
+ +
+ + legend + + + +
+
`; exports[`Fieldset renders only children when no legend is passed 1`] = ` -
- - -
+ +
+ + +
+
`; diff --git a/packages/pluggableWidgets/image-web/src/components/__tests__/Image.spec.tsx b/packages/pluggableWidgets/image-web/src/components/__tests__/Image.spec.tsx index d4aadf636a..c2e27a842b 100644 --- a/packages/pluggableWidgets/image-web/src/components/__tests__/Image.spec.tsx +++ b/packages/pluggableWidgets/image-web/src/components/__tests__/Image.spec.tsx @@ -1,8 +1,10 @@ +import "@testing-library/jest-dom"; +import { render } from "@testing-library/react"; +import userEvent, { UserEvent } from "@testing-library/user-event"; import { createElement } from "react"; -import { mount, render } from "enzyme"; +import { ModalProps } from "react-overlays/esm/Modal"; import { Image, ImageProps } from "../Image/Image"; import { Lightbox } from "../Lightbox"; -import { ModalProps } from "react-overlays/esm/Modal"; jest.mock("../../assets/ic24-close.svg", () => "close-button-icon-svg"); @@ -70,33 +72,38 @@ const iconProps: ImageProps = { describe("Image", () => { it("renders the structure with an image", () => { - expect(render()).toMatchSnapshot(); + const image = render(); + expect(image.asFragment()).toMatchSnapshot(); }); it("renders the structure with an image and percentage dimensions", () => { - expect( - render() - ).toMatchSnapshot(); + const image = render( + + ); + expect(image.asFragment()).toMatchSnapshot(); }); it("renders the structure with a glyph icon", () => { - expect(render()).toMatchSnapshot(); + const image = render(); + expect(image.asFragment()).toMatchSnapshot(); }); it("renders the structure with an icon", () => { - expect(render()).toMatchSnapshot(); + const image = render(); + expect(image.asFragment()).toMatchSnapshot(); }); it("renders the structure as a background image", () => { - expect( - render(Image content} />) - ).toMatchSnapshot(); + const image = render( + Image content} /> + ); + expect(image.asFragment()).toMatchSnapshot(); }); describe("when the onClickType is action", () => { it("calls the onClick when clicking on an image", () => { const onClickMock = jest.fn(); - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image).toHaveLength(1); @@ -107,7 +114,7 @@ describe("Image", () => { it("has tabindex if there is an action with OnClick", () => { const onClickMock = jest.fn(); - const imageRender = mount( + const imageRender = render( ); const image = imageRender.find("img"); @@ -117,7 +124,7 @@ describe("Image", () => { }); it("has no tabindex if there is no action with OnClick", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image.prop("tabIndex")).toBeUndefined(); @@ -125,7 +132,7 @@ describe("Image", () => { it("calls the onClick when clicking on a glyph icon", () => { const onClickMock = jest.fn(); - const imageRender = mount(); + const imageRender = render(); const glyphicon = imageRender.find("span"); expect(glyphicon).toHaveLength(1); @@ -136,7 +143,7 @@ describe("Image", () => { it("calls the onClick when clicking on an icon", () => { const onClickMock = jest.fn(); - const imageRender = mount(); + const imageRender = render(); const glyphicon = imageRender.find("span"); expect(glyphicon).toHaveLength(1); @@ -148,7 +155,7 @@ describe("Image", () => { describe("when the onClickType is enlarge", () => { it("shows a lightbox when the user clicks on the image", () => { - const imageRender = mount(); + const imageRender = render(); expect(imageRender.find(Lightbox)).toHaveLength(0); const image = imageRender.find("img"); @@ -159,7 +166,7 @@ describe("Image", () => { }); it("closes the lightbox when the user clicks on the close button after opening it", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image).toHaveLength(1); @@ -178,7 +185,7 @@ describe("Image", () => { it("does not trigger on clicks from containers if clicked on the image", () => { const onClickOuterMock = jest.fn(); const onClickImageMock = jest.fn(); - const imageRender = mount( + const imageRender = render(
@@ -194,20 +201,20 @@ describe("Image", () => { describe("when there is an accessibility alt text", () => { it("is set properly on an image", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image.prop("alt")).toBe("this is an awesome image"); }); it("is set properly on a glyphicon", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("span"); expect(image.prop("aria-label")).toBe("this is an awesome glyphicon"); expect(image.prop("role")).toBe("img"); }); it("is set properly on an icon", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("span"); expect(image.prop("aria-label")).toBe("this is an awesome icon"); expect(image.prop("role")).toBe("img"); @@ -216,20 +223,20 @@ describe("Image", () => { describe("when there is no accessibility alt text", () => { it("nothing is set on an image", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image.prop("alt")).toBe(undefined); }); it("nothing is set on a glyphicon", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("span"); expect(image).not.toHaveProperty("aria-label"); expect(image).not.toHaveProperty("role"); }); it("nothing is set on an icon", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("span"); expect(image).not.toHaveProperty("aria-label"); expect(image).not.toHaveProperty("role"); @@ -238,13 +245,13 @@ describe("Image", () => { describe("when showing an image as a thumbnail", () => { it("includes the thumb=true URL param in the image", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image.prop("src")).toContain("thumb=true"); }); it("does not include the thumb=true URL param in the lightbox image", () => { - const imageRender = mount(); + const imageRender = render(); const image = imageRender.find("img"); expect(image.prop("src")).toContain("thumb=true"); @@ -264,7 +271,7 @@ describe("Image", () => { describe("when showing as a background image", () => { it("shows the content", () => { - const imageRender = mount( + const imageRender = render( Image content} /> ); expect(imageRender.text()).toContain("Image content"); @@ -272,7 +279,7 @@ describe("Image", () => { it("properly handles on click event if configured by the user", () => { const onClickMock = jest.fn(); - const imageRender = mount( + const imageRender = render(