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(
);
+ const fieldset = render();
- expect(fieldset).toMatchSnapshot();
+ expect(fieldset.asFragment()).toMatchSnapshot();
});
it("renders only children when no legend is passed", () => {
- const fieldset = shallow(
+ const fieldset = render(
);
- 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`] = `
-
+
+
+
`;
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(