Skip to content

Commit 16306dd

Browse files
faraazb-contentstackfaraazb-contentstack
committed
test: update field mouse hover tests
Tests failed after adding finally and catch blocks in mouse hover function
1 parent 25b1be6 commit 16306dd

13 files changed

Lines changed: 131 additions & 43 deletions

‎src/visualBuilder/__test__/hover/fields/boolean.test.ts‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
88
import visualBuilderPostMessage from "../../../utils/visualBuilderPostMessage";
9+
import { act } from "@testing-library/preact";
910

1011
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1112
const { getAllContentTypes } = await vi.importActual<
@@ -64,7 +65,7 @@ describe("When an element is hovered in visual builder mode", () => {
6465
let booleanField: HTMLParagraphElement;
6566
let visualBuilder: VisualBuilder;
6667

67-
beforeEach( async () => {
68+
beforeEach(async () => {
6869
booleanField = document.createElement("p");
6970
booleanField.setAttribute(
7071
"data-cslp",
@@ -86,7 +87,9 @@ describe("When an element is hovered in visual builder mode", () => {
8687
});
8788

8889
test("should have outline and custom cursor", async () => {
89-
booleanField.dispatchEvent(mousemoveEvent);
90+
await act(async () => {
91+
booleanField.dispatchEvent(mousemoveEvent);
92+
});
9093
await waitForHoverOutline();
9194
expect(booleanField).toHaveAttribute("data-cslp", "all_fields.bltapikey.en-us.boolean");
9295
expect(booleanField).not.toHaveAttribute("contenteditable");

‎src/visualBuilder/__test__/hover/fields/date.test.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Config from "../../../../configManager/configManager";
44
import { VisualBuilder } from "../../../index";
55
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
66
import { mockDomRect } from "./mockDomRect";
7+
import { act } from "@testing-library/preact";
78

89
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
910
const { getAllContentTypes } = await vi.importActual<
@@ -84,7 +85,9 @@ describe("When an element is hovered in visual builder mode", () => {
8485
});
8586

8687
test("should have outline and custom cursor", async () => {
87-
dataField.dispatchEvent(mousemoveEvent);
88+
await act(async () => {
89+
dataField.dispatchEvent(mousemoveEvent);
90+
});
8891
await waitForHoverOutline();
8992
expect(dataField).toHaveAttribute("data-cslp", "all_fields.bltapikey.en-us.date");
9093
expect(dataField).not.toHaveAttribute("contenteditable");

‎src/visualBuilder/__test__/hover/fields/file.test.ts‎

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { screen, waitFor } from "@testing-library/preact";
1+
import { screen, waitFor, act } from "@testing-library/preact";
22
import { getFieldSchemaMap } from "../../../../__test__/data/fieldSchemaMap";
33
import { waitForHoverOutline } from "../../../../__test__/utils";
44
import Config from "../../../../configManager/configManager";
@@ -56,7 +56,6 @@ describe("When an element is hovered in visual builder mode", () => {
5656
observe: vi.fn(),
5757
disconnect: vi.fn(),
5858
}));
59-
6059
});
6160

6261
beforeEach(() => {
@@ -111,7 +110,9 @@ describe("When an element is hovered in visual builder mode", () => {
111110
});
112111

113112
test("should have outline and custom cursor", async () => {
114-
fileField.dispatchEvent(mousemoveEvent);
113+
await act(async () => {
114+
fileField.dispatchEvent(mousemoveEvent);
115+
});
115116
await waitForHoverOutline();
116117
const hoverOutline = document.querySelector(
117118
"[data-testid='visual-builder__hover-outline']"
@@ -126,7 +127,9 @@ describe("When an element is hovered in visual builder mode", () => {
126127
});
127128

128129
test("should have a outline and custom cursor on the url as well", async () => {
129-
imageField.dispatchEvent(mousemoveEvent);
130+
await act(async () => {
131+
imageField.dispatchEvent(mousemoveEvent);
132+
});
130133
await waitForHoverOutline();
131134

132135
const hoverOutline = document.querySelector(
@@ -214,7 +217,9 @@ describe("When an element is hovered in visual builder mode", () => {
214217
});
215218

216219
test("should have outline and custom cursor", async () => {
217-
container.dispatchEvent(mousemoveEvent);
220+
await act(async () => {
221+
container.dispatchEvent(mousemoveEvent);
222+
});
218223
await waitForHoverOutline();
219224
const hoverOutline = document.querySelector(
220225
"[data-testid='visual-builder__hover-outline']"
@@ -229,7 +234,9 @@ describe("When an element is hovered in visual builder mode", () => {
229234
});
230235

231236
test("should have outline and custom cursor on individual instances", async () => {
232-
firstFileField.dispatchEvent(mousemoveEvent);
237+
await act(async () => {
238+
firstFileField.dispatchEvent(mousemoveEvent);
239+
});
233240
await waitForHoverOutline();
234241
const hoverOutline = document.querySelector(
235242
"[data-testid='visual-builder__hover-outline']"
@@ -247,7 +254,9 @@ describe("When an element is hovered in visual builder mode", () => {
247254
});
248255

249256
test("should have outline and custom cursor on the url", async () => {
250-
firstImageField.dispatchEvent(mousemoveEvent);
257+
await act(async () => {
258+
firstImageField.dispatchEvent(mousemoveEvent);
259+
});
251260
await waitForHoverOutline();
252261
const hoverOutline = document.querySelector(
253262
"[data-testid='visual-builder__hover-outline']"

‎src/visualBuilder/__test__/hover/fields/group.test.ts‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
55
import { mockDomRect } from "./mockDomRect";
66
import { VisualBuilder } from "../../../index";
77
import { screen } from "@testing-library/preact";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -96,7 +97,9 @@ describe("When an element is hovered in visual builder mode", () => {
9697
});
9798

9899
test("should have outline and custom cursor", async () => {
99-
groupField.dispatchEvent(mousemoveEvent);
100+
await act(async () => {
101+
groupField.dispatchEvent(mousemoveEvent);
102+
});
100103
await waitForHoverOutline();
101104
const hoverOutline = document.querySelector(
102105
"[data-testid='visual-builder__hover-outline']"
@@ -124,7 +127,9 @@ describe("When an element is hovered in visual builder mode", () => {
124127

125128
groupField.appendChild(singleLine);
126129

127-
singleLine.dispatchEvent(mousemoveEvent);
130+
await act(async () => {
131+
singleLine.dispatchEvent(mousemoveEvent);
132+
});
128133
await waitForHoverOutline();
129134
const hoverOutline = document.querySelector(
130135
"[data-testid='visual-builder__hover-outline']"
@@ -203,7 +208,9 @@ describe("When an element is hovered in visual builder mode", () => {
203208
});
204209

205210
test("should have outline and custom cursor", async () => {
206-
container.dispatchEvent(mousemoveEvent);
211+
await act(async () => {
212+
container.dispatchEvent(mousemoveEvent);
213+
});
207214
await waitForHoverOutline();
208215
const hoverOutline = document.querySelector(
209216
"[data-testid='visual-builder__hover-outline']"
@@ -217,7 +224,9 @@ describe("When an element is hovered in visual builder mode", () => {
217224
expect(customCursor).toHaveAttribute('data-icon', 'group');
218225
expect(customCursor?.classList.contains("visible")).toBeTruthy();
219226

220-
firstNestedMultiLine.dispatchEvent(mousemoveEvent);
227+
await act(async () => {
228+
firstNestedMultiLine.dispatchEvent(mousemoveEvent);
229+
});
221230
await waitForHoverOutline();
222231

223232
const newCustomCursor = document.querySelector(

‎src/visualBuilder/__test__/hover/fields/html-rte.test.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Config from "../../../../configManager/configManager";
55
import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -84,7 +85,9 @@ describe("When an element is hovered in visual builder mode", () => {
8485
});
8586

8687
test("should have outline and custom cursor", async () => {
87-
htmlRteField.dispatchEvent(mousemoveEvent);
88+
await act(async () => {
89+
htmlRteField.dispatchEvent(mousemoveEvent);
90+
});
8891
await waitForHoverOutline();
8992
const hoverOutline = document.querySelector(
9093
"[data-testid='visual-builder__hover-outline']"
@@ -149,7 +152,9 @@ describe("When an element is hovered in visual builder mode", () => {
149152
});
150153

151154
test("should have outline and custom cursor", async () => {
152-
container.dispatchEvent(mousemoveEvent);
155+
await act(async () => {
156+
container.dispatchEvent(mousemoveEvent);
157+
});
153158
await waitForHoverOutline();
154159
const hoverOutline = document.querySelector(
155160
"[data-testid='visual-builder__hover-outline']"
@@ -165,7 +170,9 @@ describe("When an element is hovered in visual builder mode", () => {
165170
});
166171

167172
test("should have outline and cursor on individual instances", async () => {
168-
firstHtmlRteField.dispatchEvent(mousemoveEvent);
173+
await act(async () => {
174+
firstHtmlRteField.dispatchEvent(mousemoveEvent);
175+
});
169176
await waitForHoverOutline();
170177
const hoverOutline = document.querySelector(
171178
"[data-testid='visual-builder__hover-outline']"

‎src/visualBuilder/__test__/hover/fields/json-rte.test.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Config from "../../../../configManager/configManager";
55
import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -84,7 +85,9 @@ describe("When an element is hovered in visual builder mode", () => {
8485
});
8586

8687
test("should have outline and custom cursor", async () => {
87-
jsonRteField.dispatchEvent(mousemoveEvent);
88+
await act(async () => {
89+
jsonRteField.dispatchEvent(mousemoveEvent);
90+
});
8891
await waitForHoverOutline();
8992
const hoverOutline = document.querySelector(
9093
"[data-testid='visual-builder__hover-outline']"
@@ -149,7 +152,9 @@ describe("When an element is hovered in visual builder mode", () => {
149152
});
150153

151154
test("should have outline and custom cursor", async () => {
152-
container.dispatchEvent(mousemoveEvent);
155+
await act(async () => {
156+
container.dispatchEvent(mousemoveEvent);
157+
});
153158
await waitForHoverOutline();
154159
const hoverOutline = document.querySelector(
155160
"[data-testid='visual-builder__hover-outline']"
@@ -165,7 +170,9 @@ describe("When an element is hovered in visual builder mode", () => {
165170
});
166171

167172
test("should have outline and custom cursor on individual instances", async () => {
168-
firstJsonRteField.dispatchEvent(mousemoveEvent);
173+
await act(async () => {
174+
firstJsonRteField.dispatchEvent(mousemoveEvent);
175+
});
169176
await waitForHoverOutline();
170177
const hoverOutline = document.querySelector(
171178
"[data-testid='visual-builder__hover-outline']"

‎src/visualBuilder/__test__/hover/fields/link.test.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Config from "../../../../configManager/configManager";
55
import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -84,7 +85,9 @@ describe("When an element is hovered in visual builder mode", () => {
8485
});
8586

8687
test("should have outline and custom cursor", async () => {
87-
linkField.dispatchEvent(mousemoveEvent);
88+
await act(async () => {
89+
linkField.dispatchEvent(mousemoveEvent);
90+
});
8891
await waitForHoverOutline();
8992
const hoverOutline = document.querySelector(
9093
"[data-testid='visual-builder__hover-outline']"
@@ -146,7 +149,9 @@ describe("When an element is hovered in visual builder mode", () => {
146149
});
147150

148151
test("should have outline and custom cursor", async () => {
149-
container.dispatchEvent(mousemoveEvent);
152+
await act(async () => {
153+
container.dispatchEvent(mousemoveEvent);
154+
});
150155
await waitForHoverOutline();
151156
const hoverOutline = document.querySelector(
152157
"[data-testid='visual-builder__hover-outline']"
@@ -162,7 +167,9 @@ describe("When an element is hovered in visual builder mode", () => {
162167
});
163168

164169
test("should have outline and custom cursor on individual instances", async () => {
165-
firstLinkField.dispatchEvent(mousemoveEvent);
170+
await act(async () => {
171+
firstLinkField.dispatchEvent(mousemoveEvent);
172+
});
166173
await waitForHoverOutline();
167174
const hoverOutline = document.querySelector(
168175
"[data-testid='visual-builder__hover-outline']"

‎src/visualBuilder/__test__/hover/fields/markdown.test.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Config from "../../../../configManager/configManager";
55
import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -85,7 +86,9 @@ describe("When an element is hovered in visual builder mode", () => {
8586
});
8687

8788
test("should have outline and custom cursor", async () => {
88-
markdownField.dispatchEvent(mousemoveEvent);
89+
await act(async () => {
90+
markdownField.dispatchEvent(mousemoveEvent);
91+
});
8992
await waitForHoverOutline();
9093
const hoverOutline = document.querySelector(
9194
"[data-testid='visual-builder__hover-outline']"
@@ -150,7 +153,9 @@ describe("When an element is hovered in visual builder mode", () => {
150153
});
151154

152155
test("should have outline and custom cursor", async () => {
153-
container.dispatchEvent(mousemoveEvent);
156+
await act(async () => {
157+
container.dispatchEvent(mousemoveEvent);
158+
});
154159
await waitForHoverOutline();
155160
const hoverOutline = document.querySelector(
156161
"[data-testid='visual-builder__hover-outline']"
@@ -166,7 +171,9 @@ describe("When an element is hovered in visual builder mode", () => {
166171
});
167172

168173
test("should have outline and custom cursor on individual instances", async () => {
169-
firstMarkdownField.dispatchEvent(mousemoveEvent);
174+
await act(async () => {
175+
firstMarkdownField.dispatchEvent(mousemoveEvent);
176+
});
170177
await waitForHoverOutline();
171178
const hoverOutline = document.querySelector(
172179
"[data-testid='visual-builder__hover-outline']"

‎src/visualBuilder/__test__/hover/fields/multi-line.test.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Config from "../../../../configManager/configManager";
55
import { VisualBuilder } from "../../../index";
66
import { FieldSchemaMap } from "../../../utils/fieldSchemaMap";
77
import { mockDomRect } from "./mockDomRect";
8+
import { act } from "@testing-library/preact";
89

910
vi.mock("../../../utils/visualBuilderPostMessage", async () => {
1011
const { getAllContentTypes } = await vi.importActual<
@@ -84,7 +85,9 @@ describe("When an element is hovered in visual builder mode", () => {
8485
});
8586

8687
test("should have outline and custom cursor", async () => {
87-
multiLineField.dispatchEvent(mousemoveEvent);
88+
await act(async () => {
89+
multiLineField.dispatchEvent(mousemoveEvent);
90+
});
8891
await waitForHoverOutline();
8992
const hoverOutline = screen.getByTestId(
9093
"visual-builder__hover-outline"
@@ -148,7 +151,9 @@ describe("When an element is hovered in visual builder mode", () => {
148151
});
149152

150153
test("should have outline and custom cursor", async () => {
151-
container.dispatchEvent(mousemoveEvent);
154+
await act(async () => {
155+
container.dispatchEvent(mousemoveEvent);
156+
});
152157
await waitForHoverOutline();
153158
const hoverOutline = document.querySelector(
154159
"[data-testid='visual-builder__hover-outline']"
@@ -164,7 +169,9 @@ describe("When an element is hovered in visual builder mode", () => {
164169
});
165170

166171
test("should have outline and custom cursor on individual instances", async () => {
167-
firstMultiLineField.dispatchEvent(mousemoveEvent);
172+
await act(async () => {
173+
firstMultiLineField.dispatchEvent(mousemoveEvent);
174+
});
168175
await waitForHoverOutline();
169176
const hoverOutline = document.querySelector(
170177
"[data-testid='visual-builder__hover-outline']"

0 commit comments

Comments
 (0)