## Description Adds various discovery points for State Inspector Fixes #38934 ## Automation /ok-to-test tags="@tag.All" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/13329714726> > Commit: e9dc2398262b8cd2bbb69b45bd7089e9fd029e56 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=13329714726&attempt=2" target="_blank">Cypress dashboard</a>. > Tags: `@tag.All` > Spec: > <hr>Fri, 14 Feb 2025 15:47:53 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced an “Inspect State” option across various parts of the interface, enabling users to directly review state details for widgets, actions, and collections via context menus, toolbars, and property pane actions. - Added a new `InspectStateHeaderButton` and `InspectStateMenuItem` for enhanced state inspection capabilities. - **Style** - Refined layout and typography in popups and menus for a cleaner, more consistent user experience. - **Bug Fixes** - Enhanced type safety in property pane actions by enforcing stricter type checks. - **Chores** - Updated imports and refactored related logic to streamline the configuration handling for the debugger interface. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
117 lines
3.5 KiB
TypeScript
117 lines
3.5 KiB
TypeScript
import { ObjectsRegistry } from "../Objects/Registry";
|
|
|
|
export class PeekOverlay {
|
|
private readonly locators = {
|
|
_overlayContainer: "#t--peek-overlay-container",
|
|
_dataContainer: "#t--peek-overlay-data",
|
|
_dataTypeContainer: '[data-testid="t--peek-overlay-data-type"]',
|
|
|
|
// react json viewer selectors
|
|
_rjv_variableValue: ".variable-value",
|
|
_rjv_topLevelArrayData:
|
|
".pushed-content.object-container .object-content .object-key-val",
|
|
_rjv_firstLevelBraces:
|
|
".pretty-json-container > .object-content:first-of-type > .object-key-val:first-of-type > span",
|
|
_fileOperation: (operation: string) =>
|
|
`.t--file-operation:contains("${operation}")`,
|
|
};
|
|
private readonly agHelper = ObjectsRegistry.AggregateHelper;
|
|
|
|
HoverCode(lineNumber: number, tokenNumber: number, verifyText: string) {
|
|
this.agHelper
|
|
.GetElement(".CodeMirror-line")
|
|
.eq(lineNumber)
|
|
.children()
|
|
.children()
|
|
.eq(tokenNumber)
|
|
.should("have.text", verifyText)
|
|
.then(($el) => {
|
|
const pos = $el[0].getBoundingClientRect();
|
|
this.HoverByPosition({ x: pos.left, y: pos.top });
|
|
});
|
|
}
|
|
|
|
IsOverlayOpen(checkIsOpen = true) {
|
|
checkIsOpen
|
|
? this.agHelper.AssertElementExist(this.locators._overlayContainer)
|
|
: this.agHelper.AssertElementAbsence(this.locators._overlayContainer);
|
|
}
|
|
|
|
HoverByPosition(position: { x: number; y: number }) {
|
|
this.agHelper.GetElement("body").realHover({ position });
|
|
this.agHelper.Sleep();
|
|
}
|
|
|
|
ResetHover() {
|
|
this.agHelper
|
|
.GetElement(".CodeMirror-code")
|
|
.realHover({ position: "bottomLeft" });
|
|
this.agHelper.Sleep();
|
|
}
|
|
|
|
CheckPrimitiveValue(data: string) {
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.children("div")
|
|
.should("have.text", data);
|
|
}
|
|
|
|
CheckPrimitveArrayInOverlay(array: Array<string | number>) {
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_variableValue)
|
|
.should("have.length", array.length);
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(0)
|
|
.contains("[");
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(1)
|
|
.contains("]");
|
|
}
|
|
|
|
CheckObjectArrayInOverlay(array: Array<Record<string, any>>) {
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_topLevelArrayData)
|
|
.should("have.length", array.length);
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(0)
|
|
.contains("[");
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(1)
|
|
.contains("]");
|
|
}
|
|
|
|
CheckBasicObjectInOverlay(object: Record<string, string | number>) {
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_variableValue)
|
|
.should("have.length", Object.entries(object).length);
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(0)
|
|
.contains("{");
|
|
this.agHelper
|
|
.GetElement(this.locators._dataContainer)
|
|
.find(this.locators._rjv_firstLevelBraces)
|
|
.eq(1)
|
|
.contains("}");
|
|
}
|
|
|
|
VerifyDataType(type: string) {
|
|
this.agHelper
|
|
.GetElement(this.locators._dataTypeContainer)
|
|
.eq(0)
|
|
.should("have.text", type);
|
|
}
|
|
}
|