## Description - Remove the config objects from widget and config maps from the widget factory. - Introduce methods in widget development API to dynamically fetch this items. - freeze the widget configuration. #### PR fixes following issue(s) Fixes https://github.com/appsmithorg/appsmith/issues/26008 > if no issue exists, please create an issue and ask the maintainers about this first > > #### Media > A video or a GIF is preferred. when using Loom, don’t embed because it looks like it’s a GIF. instead, just link to the video > > #### Type of change > Please delete options that are not relevant. - Bug fix (non-breaking change which fixes an issue) - New feature (non-breaking change which adds functionality) - Breaking change (fix or feature that would cause existing functionality to not work as expected) - Chore (housekeeping or task changes that don't impact user perception) - This change requires a documentation update > > > ## Testing > #### How Has This Been Tested? > Please describe the tests that you ran to verify your changes. Also list any relevant details for your test configuration. > Delete anything that is not relevant - [x] Manual - [ ] Jest - [ ] Cypress > > #### Test Plan > Add Testsmith test cases links that relate to this PR > > #### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) > > > ## Checklist: #### Dev activity - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [x] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [x] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
250 lines
6.3 KiB
TypeScript
250 lines
6.3 KiB
TypeScript
import type { Page } from "@appsmith/constants/ReduxActionConstants";
|
|
import { ReduxActionTypes } from "@appsmith/constants/ReduxActionConstants";
|
|
import { initEditor } from "actions/initActions";
|
|
import { setAppMode, updateCurrentPage } from "actions/pageActions";
|
|
import { APP_MODE } from "entities/App";
|
|
import { useDispatch } from "react-redux";
|
|
import type { CanvasWidgetsReduxState } from "reducers/entityReducers/canvasWidgetsReducer";
|
|
import { createSelector } from "reselect";
|
|
import { getCanvasWidgetsPayload } from "sagas/PageSagas";
|
|
import { getCanvasWidgets } from "selectors/entitiesSelector";
|
|
import { editorInitializer } from "utils/editor/EditorUtils";
|
|
import { extractCurrentDSL } from "utils/WidgetPropsUtils";
|
|
import type { AppState } from "@appsmith/reducers";
|
|
import type { WidgetEntity } from "entities/DataTree/dataTreeFactory";
|
|
import urlBuilder from "entities/URLRedirect/URLAssembly";
|
|
import type { FlattenedWidgetProps } from "reducers/entityReducers/canvasWidgetsStructureReducer";
|
|
import type { DSLWidget } from "WidgetProvider/constants";
|
|
import { nestDSL } from "@shared/dsl";
|
|
|
|
export const useMockDsl = (dsl: any, mode?: APP_MODE) => {
|
|
const dispatch = useDispatch();
|
|
dispatch(setAppMode(mode || APP_MODE.EDIT));
|
|
const mockResp: any = {
|
|
data: {
|
|
id: "page_id",
|
|
pageId: "page_id",
|
|
name: "Page1",
|
|
applicationId: "app_id",
|
|
isDefault: true,
|
|
isHidden: false,
|
|
slug: "page-1",
|
|
layouts: [
|
|
{
|
|
id: "layout_id",
|
|
dsl,
|
|
layoutOnLoadActions: [],
|
|
layoutActions: [],
|
|
},
|
|
],
|
|
userPermissions: [
|
|
"read:pages",
|
|
"manage:pages",
|
|
"create:pageActions",
|
|
"delete:pages",
|
|
],
|
|
},
|
|
};
|
|
const canvasWidgetsPayload = getCanvasWidgetsPayload(mockResp);
|
|
dispatch({
|
|
type: ReduxActionTypes.FETCH_PAGE_DSLS_SUCCESS,
|
|
payload: [
|
|
{
|
|
pageId: mockResp.data.id,
|
|
dsl: extractCurrentDSL(mockResp).dsl,
|
|
},
|
|
],
|
|
});
|
|
const pages: Page[] = [
|
|
{
|
|
pageName: mockResp.data.name,
|
|
pageId: mockResp.data.id,
|
|
isDefault: mockResp.data.isDefault,
|
|
isHidden: !!mockResp.data.isHidden,
|
|
slug: mockResp.data.slug,
|
|
userPermissions: [
|
|
"read:pages",
|
|
"manage:pages",
|
|
"create:pageActions",
|
|
"delete:pages",
|
|
],
|
|
},
|
|
];
|
|
dispatch({
|
|
type: ReduxActionTypes.FETCH_PAGE_LIST_SUCCESS,
|
|
payload: {
|
|
pages,
|
|
applicationId: mockResp.data.applicationId,
|
|
},
|
|
});
|
|
dispatch({
|
|
type: "UPDATE_LAYOUT",
|
|
payload: { widgets: canvasWidgetsPayload.widgets },
|
|
});
|
|
|
|
dispatch(updateCurrentPage(mockResp.data.id));
|
|
};
|
|
|
|
export function MockPageDSL({ children, dsl }: any) {
|
|
editorInitializer();
|
|
useMockDsl(dsl);
|
|
return children;
|
|
}
|
|
|
|
export const mockGetCanvasWidgetDsl = createSelector(
|
|
getCanvasWidgets,
|
|
(canvasWidgets: CanvasWidgetsReduxState): DSLWidget => {
|
|
return nestDSL(canvasWidgets);
|
|
},
|
|
);
|
|
|
|
const getChildWidgets = (
|
|
canvasWidgets: CanvasWidgetsReduxState,
|
|
widgetId: string,
|
|
) => {
|
|
const parentWidget = canvasWidgets[widgetId];
|
|
|
|
if (parentWidget.children) {
|
|
return parentWidget.children.map((childWidgetId) => {
|
|
const childWidget = { ...canvasWidgets[childWidgetId] } as WidgetEntity;
|
|
|
|
if (childWidget?.children?.length > 0) {
|
|
childWidget.children = getChildWidgets(canvasWidgets, childWidgetId);
|
|
}
|
|
|
|
return childWidget;
|
|
});
|
|
}
|
|
|
|
return [];
|
|
};
|
|
|
|
export const mockGetChildWidgets = (state: AppState, widgetId: string) => {
|
|
return getChildWidgets(state.entities.canvasWidgets, widgetId);
|
|
};
|
|
|
|
export const mockGetPagePermissions = () => {
|
|
return ["read:pages", "manage:pages", "create:pageActions", "delete:pages"];
|
|
};
|
|
|
|
export const mockCreateCanvasWidget = (
|
|
canvasWidget: FlattenedWidgetProps,
|
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
evaluatedWidget: WidgetEntity,
|
|
): any => {
|
|
return { ...canvasWidget };
|
|
};
|
|
|
|
export const mockGetWidgetEvalValues = (
|
|
state: AppState,
|
|
widgetName: string,
|
|
) => {
|
|
return Object.values(state.entities.canvasWidgets).find(
|
|
(widget) => widget.widgetName === widgetName,
|
|
) as WidgetEntity;
|
|
};
|
|
|
|
export const syntheticTestMouseEvent = (
|
|
event: MouseEvent,
|
|
optionsToAdd = {},
|
|
) => {
|
|
const options = Object.entries(optionsToAdd);
|
|
options.forEach(([key, value]) => {
|
|
Object.defineProperty(event, key, { get: () => value });
|
|
});
|
|
return event;
|
|
};
|
|
|
|
export function MockApplication({ children }: any) {
|
|
editorInitializer();
|
|
const dispatch = useDispatch();
|
|
dispatch(initEditor({ pageId: "page_id", mode: APP_MODE.EDIT }));
|
|
const mockResp: any = {
|
|
workspaceId: "workspace_id",
|
|
pages: [
|
|
{
|
|
id: "page_id",
|
|
pageId: "page_id",
|
|
name: "Page1",
|
|
isDefault: true,
|
|
slug: "page-1",
|
|
userPermissions: [
|
|
"read:pages",
|
|
"manage:pages",
|
|
"create:pageActions",
|
|
"delete:pages",
|
|
],
|
|
},
|
|
],
|
|
id: "app_id",
|
|
isDefault: true,
|
|
name: "appName",
|
|
slug: "app-name",
|
|
applicationVersion: 2,
|
|
};
|
|
urlBuilder.updateURLParams(
|
|
{
|
|
applicationId: mockResp.id,
|
|
applicationSlug: mockResp.slug,
|
|
applicationVersion: mockResp.applicationVersion,
|
|
},
|
|
[
|
|
{
|
|
pageId: mockResp.pages[0].id,
|
|
pageSlug: mockResp.pages[0].slug,
|
|
},
|
|
],
|
|
);
|
|
dispatch({
|
|
type: ReduxActionTypes.FETCH_APPLICATION_SUCCESS,
|
|
payload: mockResp,
|
|
});
|
|
dispatch({
|
|
type: ReduxActionTypes.FETCH_PAGE_LIST_SUCCESS,
|
|
payload: {
|
|
pages: mockResp.pages,
|
|
},
|
|
});
|
|
dispatch({
|
|
type: ReduxActionTypes.SWITCH_CURRENT_PAGE_ID,
|
|
payload: {
|
|
id: "page_id",
|
|
slug: "page-1",
|
|
permissions: [
|
|
"read:pages",
|
|
"manage:pages",
|
|
"create:pageActions",
|
|
"delete:pages",
|
|
],
|
|
},
|
|
});
|
|
return children;
|
|
}
|
|
|
|
//got it from @blueprintjs/test-commons to dispatch hotkeys events
|
|
export function dispatchTestKeyboardEventWithCode(
|
|
target: EventTarget,
|
|
eventType: string,
|
|
key: string,
|
|
keyCode: number,
|
|
shift = false,
|
|
meta = false,
|
|
) {
|
|
const event = document.createEvent("KeyboardEvent");
|
|
(event as any).initKeyboardEvent(
|
|
eventType,
|
|
true,
|
|
true,
|
|
window,
|
|
key,
|
|
0,
|
|
meta,
|
|
false,
|
|
shift,
|
|
);
|
|
Object.defineProperty(event, "key", { get: () => key });
|
|
Object.defineProperty(event, "which", { get: () => keyCode });
|
|
|
|
target.dispatchEvent(event);
|
|
}
|