Skip to content

Commit d05112c

Browse files
karancs06karancs06
authored
Merge pull request #554 from contentstack/vb-to-ve-support
feat: vb to ve
2 parents f96d848 + 7e90efb commit d05112c

4 files changed

Lines changed: 73 additions & 54 deletions

File tree

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

Lines changed: 65 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
import { render, fireEvent, screen } from "@testing-library/preact";
2-
import StartEditingButtonComponent, { getEditButtonPosition } from "../startEditingButton";
2+
import StartEditingButtonComponent, {
3+
getEditButtonPosition,
4+
} from "../startEditingButton";
35
import Config from "../../../configManager/configManager";
46
import { asyncRender } from "../../../__test__/utils";
57

68
describe("StartEditingButtonComponent", () => {
79
let visualBuilderContainer: HTMLDivElement;
810

911
beforeEach(() => {
10-
document.getElementsByTagName('html')[0].innerHTML = '';
12+
document.getElementsByTagName("html")[0].innerHTML = "";
1113
Config.reset();
1214
Config.set("stackDetails.apiKey", "bltapikey");
1315
Config.set("stackDetails.environment", "bltenvironment");
@@ -38,103 +40,120 @@ describe("StartEditingButtonComponent", () => {
3840
});
3941

4042
test("should update the href when clicked", async () => {
41-
const { getByTestId } = await asyncRender(<StartEditingButtonComponent />);
43+
const { getByTestId } = await asyncRender(
44+
<StartEditingButtonComponent />
45+
);
4246
const button = getByTestId("vcms-start-editing-btn");
4347

4448
expect(button?.getAttribute("href")).toBe(
45-
"https://app.contentstack.com/#!/stack/bltapikey/visual-builder?branch=main&environment=bltenvironment&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
49+
"https://app.contentstack.com/#!/stack/bltapikey/visual-editor?branch=main&environment=bltenvironment&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
4650
);
4751
});
4852

4953
test("should not render when enable is false", async () => {
5054
Config.set("editInVisualBuilderButton.enable", false);
51-
const { container } = await asyncRender(<StartEditingButtonComponent />);
55+
const { container } = await asyncRender(
56+
<StartEditingButtonComponent />
57+
);
5258
expect(container).toBeEmptyDOMElement();
5359
});
5460

5561
test("should render when enable is true", async () => {
5662
Config.set("editInVisualBuilderButton.enable", true);
57-
const { getByTestId } = await asyncRender(<StartEditingButtonComponent />);
63+
const { getByTestId } = await asyncRender(
64+
<StartEditingButtonComponent />
65+
);
5866
const button = getByTestId("vcms-start-editing-btn");
5967
expect(button).toBeInTheDocument();
6068
});
6169

62-
test.each([
63-
'bottom-right',
64-
'bottom-left',
65-
'top-left',
66-
'top-right'
67-
])('should return valid position %s', (position) => {
68-
expect(getEditButtonPosition(position)).toBe(position);
69-
});
70+
test.each(["bottom-right", "bottom-left", "top-left", "top-right"])(
71+
"should return valid position %s",
72+
(position) => {
73+
expect(getEditButtonPosition(position)).toBe(position);
74+
}
75+
);
7076

7177
test.each([
72-
'invalid-position',
73-
'center',
74-
'',
78+
"invalid-position",
79+
"center",
80+
"",
7581
undefined,
7682
null,
7783
123,
7884
{},
7985
[],
8086
false,
81-
])('should return bottom-right for invalid input: %s', (invalidPosition) => {
82-
expect(getEditButtonPosition(invalidPosition)).toBe('bottom-right');
83-
});
84-
87+
])(
88+
"should return bottom-right for invalid input: %s",
89+
(invalidPosition) => {
90+
expect(getEditButtonPosition(invalidPosition)).toBe("bottom-right");
91+
}
92+
);
93+
8594
test("should render with default values when editInVisualBuilderButton config is missing", async () => {
8695
Config.reset();
8796
Config.set("stackDetails.apiKey", "bltapikey");
8897
Config.set("stackDetails.environment", "bltenvironment");
8998

90-
const { getByTestId } = await asyncRender(<StartEditingButtonComponent />);
99+
const { getByTestId } = await asyncRender(
100+
<StartEditingButtonComponent />
101+
);
91102
const button = getByTestId("vcms-start-editing-btn");
92-
93-
expect(Config.get().editInVisualBuilderButton.position).toBe("bottom-right")
103+
104+
expect(Config.get().editInVisualBuilderButton.position).toBe(
105+
"bottom-right"
106+
);
94107
expect(button).toBeInTheDocument();
95108
});
96109

97110
test("should update href with current URL when mouse enters button", async () => {
98-
Object.defineProperty(window, 'location', {
99-
value: new URL('http://localhost:3000'),
111+
Object.defineProperty(window, "location", {
112+
value: new URL("http://localhost:3000"),
100113
});
101-
102-
const { getByTestId } = await asyncRender(<StartEditingButtonComponent />);
114+
115+
const { getByTestId } = await asyncRender(
116+
<StartEditingButtonComponent />
117+
);
103118
const button = getByTestId("vcms-start-editing-btn");
104119
const initialHref = button.getAttribute("href");
105-
106-
Object.defineProperty(window, 'location', {
107-
value: new URL('http://localhost:3000/about'),
108-
writable: true
120+
121+
Object.defineProperty(window, "location", {
122+
value: new URL("http://localhost:3000/about"),
123+
writable: true,
109124
});
110125

111126
fireEvent.mouseEnter(button);
112-
127+
113128
const updatedHref = button.getAttribute("href");
114129
expect(updatedHref).not.toBe(initialHref);
115-
expect(updatedHref).toContain(encodeURIComponent("http://localhost:3000/about"));
130+
expect(updatedHref).toContain(
131+
encodeURIComponent("http://localhost:3000/about")
132+
);
116133
});
117134

118135
test("should update href with current URL when button is focused", async () => {
119-
Object.defineProperty(window, 'location', {
120-
value: new URL('http://localhost:3000'),
136+
Object.defineProperty(window, "location", {
137+
value: new URL("http://localhost:3000"),
121138
});
122-
123-
const { getByTestId } = await asyncRender(<StartEditingButtonComponent />);
139+
140+
const { getByTestId } = await asyncRender(
141+
<StartEditingButtonComponent />
142+
);
124143
const button = getByTestId("vcms-start-editing-btn");
125144
const initialHref = button.getAttribute("href");
126-
127-
Object.defineProperty(window, 'location', {
128-
value: new URL('http://localhost:3000/contact'),
129-
writable: true
145+
146+
Object.defineProperty(window, "location", {
147+
value: new URL("http://localhost:3000/contact"),
148+
writable: true,
130149
});
131150

132151
fireEvent.focus(button);
133-
152+
134153
const updatedHref = button.getAttribute("href");
135154
expect(updatedHref).not.toBe(initialHref);
136-
expect(updatedHref).toContain(encodeURIComponent("http://localhost:3000/contact"));
155+
expect(updatedHref).toContain(
156+
encodeURIComponent("http://localhost:3000/contact")
157+
);
137158
});
138-
139-
140159
});

‎src/visualBuilder/utils/__test__/generateStartEditingButton.test.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ describe("generateStartEditingButton", () => {
3939
button?.click();
4040

4141
expect(button?.getAttribute("href")).toBe(
42-
"https://app.contentstack.com/#!/stack//visual-builder?branch=main&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
42+
"https://app.contentstack.com/#!/stack//visual-editor?branch=main&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
4343
);
4444
});
4545

@@ -57,7 +57,7 @@ describe("generateStartEditingButton", () => {
5757
button?.click();
5858

5959
expect(button?.getAttribute("href")).toBe(
60-
"https://app.contentstack.com/#!/stack//visual-builder?branch=main&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
60+
"https://app.contentstack.com/#!/stack//visual-editor?branch=main&target-url=http%3A%2F%2Flocalhost%3A3000%2F&locale=en-us"
6161
);
6262
});
6363
});

‎src/visualBuilder/utils/__test__/getVisualBuilderRedirectionUrl.test.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ describe('getVisualBuilderRedirectionUrl', () => {
2727
});
2828

2929
const result = getVisualBuilderRedirectionUrl();
30-
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-builder?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
30+
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-editor?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
3131
});
3232

3333
it('should return the correct URL without branch and environment', () => {
@@ -44,7 +44,7 @@ describe('getVisualBuilderRedirectionUrl', () => {
4444
});
4545

4646
const result = getVisualBuilderRedirectionUrl();
47-
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-builder?target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
47+
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-editor?target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
4848
});
4949

5050
it('should use locale from data-cslp attribute if present', () => {
@@ -65,7 +65,7 @@ describe('getVisualBuilderRedirectionUrl', () => {
6565
extractDetailsFromCslp.mockReturnValue({ locale: 'fr-FR' });
6666

6767
const result = getVisualBuilderRedirectionUrl();
68-
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-builder?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=fr-FR');
68+
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-editor?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=fr-FR');
6969
});
7070

7171
it('should return the correct URL without locale', () => {
@@ -83,7 +83,7 @@ describe('getVisualBuilderRedirectionUrl', () => {
8383
});
8484

8585
const result = getVisualBuilderRedirectionUrl();
86-
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-builder?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F');
86+
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-editor?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F');
8787
});
8888

8989
it('should ignore invalid data-cslp attribute and use locale from config', () => {
@@ -104,7 +104,7 @@ describe('getVisualBuilderRedirectionUrl', () => {
104104

105105
const result = getVisualBuilderRedirectionUrl();
106106
// Should use locale from config when data-cslp attribute is invalid (empty or no value)
107-
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-builder?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
107+
expect(result.toString()).toBe('https://app.example.com/#!/stack/12345/visual-editor?branch=main&environment=production&target-url=https%3A%2F%2Fexample.com%2F&locale=en-US');
108108
// Should not call extractDetailsFromCslp for invalid cslp
109109
expect(extractDetailsFromCslp).not.toHaveBeenCalled();
110110
});

‎src/visualBuilder/utils/getVisualBuilderRedirectionUrl.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export default function getVisualBuilderRedirectionUrl(): URL {
3737
}
3838

3939
const completeURL = new URL(
40-
`/#!/stack/${apiKey}/visual-builder?${searchParams.toString()}`,
40+
`/#!/stack/${apiKey}/visual-editor?${searchParams.toString()}`,
4141
appUrl
4242
);
4343
return completeURL;

0 commit comments

Comments
 (0)