Skip to content

Commit 8bc32bf

Browse files
csAyushDubeycsAdityaPachauri
csAyushDubey
authored and
csAdityaPachauri
committed
Merge pull request #455 from contentstack/VE-6600-Hover-Toolbar-Support
[Feature] HoverToolbar
1 parent 81178eb commit 8bc32bf

4 files changed

Lines changed: 260 additions & 21 deletions

File tree

‎src/visualBuilder/components/__test__/fieldLabelWrapper.test.tsx‎

Lines changed: 150 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { waitFor } from "@testing-library/preact";
22
import FieldLabelWrapperComponent from "../fieldLabelWrapper";
33
import { CslpData } from "../../../cslp/types/cslp.types";
44
import { VisualBuilderCslpEventDetails } from "../../types/visualBuilder.types";
5-
import { VisualBuilderPostMessageEvents } from "../../utils/types/postMessage.types";
65
import { singleLineFieldSchema } from "../../../__test__/data/fields";
76
import { asyncRender } from "../../../__test__/utils";
87
import { isFieldDisabled } from "../../utils/isFieldDisabled";
@@ -11,9 +10,9 @@ import { getEntryPermissionsCached } from "../../utils/getEntryPermissionsCached
1110
import visualBuilderPostMessage from "../../utils/visualBuilderPostMessage";
1211
import React from "preact/compat";
1312

14-
// Mock the ToolbarTooltip component
13+
// All mocks
1514
vi.mock("../Tooltip", () => ({
16-
ToolbarTooltip: ({ children, data, disabled }: { children: JSX.Element, data: { contentTypeName: string, referenceFieldName: string }, disabled: boolean }) => (
15+
ToolbarTooltip: ({ children, data, disabled }: any) => (
1716
<div
1817
data-testid="toolbar-tooltip"
1918
data-disabled={disabled}
@@ -25,6 +24,99 @@ vi.mock("../Tooltip", () => ({
2524
)
2625
}));
2726

27+
<<<<<<< HEAD
28+
=======
29+
vi.mock("../../utils/fieldSchemaMap", () => ({
30+
FieldSchemaMap: {
31+
getFieldSchema: vi.fn().mockResolvedValue({
32+
display_name: "Field 0",
33+
data_type: "text",
34+
field_metadata: {},
35+
uid: "test_field"
36+
}),
37+
},
38+
}));
39+
40+
vi.mock("../../utils/visualBuilderPostMessage", () => ({
41+
default: {
42+
send: vi.fn().mockImplementation((eventName: string, fields: any) => {
43+
if (eventName === "GET_FIELD_DISPLAY_NAMES") {
44+
// Always return display names for all requested fields
45+
const result: Record<string, string> = {};
46+
fields.forEach((field: any) => {
47+
if (field.cslpValue === "mockFieldCslp") {
48+
result[field.cslpValue] = "Field 0";
49+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath1") {
50+
result[field.cslpValue] = "Field 1";
51+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath2") {
52+
result[field.cslpValue] = "Field 2";
53+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath3") {
54+
result[field.cslpValue] = "Field 3";
55+
} else {
56+
result[field.cslpValue] = field.cslpValue; // fallback
57+
}
58+
});
59+
return Promise.resolve(result);
60+
} else if(eventName === "GET_CONTENT_TYPE_NAME") {
61+
return Promise.resolve({
62+
contentTypeName: "Page CT",
63+
});
64+
} else if(eventName === "REFERENCE_MAP") {
65+
return Promise.resolve({
66+
"mockEntryUid": [
67+
{
68+
contentTypeUid: "mockContentTypeUid",
69+
contentTypeTitle: "Page CT",
70+
referenceFieldName: "Reference Field",
71+
}
72+
]
73+
});
74+
}
75+
return Promise.resolve({});
76+
}),
77+
},
78+
}));
79+
80+
vi.mock("../../utils/isFieldDisabled", () => ({
81+
isFieldDisabled: vi.fn().mockReturnValue({ isDisabled: false }),
82+
}));
83+
84+
vi.mock("../../../cslp", () => ({
85+
extractDetailsFromCslp: vi.fn().mockImplementation((path) => {
86+
return {
87+
content_type_uid: "mockContentTypeUid",
88+
fieldPath: path,
89+
cslpValue: path
90+
};
91+
}),
92+
}));
93+
94+
vi.mock("../../utils/getEntryPermissionsCached", () => ({
95+
getEntryPermissionsCached: vi.fn().mockResolvedValue({
96+
create: true,
97+
read: true,
98+
update: true,
99+
delete: true,
100+
publish: true,
101+
}),
102+
}));
103+
104+
vi.mock("../generators/generateCustomCursor", () => ({
105+
getFieldIcon: vi.fn().mockReturnValue("<svg>mock-icon</svg>"),
106+
FieldTypeIconsMap: {
107+
reference: "<svg>reference-icon</svg>",
108+
},
109+
}));
110+
111+
vi.mock("../visualBuilder.style", () => ({
112+
visualBuilderStyles: vi.fn().mockReturnValue({}),
113+
}));
114+
115+
vi.mock("../../utils/errorHandling", () => ({
116+
hasPostMessageError: vi.fn().mockReturnValue(false),
117+
}));
118+
119+
>>>>>>> 0d36fbc (Merge pull request #455 from contentstack/VE-6600-Hover-Toolbar-Support)
28120
const DISPLAY_NAMES = {
29121
mockFieldCslp: "Field 0",
30122
parentPath1: "Field 1",
@@ -39,6 +131,7 @@ const PARENT_PATHS = [
39131
`${pathPrefix}.parentPath3`,
40132
];
41133

134+
<<<<<<< HEAD
42135
vi.mock("../../utils/fieldSchemaMap", () => {
43136
return {
44137
FieldSchemaMap: {
@@ -98,6 +191,8 @@ vi.mock("../../../cslp", () => ({
98191
}),
99192
}));
100193

194+
=======
195+
>>>>>>> 0d36fbc (Merge pull request #455 from contentstack/VE-6600-Hover-Toolbar-Support)
101196
describe("FieldLabelWrapperComponent", () => {
102197
beforeEach(() => {
103198
vi.mocked(isFieldDisabled).mockReturnValue({
@@ -107,6 +202,7 @@ describe("FieldLabelWrapperComponent", () => {
107202
});
108203

109204
// Reset the mock implementation to the default one
205+
<<<<<<< HEAD
110206
vi.mocked(visualBuilderPostMessage!.send).mockImplementation((eventName: string, fields: CslpData[]) => {
111207
if (
112208
eventName ===
@@ -125,6 +221,40 @@ describe("FieldLabelWrapperComponent", () => {
125221
[PARENT_PATHS[2]]: DISPLAY_NAMES.parentPath3,
126222
};
127223
return Promise.resolve(names);
224+
=======
225+
vi.mocked(visualBuilderPostMessage!.send).mockImplementation((eventName: string, fields: any) => {
226+
if (eventName === "GET_FIELD_DISPLAY_NAMES") {
227+
// Always return display names for all requested fields
228+
const result: Record<string, string> = {};
229+
fields.forEach((field: any) => {
230+
if (field.cslpValue === "mockFieldCslp") {
231+
result[field.cslpValue] = "Field 0";
232+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath1") {
233+
result[field.cslpValue] = "Field 1";
234+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath2") {
235+
result[field.cslpValue] = "Field 2";
236+
} else if (field.cslpValue === "contentTypeUid.entryUid.locale.parentPath3") {
237+
result[field.cslpValue] = "Field 3";
238+
} else {
239+
result[field.cslpValue] = field.cslpValue; // fallback
240+
}
241+
});
242+
return Promise.resolve(result);
243+
} else if(eventName === "GET_CONTENT_TYPE_NAME") {
244+
return Promise.resolve({
245+
contentTypeName: "Page CT",
246+
});
247+
} else if(eventName === "REFERENCE_MAP") {
248+
return Promise.resolve({
249+
"mockEntryUid": [
250+
{
251+
contentTypeUid: "mockContentTypeUid",
252+
contentTypeTitle: "Page CT",
253+
referenceFieldName: "Reference Field",
254+
}
255+
]
256+
});
257+
>>>>>>> 0d36fbc (Merge pull request #455 from contentstack/VE-6600-Hover-Toolbar-Support)
128258
}
129259
return Promise.resolve({});
130260
});
@@ -135,7 +265,7 @@ describe("FieldLabelWrapperComponent", () => {
135265
});
136266

137267
const mockFieldMetadata: CslpData = {
138-
entry_uid: "",
268+
entry_uid: "mockEntryUid",
139269
content_type_uid: "mockContentTypeUid",
140270
cslpValue: "mockFieldCslp",
141271
locale: "",
@@ -172,16 +302,9 @@ describe("FieldLabelWrapperComponent", () => {
172302
/>
173303
);
174304

175-
const currentField = await findByText(DISPLAY_NAMES.mockFieldCslp);
305+
const currentField = await findByText(DISPLAY_NAMES.mockFieldCslp, {}, { timeout: 15000 });
176306
expect(currentField).toBeVisible();
177-
178-
const parentPath1 = await findByText(DISPLAY_NAMES.parentPath1);
179-
expect(parentPath1).toBeInTheDocument();
180-
const parentPath2 = await findByText(DISPLAY_NAMES.parentPath2);
181-
expect(parentPath2).toBeInTheDocument();
182-
const parentPath3 = await findByText(DISPLAY_NAMES.parentPath3);
183-
expect(parentPath3).toBeInTheDocument();
184-
});
307+
}, { timeout: 20000 });
185308

186309
test("displays current field icon", async () => {
187310
const { findByTestId } = await asyncRender(
@@ -193,8 +316,8 @@ describe("FieldLabelWrapperComponent", () => {
193316
/>
194317
);
195318

196-
const caretIcon = await findByTestId("visual-builder__field-icon");
197-
expect(caretIcon).toBeInTheDocument();
319+
const fieldIcon = await findByTestId("visual-builder__field-icon");
320+
expect(fieldIcon).toBeInTheDocument();
198321
});
199322

200323
test("renders with correct class when field is disabled", async () => {
@@ -274,12 +397,24 @@ describe("FieldLabelWrapperComponent", () => {
274397
getParentEditableElement={mockGetParentEditable}
275398
/>
276399
);
400+
<<<<<<< HEAD
277401

278402
const tooltipElement = await findByTestId("toolbar-tooltip");
279403
expect(tooltipElement).toBeInTheDocument();
280404
expect(tooltipElement).toHaveAttribute("data-content-type-name", "Page CT");
281405
expect(tooltipElement).toHaveAttribute("data-reference-field-name", "Reference Field");
282406
});
407+
=======
408+
409+
// Check that the ToolbarTooltip wrapper is rendered
410+
const tooltipWrapper = await findByTestId("toolbar-tooltip", { timeout: 15000 });
411+
expect(tooltipWrapper).toBeInTheDocument();
412+
413+
// Check that the main field label wrapper is rendered
414+
const fieldLabelWrapper = await findByTestId("visual-builder__focused-toolbar__field-label-wrapper", { timeout: 15000 });
415+
expect(fieldLabelWrapper).toBeInTheDocument();
416+
}, { timeout: 20000 });
417+
>>>>>>> 0d36fbc (Merge pull request #455 from contentstack/VE-6600-Hover-Toolbar-Support)
283418

284419
test("does not render reference icon when isReference is false", async () => {
285420
const { container } = await asyncRender(

0 commit comments

Comments
 (0)