chore: add snapshots for toggle type widgets #34528
Conversation
WalkthroughThe recent updates span a suite of test files for the Anvil UI components, introducing snapshot testing for various widgets like Checkbox, RadioGroup, and Switch in different modes (Canvas, Preview, Deploy). Additionally, enhancements were made to support classes and UI components, improving testing support and text display capabilities. Changes
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
github-actions
bot
added
the
skip-changelog
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (30)
app/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchoGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetPreview.snap.pngis excluded by!**/*.png
Files selected for processing (13)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilCheckboxWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilRadioGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilSwitchWidget.json (1 hunks)
- app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts (1 hunks)
- app/client/packages/design-system/widgets/src/components/Label/src/Label.tsx (1 hunks)
- app/client/src/widgets/wds/WDSSwitchWidget/widget/index.tsx (1 hunks)
Files not summarized due to errors (5)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilCheckboxWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilRadioGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilSwitchWidget.json: Error: Message exceeds token limit
Files skipped from review due to trivial changes (1)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts
Additional context used
Biome
app/client/packages/design-system/widgets/src/components/Label/src/Label.tsx
[error] 12-12: Avoid redundant
BooleancallIt is not necessary to use
Booleancall when a value will already be coerced to a boolean.
Unsafe fix: Remove redundantBooleancall(lint/complexity/noExtraBooleanCast)
[error] 12-12: Avoid redundant
BooleancallIt is not necessary to use
Booleancall when a value will already be coerced to a boolean.
Unsafe fix: Remove redundantBooleancall(lint/complexity/noExtraBooleanCast)
Additional comments not posted (14)
app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts (2)
1-5: Imports and helper functions are correctly set up.The imports from
ObjectsCoreare aligned with the summary and are necessary for the tests.
7-27: Comprehensive test suite for the Switch Widget.The tests cover Canvas, Preview, and Deploy modes, which is crucial for thorough testing of the widget's functionality.
app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts (2)
1-5: Correct setup of imports for Checkbox Widget tests.The helper functions
agHelperandanvilSnapshotare correctly imported, which are essential for the test operations.
7-27: Well-structured test suite for the Checkbox Widget.The tests are well organized to cover different modes, ensuring comprehensive validation of the widget's behavior.
app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts (2)
1-5: Proper import and helper setup for Switch Group Widget tests.Imports are in place and correctly structured to support testing functionalities.
7-27: Thorough test suite for the Switch Group Widget.The test suite is comprehensive, covering all necessary modes to ensure the widget functions as expected.
app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts (2)
1-5: Imports and helper setup are correct for Checkbox Group Widget tests.The necessary helper functions are imported, facilitating the testing process.
7-28: Inclusion of a new method to trigger invalid states enhances test coverage.The new method
triggerCheckboxGroupInvalidStateis a valuable addition, allowing for more detailed testing scenarios.app/client/packages/design-system/widgets/src/components/Label/src/Label.tsx (1)
22-22: UpdatedLabelcomponent to includelineClamp.The inclusion of
lineClampprop is a thoughtful enhancement for managing text overflow in UI elements.app/client/src/widgets/wds/WDSSwitchWidget/widget/index.tsx (1)
101-101: Verify the newisSelectedproperty usage inSwitch.The addition of
isSelectedderived fromthis.props.isSwitchedOnseems logical for the widget's functionality. Ensure this new property is consistently used across the widget and does not conflict with existing properties.Verification successful
Verify the new
isSelectedproperty usage inSwitch.The addition of
isSelectedderived fromthis.props.isSwitchedOnis consistent with other components in the codebase. There are no conflicts or inconsistencies found.
app/client/src/widgets/wds/WDSSwitchWidget/widget/index.tsx:isSelected={this.props.isSwitchedOn}Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the consistent usage of `isSelected` across the widget. # Test: Search for `isSelected` usage. Expect: Consistent usage and no conflicts. rg --type typescript $'isSelected'Length of output: 68
Script:
#!/bin/bash # Description: Verify the consistent usage of `isSelected` across the widget. # Test: Search for `isSelected` usage. Expect: Consistent usage and no conflicts. rg 'isSelected' --glob '*.tsx' --glob '*.ts'Length of output: 33038
app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts (1)
94-100: Review the implementation oftriggerCheckboxGroupInvalidState.The method
triggerCheckboxGroupInvalidStateefficiently simulates user interaction with checkbox groups to test invalid states. However, ensure that this method is adequately tested, especially since it involves UI interactions which can be prone to flakiness.app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (1)
1-2581: Comprehensive Review of JSON Structure:The JSON file is well-structured and appears to correctly define a complex widget layout necessary for the Cypress tests. It includes detailed configurations for various widgets, ensuring thorough testing coverage. All keys and values are consistent, and the JSON syntax is correct with no errors detected.
Ensure that the
widgetIdand other unique identifiers match the expected values in the test cases to avoid mismatches during test execution.app/client/cypress/fixtures/anvilSwitchGroupWidget.json (1)
1-2758: Review of JSON Structure and ConsistencyThe JSON file appears well-structured with a consistent layout definition for a widget system. Each widget and section is detailed with properties like
widgetName,type,options, andlayout. It's important to ensure that these properties are correctly used across the system and match the expected types and values.
- Consistency: The
widgetIdandparentIdproperties should consistently refer to valid and existing IDs within the document. It's crucial to verify that all referenced IDs exist to avoid runtime errors.- Data Integrity: The
optionsarray for widgets should contain valid entries with bothlabelandvalueproperties filled. Additionally, thedefaultSelectedValuesshould correspond to values listed in theoptions.- Visibility and Interaction: Properties like
isVisibleandisDisabledcontrol the UI's behavior and user interaction. These should be set appropriately to reflect the desired state of the widgets during testing or operation.Given the complexity and size of the JSON, it is recommended to implement automated tests to verify the integrity and consistency of these configurations.
app/client/cypress/fixtures/anvilCheckboxWidget.json (1)
1-2771: Comprehensive Review ofanvilCheckboxWidget.json
JSON Structure: The JSON file is well-structured and follows a consistent format which is crucial for parsing and utilizing in tests. The nesting of widget properties and layout configurations is logical and appears to be aligned with the intended use in Cypress tests.
Widget Configuration Consistency: Each widget (e.g., Checkbox1, Checkbox2, etc.) follows a consistent structure in terms of properties like
widgetName,displayName,type,isVisible, etc. This consistency is important for ensuring that tests can be written in a predictable manner.Dynamic Properties: The use of dynamic properties such as
"dynamicBindingPathList"and"onCanvasUI"is noted. It is important to ensure that these bindings and UI settings are correctly interpreted in the context of the application being tested.Potential Redundancies: There are repeated sections with similar configurations (e.g., multiple checkboxes within a zone). While this might be intentional to simulate a real-world scenario, it's important to ensure that these repetitions are necessary for the test's objectives and do not unintentionally bloat the test fixture.
Error Handling and Info: Properties like
"needsErrorInfo"are consistently set tofalse. If error handling tests are required, consider adding variations where this property istrue.Versioning and Deprecation: The
"version"property is consistently set to1, and"isDeprecated"isfalseacross all widgets. If there are multiple versions or deprecated widgets in the actual application, reflecting these variations in the test fixtures could be beneficial for broader test coverage.Visibility and Interaction: The consistent use of
"isVisible"set totrueand interaction properties like"isDisabled"varying betweentrueandfalseallows for testing both visible and interactable states of the widgets, which is good practice.Styling and Layout: The
"onCanvasUI"and layout-related properties like"layoutType","layoutStyle", and"responsiveBehavior"are crucial for ensuring that the widgets are rendered correctly in different environments and screen sizes. It's important to validate these against the actual application styles to ensure accuracy.Documentation and Tags: The use of
"tags"such as"Toggles"and"Layout"helps categorize the widgets, which can be useful for organizing tests or for specific targeted testing strategies.Overall, the JSON fixture file is robust and appears well-prepared for use in testing the checkbox widgets in various configurations and states. Ensure that all properties and values accurately reflect the real application components and behaviors to maintain the effectiveness of the tests.
| @@ -19,7 +19,7 @@ export const Label = (props: LabelProps) => { | |||
| elementType="label" | |||
| {...rest} | |||
| > | |||
| <Text fontWeight={600} size="caption"> | |||
| <Text fontWeight={600} lineClamp={1} size="caption"> | |||
There was a problem hiding this comment.
Optimize Boolean usage in conditional rendering.
The Boolean calls are redundant and can be removed for cleaner code.
- if (!Boolean(text) && !Boolean(contextualHelp)) return null;
+ if (!text && !contextualHelp) return null;Committable suggestion was skipped due to low confidence.
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "kwe9ghj6mq", | ||
| "widgetType": "WDS_SWITCH_WIDGET" | ||
| } | ||
| ], | ||
| "allowedWidgetTypes": [ | ||
| "SMALL_WIDGETS" | ||
| ], | ||
| "maxChildLimit": 0 | ||
| } | ||
| ], | ||
| "layoutId": "eumhrzwpj7", | ||
| "layoutStyle": { | ||
| "border": "none", | ||
| "height": "100%" | ||
| }, | ||
| "layoutType": "ZONE" | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", | ||
| "mobileLeftColumn": 0 | ||
| } | ||
| ], | ||
| "elevatedBackground": false, | ||
| "key": "rtjfnota6o", | ||
| "isDeprecated": false, | ||
| "rightColumn": 64, | ||
| "detachFromLayout": false, | ||
| "widgetId": "autojzw60p", | ||
| "onCanvasUI": { | ||
| "selectionBGCSSVar": "--on-canvas-ui-section-selection", | ||
| "focusBGCSSVar": "--on-canvas-ui-section-focus", | ||
| "selectionColorCSSVar": "--on-canvas-ui-section-focus", | ||
| "focusColorCSSVar": "--on-canvas-ui-section-selection", | ||
| "disableParentSelection": true | ||
| }, | ||
| "zoneCount": 4, | ||
| "isVisible": true, | ||
| "version": 1, | ||
| "parentId": "0", | ||
| "tags": [ | ||
| "Layout" | ||
| ], | ||
| "renderMode": "CANVAS", | ||
| "isLoading": false, | ||
| "mobileTopRow": 0, | ||
| "layout": [ | ||
| { | ||
| "isContainer": true, | ||
| "isDropTarget": true, | ||
| "isPermanent": true, | ||
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "q2r1qsx1up", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "109g5fcqtb", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "ja7skxbz57", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "pxczuzucmh", | ||
| "widgetType": "ZONE_WIDGET" | ||
| } | ||
| ], | ||
| "layoutId": "9ysol23e0n", | ||
| "layoutStyle": { | ||
| "border": "none" | ||
| }, | ||
| "layoutType": "SECTION", | ||
| "maxChildLimit": 4 | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "mobileLeftColumn": 0, | ||
| "spaceDistributed": { | ||
| "q2r1qsx1up": 3, | ||
| "109g5fcqtb": 3, | ||
| "ja7skxbz57": 3, | ||
| "pxczuzucmh": 3 | ||
| } | ||
| } | ||
| ] | ||
| }, | ||
| "layoutOnLoadActions": [], | ||
| "layoutOnLoadActionErrors": [], | ||
| "id": "667c051c9da472349cd2d640", | ||
| "userPermissions": [] | ||
| } |
There was a problem hiding this comment.
Tip
Codebase Verification
Issues Found in Widget Configurations
The JSON file contains several issues that need to be addressed to ensure proper functionality and consistency of the widgets:
-
Duplicate Widget IDs: The following widget IDs are duplicated, which can lead to conflicts:
09nss42ws70o5qjtqm6p109g5fcqtb3wpbc1xq7k4v92cbyz347yo15l9bj08b325g99w88eo6finlav9mv6wcg6yxacbzwob2viautojzw60pbnakylghooc951m95mmvdiuo2u3sdwdwh9klrqmdgfiw64jvqbhdeg2mhqw3ja7skxbz57kwe9ghj6mqleexrfs5n3mvrifip5m8n19s98bol6nd1hd766lhnpu5el497bofvmji95klov1k2l62f5pxczuzucmhq2r1qsx1upq508nkw2jxr3zw697c1qrknrktein9rrka0cwkjpt2ysaz01fot3kje3yseytjijzml7u1uh3rvqeufjus1k85awkgwxzm34bcrjx8ifqrcrkrxhntjtex7ixhy4d9jo9t
Action: Ensure all widget IDs are unique across the entire JSON structure.
-
Inconsistent Boolean Properties: The following widgets have inconsistencies in their boolean properties:
- Missing
isDisabledordefaultSwitchStateproperties:rknrktein9leexrfs5n309nss42ws7n19s98bol6q508nkw2jxtjijzml7u14v92cbyz34ov1k2l62f57yo15l9bj0autojzw60pq2r1qsx1up109g5fcqtbja7skxbz57pxczuzucmh
Action: Ensure that all widgets have consistent boolean properties (
isVisible,isDisabled,defaultSwitchState) set according to the design specifications. - Missing
Please address these issues to ensure the integrity and functionality of the widget configurations.
Analysis chain
Comprehensive Review of JSON Structure and Widget Configurations
The JSON file provides a detailed configuration for various widgets and their layout properties. It is crucial to ensure that all widget IDs are unique and that properties like dynamicHeight, isVisible, isDisabled, and labelPosition are correctly set according to the requirements. Moreover, the onCanvasUI settings should be consistent across widgets to ensure uniform behavior on the canvas.
- Ensure all
widgetIdvalues are unique across the document to prevent conflicts. - Verify that
isVisible,isDisabled, and other boolean properties reflect the intended visibility and functionality states. - Check that
dynamicHeightsettings are appropriate for the widgets' expected behavior in different screen sizes. - Confirm that
labelPositionsettings are consistent and meet the design specifications. - Review
onCanvasUIsettings for consistency in UI behavior across different widgets.
Considering the complexity and potential impact of misconfigurations in this JSON, it's recommended to validate these settings against the UI requirements and widget behavior specifications.
Detailed Review of Widget ID Uniqueness and Boolean Properties
The initial script indicates potential issues with widget ID uniqueness and boolean property consistency. Given the complexity of the JSON structure, a more thorough examination is required.
- Widget ID Uniqueness: The current check shows only 4 unique widget IDs, which seems incorrect. We need to ensure all widget IDs across the entire JSON structure are considered.
- Boolean Properties: The boolean properties validation returned
false. We need to identify which specific properties are inconsistent.
Next Steps
- Comprehensive Widget ID Check: Ensure all widget IDs are unique across the entire JSON structure.
- Detailed Boolean Properties Validation: Identify specific inconsistencies in
isVisible,isDisabled, anddefaultSwitchState.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Validate uniqueness of widget IDs and consistency of boolean properties.
# Check for duplicate widget IDs
echo "Checking for duplicate widget IDs:"
jq '[.dsl.layout[] | .. | .widgetId? | select(.)] | unique | length' app/client/cypress/fixtures/anvilRadioGroupWidget.json
# Validate boolean properties
echo "Validating boolean properties:"
jq '[.dsl.layout[] | .. | .isVisible?, .isDisabled?, .defaultSwitchState?] | all' app/client/cypress/fixtures/anvilRadioGroupWidget.json
Length of output: 422
Script:
#!/bin/bash
# Comprehensive check for unique widget IDs across the entire JSON structure.
echo "Checking for duplicate widget IDs comprehensively:"
jq '[.. | .widgetId? | select(.)] | group_by(.) | map({id: .[0], count: length}) | map(select(.count > 1))' app/client/cypress/fixtures/anvilRadioGroupWidget.json
# Detailed validation of boolean properties to identify inconsistencies.
echo "Validating boolean properties in detail:"
jq '[.. | {widgetId: .widgetId?, isVisible: .isVisible?, isDisabled: .isDisabled?, defaultSwitchState: .defaultSwitchState?} | select(.isVisible != null or .isDisabled != null or .defaultSwitchState != null)]' app/client/cypress/fixtures/anvilRadioGroupWidget.json
Length of output: 7434
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts
jsartisan
added
ok-to-test
There was a problem hiding this comment.
Please add check for components with long long value text.
|
/build-deploy-preview skip-tests=true |
|
Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/9707109390. |
|
Deploy-Preview-URL: https://ce-34528.dp.appsmith.com |
There was a problem hiding this comment.
Actionable comments posted: 2
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (18)
app/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchoGroupWidgetPreview.snap.pngis excluded by!**/*.png
Files selected for processing (8)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilRadioGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json (1 hunks)
Files not summarized due to errors (3)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilRadioGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json: Error: Message exceeds token limit
Files skipped from review as they are similar to previous changes (5)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts
Additional comments not posted (20)
app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (2)
273-273: Consider shortening thelabelvalue.The
labelvalue is excessively long, which may affect the UI rendering and readability. Consider shortening it or using a more concise description.- "label": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s" + "label": "Lorem Ipsum is simply dummy text of the printing and typesetting industry."
436-437: Shorten thelabelvalue for better readability.The
labelvalue is very long and may impact the UI. Consider shortening it to improve readability and presentation.- "label": "Green with but long label that can't fit at all and it will need a very big space to fill it and we can't afford that right now. But surely in future" + "label": "Green with a long label that can't fit at all"app/client/cypress/fixtures/anvilSwitchGroupWidget.json (5)
3-17: Ensure logical values for main container properties.The properties for the main container look logical and consistent. However, verify if
rightColumn: 4896andminHeight: 1292are appropriate for your layout.
18-101: Verify layout structure consistency.The layout structure appears to be well-organized. Ensure that each
layoutIdandwidgetIdis unique and correctly referenced.
107-924: Check widget properties and consistency.The widget properties for various switch groups are defined consistently. Ensure that the
widgetId,options, anddefaultSelectedValuesare correct and match the intended design.
202-208: Verify onCanvasUI properties.The
onCanvasUIproperties are defined to control the appearance and behavior of widgets on the canvas. Ensure that the CSS variables and settings are correctly applied.Also applies to: 394-400, 458-464, 522-528, 586-592, 650-656, 714-720, 778-784, 840-846, 902-908, 960-966, 1002-1008, 1044-1050, 1056-1062, 1068-1074, 1080-1086, 1090-1096, 1147-1153, 1175-1181, 1255-1261, 1326-1332, 1387-1393, 1457-1463, 1510-1516, 1575-1581, 1638-1644, 1705-1711, 1768-1774, 1821-1827, 1879-1885, 1932-1938, 1980-1986, 2033-2039, 2085-2091, 2147-2153, 2207-2213, 2267-2273, 2329-2335, 2397-2403, 2459-2465, 2521-2527, 2581-2587, 2641-2647
217-223: Check responsive behavior and dynamic properties.The responsive behavior and dynamic properties are essential for ensuring the layout adapts correctly to different screen sizes and dynamic content. Verify that these properties are correctly defined and logical.
Also applies to: 265-271, 327-333, 389-395, 453-459, 517-523, 581-587, 645-651, 709-715, 773-779, 835-841, 897-903, 961-967, 1003-1009, 1057-1063, 1069-1075, 1081-1087, 1091-1097, 1148-1154, 1176-1182, 1256-1262, 1327-1333, 1388-1394, 1458-1464, 1511-1517, 1576-1582, 1639-1645, 1706-1712, 1769-1775, 1822-1828, 1880-1886, 1933-1939, 1981-1987, 2034-2040, 2086-2092, 2148-2154, 2208-2214, 2268-2274, 2330-2336, 2398-2404, 2460-2466, 2522-2528, 2582-2588, 2642-2648
app/client/cypress/fixtures/anvilRadioGroupWidget.json (13)
1-17: LGTM!The main container block properties are correctly defined.
18-101: LGTM!The layout block is well-structured and properties are correctly defined.
108-223: LGTM!The first radio group widget configuration is correctly defined with appropriate properties.
224-288: LGTM!The second radio group widget configuration is correctly defined with appropriate properties and horizontal orientation.
289-353: LGTM!The third radio group widget configuration is correctly defined with a long label text.
354-418: LGTM!The fourth radio group widget configuration is correctly defined with an empty
defaultOptionValueand marked as required.
419-484: LGTM!The fifth radio group widget configuration is correctly defined with a
labelTooltipproperty.
485-550: LGTM!The sixth radio group widget configuration is correctly defined with a long label text for one of the options.
551-680: LGTM!The seventh radio group widget configuration is correctly defined and marked as disabled.
681-745: LGTM!The eighth radio group widget configuration is correctly defined and consistent with the previous ones.
1080-1151: LGTM!The first additional section configuration is correctly defined and consistent with the previous sections.
1152-1209: LGTM!The second additional section configuration is correctly defined and consistent with the previous sections.
1210-1279: LGTM!The third additional section configuration is correctly defined and consistent with the previous sections.
| "orientation": "vertical", | ||
| "isDeprecated": false, | ||
| "rightColumn": 64, | ||
| "defaultSelectedValues": "[]", |
There was a problem hiding this comment.
Fix the defaultSelectedValues format.
The defaultSelectedValues should be an array, not a string. This ensures consistency and correctness in the configuration.
- "defaultSelectedValues": "[]"
+ "defaultSelectedValues": []Also applies to: 579-579, 697-697, 1589-1589, 1739-1739, 2423-2423
| "layout": [ | ||
| { | ||
| "insertChild": true, | ||
| "layoutId": "6ipjvsr5n2", | ||
| "layoutType": "ALIGNED_WIDGET_ROW", | ||
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "yjee6u04ll", | ||
| "widgetType": "WDS_CHECKBOX_GROUP_WIDGET" | ||
| } | ||
| ], | ||
| "allowedWidgetTypes": [ | ||
| "SMALL_WIDGETS" | ||
| ], | ||
| "maxChildLimit": 0 | ||
| } | ||
| ], | ||
| "layoutId": "0vco5pd3j0", | ||
| "layoutStyle": { | ||
| "border": "none", | ||
| "height": "100%" | ||
| }, | ||
| "layoutType": "ZONE" | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", | ||
| "mobileLeftColumn": 0 | ||
| } | ||
| ], | ||
| "elevatedBackground": false, | ||
| "key": "12qdw3rl11", | ||
| "isDeprecated": false, | ||
| "rightColumn": 64, | ||
| "detachFromLayout": false, | ||
| "widgetId": "28yordwvh4", | ||
| "onCanvasUI": { | ||
| "selectionBGCSSVar": "--on-canvas-ui-section-selection", | ||
| "focusBGCSSVar": "--on-canvas-ui-section-focus", | ||
| "selectionColorCSSVar": "--on-canvas-ui-section-focus", | ||
| "focusColorCSSVar": "--on-canvas-ui-section-selection", | ||
| "disableParentSelection": true | ||
| }, | ||
| "zoneCount": 4, | ||
| "isVisible": true, | ||
| "version": 1, | ||
| "parentId": "0", | ||
| "tags": [ | ||
| "Layout" | ||
| ], | ||
| "renderMode": "CANVAS", | ||
| "isLoading": false, | ||
| "mobileTopRow": 0, | ||
| "layout": [ | ||
| { | ||
| "isContainer": true, | ||
| "isDropTarget": true, | ||
| "isPermanent": true, | ||
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "856fqosdta", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "rp3tcirrjc", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "o4hk915hmg", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "sjldys00vh", | ||
| "widgetType": "ZONE_WIDGET" | ||
| } | ||
| ], | ||
| "layoutId": "g0v1kaychv", | ||
| "layoutStyle": { | ||
| "border": "none" | ||
| }, | ||
| "layoutType": "SECTION", | ||
| "maxChildLimit": 4 | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "mobileLeftColumn": 0, | ||
| "spaceDistributed": { | ||
| "856fqosdta": 3, | ||
| "rp3tcirrjc": 3, | ||
| "o4hk915hmg": 3, | ||
| "sjldys00vh": 3 | ||
| } | ||
| } | ||
| ] | ||
| } |
There was a problem hiding this comment.
Tip
Codebase Verification
Duplicate widgetId values detected.
The widgetId values must be unique across the entire configuration. The following widgetId values are duplicated, which can lead to conflicts and unexpected behavior in the tests:
- 01bn4j9hzo
- 1xx26fg0d3
- 28yordwvh4
- 2ta9kmbdu5
- 3eivsglfnk
- 5bqafbq918
- 5gwpcsk6yt
- 6t2m3q7gl5
- 7ebcy69pay
- 856fqosdta
- 9qhaxmx3oy
- b9mpxq6uxh
- c4frnxuh9b
- egywey00ye
- etwdwadqqr
- lpidrr9cob
- mydb6vt3t5
- o4hk915hmg
- qdy9ygm841
- ronwkiluky
- rp3tcirrjc
- rr3775j6f0
- sjldys00vh
- tvnnhgepbk
- u0k4ckzrtt
- udbsavpc11
- uwh3xa8np6
- x10gwfepdz
- xyxfdouuyp
- y94wadfgir
- yjee6u04ll
- z8lu5ij5e0
- zfnmm75br5
Please ensure that all widgetId values are unique.
Analysis chain
Ensure the uniqueness of widgetId values.
The widgetId values must be unique across the entire configuration. Duplicate widgetId values can lead to conflicts and unexpected behavior in the tests.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify the uniqueness of `widgetId` values in the JSON configuration.
# Test: Extract and count unique `widgetId` values. Expect: No duplicates.
jq -r '.. | .widgetId? // empty' app/client/cypress/fixtures/anvilCheckboxGroupWidget.json | sort | uniq -d
Length of output: 472
KelvinOm
force-pushed
the
chore/group-widgets-tests
branch
from
1325382
to
c492575
Compare
There was a problem hiding this comment.
Actionable comments posted: 6
Outside diff range and nitpick comments (5)
app/client/cypress/fixtures/anvilSwitchGroupWidget.json (5)
7-7: Consider specifying a background color.The
backgroundColoris set to "none". Consider specifying a background color for better clarity and consistency.- "backgroundColor": "none" + "backgroundColor": "transparent"
12-12: Specify container style explicitly.The
containerStyleis set to "none". Consider specifying the style explicitly for better readability.- "containerStyle": "none" + "containerStyle": "default"
35-35: Specify layout type explicitly.The
layoutTypeis set to "WIDGET_ROW". Consider specifying the type explicitly for better readability.- "layoutType": "WIDGET_ROW" + "layoutType": "ROW_WIDGET"
124-124: Consider settinghideCardto false.The
hideCardproperty is set to true. Consider setting it to false for better visibility during development.- "hideCard": true + "hideCard": false
274-274: Consider shortening the label.The label text is very long. Consider shortening it for better readability and user experience.
- "label": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book." + "label": "Lorem Ipsum is simply dummy text of the printing and typesetting industry."
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (30)
app/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxGroupWidgetSnapshot_spec.ts/anvilCheckboxGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilCheckboxWidgetSnapshot_spec.ts/anvilCheckboxWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilRadioGroupWidgetSnapshot_spec.ts/anvilRadioGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchGroupWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchGroupWidgetSnapshot_spec.ts/anvilSwitchoGroupWidgetPreview.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetCanvas.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetCanvasDark.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeployipad-2.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeployiphone-6.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetDeploymacbook-13.snap.pngis excluded by!**/*.pngapp/client/cypress/snapshots/AnvilSwitchWidgetSnapshot_spec.ts/anvilSwitchWidgetPreview.snap.pngis excluded by!**/*.png
Files selected for processing (13)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts (1 hunks)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilCheckboxWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilRadioGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json (1 hunks)
- app/client/cypress/fixtures/anvilSwitchWidget.json (1 hunks)
- app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts (1 hunks)
- app/client/packages/design-system/widgets/src/components/Label/src/Label.tsx (1 hunks)
- app/client/src/widgets/wds/WDSSwitchWidget/widget/index.tsx (1 hunks)
Files not summarized due to errors (5)
- app/client/cypress/fixtures/anvilCheckboxGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilCheckboxWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilRadioGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilSwitchGroupWidget.json: Error: Message exceeds token limit
- app/client/cypress/fixtures/anvilSwitchWidget.json: Error: Message exceeds token limit
Files skipped from review due to trivial changes (1)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchWidgetSnapshot_spec.ts
Files skipped from review as they are similar to previous changes (7)
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxGroupWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilCheckboxWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilRadioGroupWidgetSnapshot_spec.ts
- app/client/cypress/e2e/Regression/ClientSide/Anvil/Widgets/AnvilSwitchGroupWidgetSnapshot_spec.ts
- app/client/cypress/support/Pages/Anvil/AnvilSnapshot.ts
- app/client/packages/design-system/widgets/src/components/Label/src/Label.tsx
- app/client/src/widgets/wds/WDSSwitchWidget/widget/index.tsx
Additional context used
Path-based instructions (5)
app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (1)
Pattern
app/client/cypress/**/**.*: Follow best practices for Cypress code and e2e automation.
Avoid using cy.wait in code.
Avoid using cy.pause in code.
Use variables for locators, not strings.
Usedata-*attributes for selectors; avoid Xpaths and CSS attributes.
Avoid selectors like.btn.submitorbutton[type=submit].
Perform logins via API withLoginFromAPI.
Only interact with controlled sites/servers.
Ensure tests can run withit.onlyand are independent.
Usebefore,beforeEach,after,afterEachcorrectly; clean state before tests.
Check new specs for flakiness by running them 10 times on CI.
Use multiple assertions; don't treat Cypress as unit tests.
Use constants for strings.
Include datasource operations inbeforehooks.app/client/cypress/fixtures/anvilSwitchGroupWidget.json (1)
Pattern
app/client/cypress/**/**.*: Follow best practices for Cypress code and e2e automation.
Avoid using cy.wait in code.
Avoid using cy.pause in code.
Use variables for locators, not strings.
Usedata-*attributes for selectors; avoid Xpaths and CSS attributes.
Avoid selectors like.btn.submitorbutton[type=submit].
Perform logins via API withLoginFromAPI.
Only interact with controlled sites/servers.
Ensure tests can run withit.onlyand are independent.
Usebefore,beforeEach,after,afterEachcorrectly; clean state before tests.
Check new specs for flakiness by running them 10 times on CI.
Use multiple assertions; don't treat Cypress as unit tests.
Use constants for strings.
Include datasource operations inbeforehooks.app/client/cypress/fixtures/anvilCheckboxWidget.json (1)
Pattern
app/client/cypress/**/**.*: Follow best practices for Cypress code and e2e automation.
Avoid using cy.wait in code.
Avoid using cy.pause in code.
Use variables for locators, not strings.
Usedata-*attributes for selectors; avoid Xpaths and CSS attributes.
Avoid selectors like.btn.submitorbutton[type=submit].
Perform logins via API withLoginFromAPI.
Only interact with controlled sites/servers.
Ensure tests can run withit.onlyand are independent.
Usebefore,beforeEach,after,afterEachcorrectly; clean state before tests.
Check new specs for flakiness by running them 10 times on CI.
Use multiple assertions; don't treat Cypress as unit tests.
Use constants for strings.
Include datasource operations inbeforehooks.app/client/cypress/fixtures/anvilRadioGroupWidget.json (1)
Pattern
app/client/cypress/**/**.*: Follow best practices for Cypress code and e2e automation.
Avoid using cy.wait in code.
Avoid using cy.pause in code.
Use variables for locators, not strings.
Usedata-*attributes for selectors; avoid Xpaths and CSS attributes.
Avoid selectors like.btn.submitorbutton[type=submit].
Perform logins via API withLoginFromAPI.
Only interact with controlled sites/servers.
Ensure tests can run withit.onlyand are independent.
Usebefore,beforeEach,after,afterEachcorrectly; clean state before tests.
Check new specs for flakiness by running them 10 times on CI.
Use multiple assertions; don't treat Cypress as unit tests.
Use constants for strings.
Include datasource operations inbeforehooks.app/client/cypress/fixtures/anvilSwitchWidget.json (1)
Pattern
app/client/cypress/**/**.*: Follow best practices for Cypress code and e2e automation.
Avoid using cy.wait in code.
Avoid using cy.pause in code.
Use variables for locators, not strings.
Usedata-*attributes for selectors; avoid Xpaths and CSS attributes.
Avoid selectors like.btn.submitorbutton[type=submit].
Perform logins via API withLoginFromAPI.
Only interact with controlled sites/servers.
Ensure tests can run withit.onlyand are independent.
Usebefore,beforeEach,after,afterEachcorrectly; clean state before tests.
Check new specs for flakiness by running them 10 times on CI.
Use multiple assertions; don't treat Cypress as unit tests.
Use constants for strings.
Include datasource operations inbeforehooks.
Additional comments not posted (40)
app/client/cypress/fixtures/anvilCheckboxGroupWidget.json (12)
1-1: LGTM!The opening brace of the JSON object is correct.
2-2: LGTM!The key "dsl" with an opening brace for its value is correct.
3-3: LGTM!The key "widgetName" with the value "MainContainer" is correct.
4-4: LGTM!The key "backgroundColor" with the value "none" is correct.
5-5: LGTM!The key "rightColumn" with the value 4896 is correct.
30-30: Ensure uniquewidgetIdvalues.The
widgetId"01bn4j9hzo" is duplicated in the configuration. EachwidgetIdmust be unique to avoid conflicts and unexpected behavior.
323-323: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.
579-579: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.
697-697: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.
1589-1589: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.
1739-1739: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.
2423-2423: Fix thedefaultSelectedValuesformat.The
defaultSelectedValuesshould be an array, not a string. This ensures consistency and correctness in the configuration.app/client/cypress/fixtures/anvilSwitchGroupWidget.json (16)
3-6: EnsurerightColumnvalue is correct.The
rightColumnvalue of 4896 seems unusually high. Verify if this is intended.
16-16: Verify version number.The
versionis set to 89. Verify if this is the correct version number for the main container.
18-21: Verify layout type.The
layoutTypeis set to "ALIGNED_LAYOUT_COLUMN". Ensure this is the correct layout type for the intended design.
34-34: Check layout ID uniqueness.Ensure that the
layoutId"nj7p281sir" is unique within the configuration.
36-36: Verify child limit.The
maxChildLimitis set to 1. Verify if this is the correct limit for the intended design.
112-112: Ensure widget names are unique.The
widgetName"Section1" should be unique within the configuration to avoid conflicts.
176-176: Verify label position.The
labelPositionis set to "end". Verify if this is the correct position for the intended design.
225-225: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy" should be unique within the configuration to avoid conflicts.
625-625: Verify label tooltip.The
labelTooltipis set to "Tooltip". Verify if this is the correct tooltip text for the intended design.
1115-1115: Ensure widget IDs are unique.The
widgetId"452b0a5ud8" should be unique within the configuration to avoid conflicts.
1309-1309: Ensure widget names are unique.The
widgetName"Zone2Copy" should be unique within the configuration to avoid conflicts.
1570-1570: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy11Copy1" should be unique within the configuration to avoid conflicts.
1722-1722: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy11Copy2" should be unique within the configuration to avoid conflicts.
2110-2110: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy11Copy4" should be unique within the configuration to avoid conflicts.
2414-2414: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy11Copy6" should be unique within the configuration to avoid conflicts.
2566-2566: Ensure widget names are unique.The
widgetName"SwitchGroup1Copy11Copy7" should be unique within the configuration to avoid conflicts.app/client/cypress/fixtures/anvilCheckboxWidget.json (1)
2-2729: Ensure JSON validity and consistency.The JSON structure appears to be valid and consistent. Each widget and its properties are well-defined. However, ensure that the values, such as
widgetId,parentId, and other identifiers, are unique and correctly referenced.app/client/cypress/fixtures/anvilRadioGroupWidget.json (9)
3-3: Ensure widget name consistency.The
widgetNameproperty should be consistent across the project. Verify thatMainContaineris the intended name for this widget.
134-134: Ensure widget name consistency.The
widgetNameproperty should be consistent across the project. Verify thatZone1is the intended name for this widget.
163-223: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
227-288: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
357-418: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
292-353: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
488-550: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
554-615: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.
422-484: Ensure all options have unique keys.The
optionsarray should have unique keys for each option to avoid potential issues during rendering or interaction.app/client/cypress/fixtures/anvilSwitchWidget.json (2)
18-102: Verify the nested layout structure and widget configurations.The nested layout structure appears to be well-defined, but ensure that all widget properties and configurations are accurate and consistent with the expected test scenarios.
Verification successful
Verify the top-level layout properties and configurations.
The nested layout structure and widget properties appear correct. To ensure completeness, verify the top-level layout properties and configurations.
The nested layout structure and top-level properties are correctly defined.
- The nested structure includes proper alignment, widgetId, and widgetType properties.
- The top-level layout properties and configurations are consistent with the expected structure.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the nested layout structure and widget configurations in the JSON fixture. # Test: Validate the nested structure and widget properties. jq '.dsl.layout[] | .layout[] | .layout[]' app/client/cypress/fixtures/anvilSwitchWidget.jsonLength of output: 451
Script:
#!/bin/bash # Description: Verify the top-level layout properties and configurations in the JSON fixture. # Test: Validate the top-level layout properties. jq '.dsl.layout[] | {layoutId, layoutType, layoutStyle, isDropTarget, isPermanent, childTemplate}' app/client/cypress/fixtures/anvilSwitchWidget.jsonLength of output: 586
1-17: Ensure the main container widget properties are correct.The main container widget's properties seem correct, but it's crucial to verify that the values match the expected configuration for the test environment.
| "isDropTarget": true, | ||
| "isPermanent": true, | ||
| "layout": [ | ||
| { | ||
| "insertChild": true, | ||
| "layoutId": "fwgm23hrm8", | ||
| "layoutType": "ALIGNED_WIDGET_ROW", | ||
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "kwe9ghj6mq", | ||
| "widgetType": "WDS_SWITCH_WIDGET" | ||
| } | ||
| ], | ||
| "allowedWidgetTypes": [ | ||
| "SMALL_WIDGETS" | ||
| ], | ||
| "maxChildLimit": 0 | ||
| } | ||
| ], | ||
| "layoutId": "eumhrzwpj7", | ||
| "layoutStyle": { | ||
| "border": "none", | ||
| "height": "100%" | ||
| }, | ||
| "layoutType": "ZONE" | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}", | ||
| "mobileLeftColumn": 0 | ||
| } | ||
| ], | ||
| "elevatedBackground": false, | ||
| "key": "rtjfnota6o", | ||
| "isDeprecated": false, | ||
| "rightColumn": 64, | ||
| "detachFromLayout": false, | ||
| "widgetId": "autojzw60p", | ||
| "onCanvasUI": { | ||
| "selectionBGCSSVar": "--on-canvas-ui-section-selection", | ||
| "focusBGCSSVar": "--on-canvas-ui-section-focus", | ||
| "selectionColorCSSVar": "--on-canvas-ui-section-focus", | ||
| "focusColorCSSVar": "--on-canvas-ui-section-selection", | ||
| "disableParentSelection": true | ||
| }, | ||
| "zoneCount": 4, | ||
| "isVisible": true, | ||
| "version": 1, | ||
| "parentId": "0", | ||
| "tags": [ | ||
| "Layout" | ||
| ], | ||
| "renderMode": "CANVAS", | ||
| "isLoading": false, | ||
| "mobileTopRow": 0, | ||
| "layout": [ | ||
| { | ||
| "isContainer": true, | ||
| "isDropTarget": true, | ||
| "isPermanent": true, | ||
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "q2r1qsx1up", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "109g5fcqtb", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "ja7skxbz57", | ||
| "widgetType": "ZONE_WIDGET" | ||
| }, | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "pxczuzucmh", | ||
| "widgetType": "ZONE_WIDGET" | ||
| } | ||
| ], | ||
| "layoutId": "9ysol23e0n", | ||
| "layoutStyle": { | ||
| "border": "none" | ||
| }, | ||
| "layoutType": "SECTION", | ||
| "maxChildLimit": 4 | ||
| } | ||
| ], | ||
| "responsiveBehavior": "fill", | ||
| "mobileLeftColumn": 0, | ||
| "spaceDistributed": { | ||
| "q2r1qsx1up": 3, | ||
| "109g5fcqtb": 3, | ||
| "ja7skxbz57": 3, | ||
| "pxczuzucmh": 3 | ||
| } | ||
| } |
There was a problem hiding this comment.
Tip
Codebase Verification
Non-unique key property values in the JSON fixture
The key property is consistently set to p91243oe65 across multiple widgets, which is unusual since keys are typically unique. This could lead to conflicts and unexpected behavior during testing and rendering.
- Ensure that each widget has a unique
keyproperty value.
Analysis chain
Review the widget properties in each section.
The widget properties, such as widgetName, widgetId, label, and defaultSwitchState, should be verified for correctness and consistency. Ensure that these properties align with the test requirements.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify the widget properties in each section of the JSON fixture.
# Test: Validate the widget properties and ensure consistency.
jq '.dsl.children[] | .children[] | .children[]' app/client/cypress/fixtures/anvilSwitchWidget.json
Length of output: 32715
Script:
#!/bin/bash
# Description: Verify the uniqueness of the `key` property in the JSON fixture.
# Test: Search for all occurrences of the `key` property and list their values.
jq '.. | objects | .key?' app/client/cypress/fixtures/anvilSwitchWidget.json
Length of output: 1576
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "28yordwvh4", |
There was a problem hiding this comment.
Ensure unique widgetId values.
The widgetId "28yordwvh4" is duplicated in the configuration. Each widgetId must be unique to avoid conflicts and unexpected behavior.
- "widgetId": "28yordwvh4"
+ "widgetId": "<unique_id>"Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "widgetId": "28yordwvh4", | |
| "widgetId": "<unique_id>", |
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "7ebcy69pay", |
There was a problem hiding this comment.
Ensure unique widgetId values.
The widgetId "7ebcy69pay" is duplicated in the configuration. Each widgetId must be unique to avoid conflicts and unexpected behavior.
- "widgetId": "7ebcy69pay"
+ "widgetId": "<unique_id>"Committable suggestion was skipped due to low confidence.
| "rightColumn": 4896, | ||
| "snapColumns": 64, | ||
| "detachFromLayout": true, | ||
| "widgetId": "0", |
There was a problem hiding this comment.
Ensure unique widgetId values.
The widgetId "01bn4j9hzo" is duplicated in the configuration. Each widgetId must be unique to avoid conflicts and unexpected behavior.
- "widgetId": "01bn4j9hzo"
+ "widgetId": "<unique_id>"Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "widgetId": "0", | |
| "widgetId": "<unique_id>", |
| "layout": [ | ||
| { | ||
| "alignment": "start", | ||
| "widgetId": "y94wadfgir", |
There was a problem hiding this comment.
Ensure unique widgetId values.
The widgetId "y94wadfgir" is duplicated in the configuration. Each widgetId must be unique to avoid conflicts and unexpected behavior.
- "widgetId": "y94wadfgir"
+ "widgetId": "<unique_id>"Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "widgetId": "y94wadfgir", | |
| "widgetId": "<unique_id>", |
| "needsErrorInfo": false, | ||
| "boxShadow": "NONE", | ||
| "mobileBottomRow": 10, | ||
| "widgetName": "Section1", |
There was a problem hiding this comment.
Tip
Codebase Verification
Potential widget name inconsistency.
The widgetName property Section1 appears across multiple widget types, which may indicate a naming convention issue or a copy-paste error. Please review the following files for potential inconsistencies:
app/client/cypress/fixtures/anvilInlineButtonWidget.jsonapp/client/cypress/fixtures/anvilButtonWidget.jsonapp/client/cypress/fixtures/anvilCheckboxGroupWidget.jsonapp/client/cypress/fixtures/anvilSwitchGroupWidget.jsonapp/client/cypress/fixtures/anvilPhoneInputWidget.jsonapp/client/cypress/fixtures/anvilRadioGroupWidget.jsonapp/client/cypress/fixtures/anvilSwitchWidget.jsonapp/client/cypress/fixtures/anvilInputWidget.jsonapp/client/cypress/fixtures/anvilCurrencyInputWidget.jsonapp/client/cypress/fixtures/anvilCheckboxWidget.jsonapp/client/cypress/fixtures/anvilToolbarButtonWidget.jsonapp/client/cypress/fixtures/anvilIconButtonWidget.json
Please ensure that the widgetName property is unique and appropriately named for each widget type.
Analysis chain
Ensure widget name consistency.
The widgetName property should be consistent across the project. Verify that Section1 is the intended name for this widget.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify the consistency of the widget name `Section1` across the project.
# Test: Search for the widget name `Section1`. Expect: Consistent naming across the project.
rg --type json $'"widgetName": "Section1"'
Length of output: 1108
## Description 1. Add scripts for local e2e testing in the docker container. 2. Add types for cypress-image-snapshot In this PR, I also added the following PRS as they affect screenshot tests as well. I did this to speed up the process and unblock the team. #34528 #34546 #34676 #34729 #34638 #34639 #34511 To run E2E tests locally in docker, you need to do the following: 1. Run FE locally and prepare the tests for local launch. See the instructions [here](https://github.com/appsmithorg/appsmith/blob/release/contributions/ClientSetup.md). 2. Run `yarn cypress:snapshot:docker:build` — this will create a docker container with the necessary environment. 3. Run `yarn cypress:snapshot:docker "./cypress/e2e/Regression/ClientSide/Anvil/Widgets/*_spec.ts" updateSnapshots=false`. Here we can use the path to a specific file, or set `updateSnapshots=true` flag to update the screenshots. ## Automation /ok-to-test tags="@tag.Anvil" ### :mag: 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/9844579277> > Commit: 75f2659 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=9844579277&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Anvil` > Spec: > <hr>Mon, 08 Jul 2024 18:37:36 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added support for image snapshot testing with the `@types/cypress-image-snapshot` dependency. - **Refactor** - Updated test specifications by removing unnecessary `triggerInputInvalidState()` calls. - Reorganized and improved efficiency of image snapshot methods for various devices. - **Chores** - Updated `Dockerfile` to configure the Cypress environment with specific versions for dependencies. - Changed import paths in `e2e.js` for better module resolution. - **Style** - Fixed a comment typo in Cypress plugin configuration. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Pawan Kumar <[email protected]> Co-authored-by: unknown <[email protected]>
|
Merged here. |
## Description 1. Add scripts for local e2e testing in the docker container. 2. Add types for cypress-image-snapshot In this PR, I also added the following PRS as they affect screenshot tests as well. I did this to speed up the process and unblock the team. appsmithorg#34528 appsmithorg#34546 appsmithorg#34676 appsmithorg#34729 appsmithorg#34638 appsmithorg#34639 appsmithorg#34511 To run E2E tests locally in docker, you need to do the following: 1. Run FE locally and prepare the tests for local launch. See the instructions [here](https://github.com/appsmithorg/appsmith/blob/release/contributions/ClientSetup.md). 2. Run `yarn cypress:snapshot:docker:build` — this will create a docker container with the necessary environment. 3. Run `yarn cypress:snapshot:docker "./cypress/e2e/Regression/ClientSide/Anvil/Widgets/*_spec.ts" updateSnapshots=false`. Here we can use the path to a specific file, or set `updateSnapshots=true` flag to update the screenshots. ## Automation /ok-to-test tags="@tag.Anvil" ### :mag: 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/9844579277> > Commit: 75f2659 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=9844579277&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Anvil` > Spec: > <hr>Mon, 08 Jul 2024 18:37:36 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added support for image snapshot testing with the `@types/cypress-image-snapshot` dependency. - **Refactor** - Updated test specifications by removing unnecessary `triggerInputInvalidState()` calls. - Reorganized and improved efficiency of image snapshot methods for various devices. - **Chores** - Updated `Dockerfile` to configure the Cypress environment with specific versions for dependencies. - Changed import paths in `e2e.js` for better module resolution. - **Style** - Fixed a comment typo in Cypress plugin configuration. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Pawan Kumar <[email protected]> Co-authored-by: unknown <[email protected]>
/ok-to-test tags="@tag.Anvil"
Warning
Workflow run: https://github.com/appsmithorg/appsmith/actions/runs/9692797550
Commit: c5bba8f
Cypress dashboard.
Tags:
@tag.AnvilIt seems like no tests ran 😔. We are not able to recognize it, please check workflow here.
Summary by CodeRabbit
New Features
lineClampprop to theTextcomponent in theLabelwidget.Bug Fixes
WDSSwitchWidgetto include a newisSelectedprop, improving rendering logic.Tests