Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity
abff60b6a2
PromucFlow_constructor/app/client/cypress/locators/Widgets.json
Valera Melnikov 8be4936ca0
chore: add color validation + native color picker (#25355) 
## Description
1. Reduced the number of default colors. Because the amount of suggested
options was too much: very little difference between shades and
sometimes with hues too. By removing half of them, we allow builders
make better choices faster. The transparent color has also been removed.
2. Added validation of color values because HTML colors are remarkably
easy to get wrong, because they allow so many different values and now
we support and validate all these guys
    - `hex` - `#bada55`
    - `name` - `LightGoldenrodYellow`
    - `special name` - `currentColor`
    - `rgb` - `rgb(0 0 0)`
    - `rgba` - `rgba(0, 0, 0, .45)`
    - `hsl` - `hsl(4.71239rad, 60%, 70%)`
    - `hsla` - `hsla(180deg 100% 50% / .8)`
    - `hwb` - `hwb(180deg 0% 0% / 100%)`
    - `lab` - `lab(2000.1337% -8.6911 -159.131231 / .987189732)`
    - `lch` - `lch(54.292% 106.839 40.853)`
<img width="283" alt="Снимок экрана 2023-08-02 в 17 58 07"
src="https://github.com/appsmithorg/appsmith/assets/11555074/a8fef365-506d-432e-85ad-cdb550de1f60">
    
3. Added support for a Full color picker. Now we can easily switch
between modes and builders can easily choose any colors.
<img width="259" alt="Снимок экрана 2023-08-02 в 17 43 34"
src="https://github.com/appsmithorg/appsmith/assets/11555074/be09cd92-7c69-43eb-812a-0b1fe3ac9ef6">


#### PR fixes following issue(s)
Fixes  #22996

#### Media

https://www.loom.com/share/098e0116e49744e7b10689d4a18ab664?sid=15405577-160e-4b48-bfef-bc8dcfa97efe

#### Type of change
- New feature (non-breaking change which adds functionality)

## 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
- [x] Jest
- [x] Cypress

## Checklist:
#### Dev activity
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] 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
- [ ] 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
- [ ] 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

---------

Co-authored-by: Valera Melnikov <melnikov.vv@greendatasoft.ru>
2023-08-07 11:55:10 +03:00

205 lines
12 KiB
JSON
Raw Blame History

{
"NavHomePage": "[data-testid='t--default-home-icon']",
"containerWidget": ".t--draggable-containerwidget",
"inputWidget": ".t--draggable-inputwidgetv2",
"multiSelectWidget": ".t--draggable-multiselectwidgetv2",
"togglebutton": "input[type='checkbox']",
"showStepArrowsToggleCheckBox": ".t--property-control-showsteparrows input[type='checkbox']",
"inputPropsDataType": ".t--property-control-datatype input",
"inputdatatypeplaceholder": ".t--property-control-placeholder",
"buttonWidget": ".t--draggable-buttonwidget",
"buttonColor": ".t--property-control-buttoncolor [data-testid='t--color-picker-input']",
"checkboxWidget": ".t--draggable-checkboxwidget",
"buttonStyleDropdown": ".t--property-control-buttonstyle [name='downArrow']",
"buttonBackground": ".sc-ecQjpJ > div > .bp3-button",
"copyWidget": "[data-testid='t--copy-widget']",
"currencyInputWidget": ".t--draggable-currencyinputwidget",
"phoneInputWidget": ".t--draggable-phoneinputwidget",
"removeWidget": "[data-testid='t--delete-widget']",
"propertypaneText": ".t--propertypane .t--property-pane-view",
"formButtonWidget": ".t--widget-formbuttonwidget",
"textWidget": ".t--draggable-textwidget",
"tableWidget": ".t--draggable-tablewidget",
"tableWidgetV2": ".t--draggable-tablewidgetv2",
"jsonFormWidget": ".t--draggable-jsonformwidget",
"tableOnRowSelected": ".t--property-control-onrowselected",
"dropdownSelectButton": ".t--open-dropdown-Select",
"buttonOnClick": ".t--property-control-onclick .bp3-popover-target",
"buttonCreateApi": "a.t--create-api-btn",
"Scrollbutton": ".t--property-control-scrollcontents input",
"label": ".t--draggable-inputwidgetv2 label",
"labelColor": ".t--property-control-labelcolor input",
"inputval": ".t--draggable-inputwidgetv2 span.t--widget-name",
"dataclass": "'.bp3-input",
"datatype": ".t--property-control-datatype input",
"rowHeight": ".t--property-control-defaultrowheight .rc-select-selection-search-input ",
"innertext": ".t--draggable-inputwidgetv2 input",
"defaultinput": ".t--property-control-defaultinput",
"requiredjs": ".t--property-control-required input",
"visible": ".t--property-control-visible input",
"disable": ".t--property-control-disabled",
"menuColor": ".t--property-control-menucolor [data-testid='t--color-picker-input']",
"menubar": ".bp3-menu",
"menupop": ".bp3-popover",
"defaultcheck": ".t--property-control-defaultstate input",
"indicator": ".bp3-checkbox",
"Regex": ".t--property-control-regex .CodeMirror-lines",
"RadioInput": ".t--property-control-options input",
"checkboxInput": ".t--draggable-checkboxwidget span.t--widget-name",
"checkboxLabel": ".t--draggable-checkboxwidget label",
"containerD": ".t--widget-containerwidget div.style-container",
"containerWrapper": "div[data-testid='container-wrapper']",
"defaultInput": ".t--property-control-defaultvalue .CodeMirror-code",
"placeholder": ".t--property-control-placeholder .CodeMirror-code",
"inputLabelControl": ".t--property-control-text .CodeMirror-code",
"inputTextControl": ".t--property-control-text .CodeMirror-code",
"inputTooltipControl": ".t--property-control-tooltip .CodeMirror-code",
"inputButtonPos": ".t--draggable-inputwidgetv2 button",
"deleteWidget": ".t--modal-widget>div .t--widget-delete-control",
"textbuttonWidget": ".t--draggable-buttonwidget button.bp3-button[type='button']",
"textInputval": ".t--draggable-textwidget span.t--widget-name",
"textCenterAlign": "//span[@data-value='CENTER']/parent::div",
"ColumnAction": ".t--property-control-rowbutton button",
"SearchTextChangeAction": ".t--property-control-onsearchtextchanged button",
"tableSearchTextChangeSelected": ".t--property-control-onsearchtextchanged",
"videoWidget": ".t--draggable-videowidget",
"audioWidget": ".t--draggable-audiowidget",
"autoPlay": ".t--property-control-autoplay input",
"defaultOption": ".t--property-control-defaultoption .CodeMirror-code",
"dropdownSingleSelect": ".bp3-popover-target > div > .bp3-button",
"menuButton": ".bp3-popover2-target",
"defaultSingleSelectValue": ".bp3-popover-target > div > .bp3-button > .bp3-button-text",
"widgetBtn": ".t--widget-buttonwidget button",
"widgetBtnText": ".t--widget-buttonwidget button .bp3-button-text",
"iconWidgetBtn": ".t--draggable-iconbuttonwidget button",
"actionSelect": ".t--open-dropdown-Select-Action",
"inputOnTextChange": ".t--property-control-ontextchanged .t--open-dropdown-Select-Action",
"tableActionSelect": ".t--property-control-onsearchtextchanged .t--open-dropdown-Select-Action",
"chartWidget": ".t--widget-chartwidget",
"tableOnRowSelect": ".t--property-control-onrowselected .t--open-dropdown-Select-Action",
"switchInput": ".t--draggable-switchwidget span.t--widget-name",
"switchLabel": ".t--draggable-switchwidget label",
"multiSelectInput": ".t--draggable-multiselectwidget span.t--widget-name",
"multiSelectLabel": ".t--draggable-multiselectwidget label",
"addColumn": ".t--add-column-btn",
"deleteColumn": ".t--delete-column-btn",
"editCreatedColumn": ".t--property-control-createdcolumns input",
"alignOpt": ".t--dropdown-option",
"tableCol": ".draggable-header ",
"rightAlign": "//span[@data-value='RIGHT']/parent::div",
"leftAlign": "//span[@data-value='LEFT']/parent::div",
"bold": ".t--button-group-BOLD button",
"italics": ".t--button-group-ITALIC button",
"underline": ".t--button-group-UNDERLINE button",
"verticalTop": "[data-value='TOP']",
"verticalCenter": "[data-value='CENTER']",
"verticalBottom": "[data-value='BOTTOM']",
"textColor": ".t--property-control-textcolor [data-testid='t--color-picker-input']",
"boadercolorPicker": ".t--property-control-bordercolour input",
"boxShadowColorPicker": ".t--property-control-shadowcolor input",
"boxShadow": ".t--property-control-boxshadow .bp3-button-group",
"inputStepArrows": ".bp3-button-group",
"backgroundcolorPicker": ".t--property-control-backgroundcolour input",
"backgroundcolorPickerNew": ".t--property-control-backgroundcolor [data-testid='t--color-picker-input']",
"greenColorHex": "#03b365",
"yellowColorHex": "#FFC13D",
"greenColor": "//div[@color='#03b365']",
"yellowColor": "//div[@color='#FFC13D']",
"blueColor": "//div[@color='#3366FF']",
"toggleJsColor": ".t--property-control-textcolor .t--js-toggle",
"backgroundColor": ".t--property-control-cellbackground input",
"toggleJsBcgColor": ".t--property-control-cellbackground .t--js-toggle",
"toggleTextAlign": ".t--property-control-textalign .t--js-toggle",
"toggleTextStyle": ".t--property-control-emphasis .t--js-toggle",
"toggleTextStyle_tablev1": ".t--property-control-fontstyle .t--js-toggle",
"textSize": ".t--property-control-textsize .rc-select-selection-search-input",
"textSizeNew": ".t--property-control-fontsize div",
"toggleTextSize": ".t--property-control-textsize .t--js-toggle",
"toggleTextSizeNew": ".t--property-control-fontsize .t--js-toggle",
"toggleVerticalAlig": ".t--property-control-verticalalignment .t--js-toggle",
"toggleVisible": ".t--property-control-visible .t--js-toggle",
"backgroundJSVisible": ".t--property-control-background .t--js-toggle",
"itemBackgroundJSVisible": ".t--property-control-itembackground .t--js-toggle",
"inputToggleVisible": "div.t--property-control-visible div.CodeMirror-lines",
"toggleDisable": ".t--property-control-disabled .t--js-toggle",
"inputToggleDisable": "div.t--property-control-disabled div.CodeMirror-code pre span",
"toggleOnClick": ".t--property-control-onclick .t--js-toggle",
"toggleOnFocus": ".t--property-control-onfocus .t--js-toggle",
"toggleOnBlur": ".t--property-control-onblur .t--js-toggle",
"toggleOnDropdownOpen": ".t--property-control-ondropdownopen .t--js-toggle",
"toggleOnDropdownClose": ".t--property-control-ondropdownclose .t--js-toggle",
"toggleChartType": ".t--property-control-charttype .t--js-toggle",
"inputToggleOnClick": ".t--property-control-onclick div.CodeMirror-lines",
"tableBtn": ".t--draggable-tablewidget .bp3-button",
"tableV2Btn": ".t--draggable-tablewidgetv2 .bp3-button",
"tableIconBtn": ".t--draggable-tablewidget .bp3-icon",
"tableV2IconBtn": ".t--draggable-tablewidgetv2 .bp3-icon",
"toastAction": ".ads-v2-toast",
"toastActionText": ".ads-v2-toast .ads-v2-toast__body .ads-v2-text",
"defaultColName": "[data-rbd-draggable-id='customColumn1'] input",
"defaultColNameV2": "[data-rbd-draggable-id='customColumn1'] input[type='text']",
"selectWidget": ".t--open-dropdown-Select-widget",
"switchWidget": ".t--widget-switchwidget",
"toastMsg": ".ads-v2-toast .ads-v2-toast__body .ads-v2-text",
"deleteToast": "div[class = 'undo-section'] span[type='h6']",
"apiCallToast": ".ads-v2-toast .ads-v2-toast__body .ads-v2-text",
"datepickerInput": ".t--draggable-datepickerwidget2 input",
"selectToday": ".DayPicker-Day--today",
"switchWidgetActive": ".t--switch-widget-active",
"switchWidgetInactive": ".t--switch-widget-inactive",
"switchWidgetLoading": ".t--switch-widget-loading",
"colorsAvailable": ".bp3-popover-dismiss",
"listWidget": "[type=LIST_WIDGET]",
"itemContainerWidget": ".t--widget-containerwidget div.style-container",
"listWidgetName": ".t--property-pane-title",
"toggleBackground": ".t--property-control-background .t--js-toggle",
"toggleItemBackground": ".t--property-control-itembackground .t--js-toggle",
"toggleShowStepArrows": ".t--property-control-showsteparrows .t--js-toggle",
"chartDataPoint": "g path[d^='M100 205.51']",
"toggleEnableMultirowselection": ".t--property-control-enablemulti-rowselection input",
"toggleEnableMultirowselection_tablev1": ".t--property-control-enablemultirowselection input",
"formWidget": ".t--draggable-formwidget",
"searchField": "[type=search]",
"defaultSelectedRowField": ".t--property-control-defaultselectedrow .CodeMirror-line",
"selectedRow": ".selected-row",
"removeTableWidget": ".t--delete-widget",
"nextPageButton": ".t--table-widget-next-page",
"addWidget": ".t--entity.group.widgets .t--entity-add-btn",
"closeWidgetBar": ".t--close-widgets-sidebar",
"tabedataField": ".t--property-control-tabledata",
"exploreWidget": "[class$=bp3-panel-stack-view] > div:nth-child(1) > div:nth-child(1) > span:nth-child(4)",
"widgetRelatedDocument": "div.main > div:nth-child(1) > div:nth-child(1)",
"rowHeightShortOpt": ".bp3-popover-content > div > div:nth-child(1)",
"tbIndex0": "[class=td][data-colindex='0'][data-rowindex='0']",
"filterApplyBtn": ".t--apply-filter-btn",
"filterCloseBtn": ".t--close-filter-btn",
"header": "#header-root",
"mapChartPlot": "g[class$='-manager-plot']",
"modalWidget": ".t--modal-widget",
"tableFilterPaneToggle": ".t--table-filter-toggle-btn",
"tableFilterRow": ".t--table-filter",
"selectwidget": ".t--draggable-selectwidget",
"selectWidgetDisabled": ".t--property-control-disabled input",
"itemBackgroundColorToggle": ".t--property-control-itembackgroundcolor .t--js-toggle",
"backgroundColorToggle": ".t--property-control-background .t--js-toggle",
"backgroundColorToggleNew": ".t--property-control-backgroundcolor .t--js-toggle",
"backgroundColorToggleNew_tablev1": ".t--property-control-cellbackgroundcolor .t--js-toggle",
"cellBackground": ".t--property-control-backgroundcolor",
"cellBackground_tablev1": ".t--property-control-cellbackgroundcolor",
"cellBackgroundToggle": ".t--property-control-backgroundcolor .t--js-toggle",
"cellBackgroundToggle_tablev1": ".t--property-control-cellbackgroundcolor .t--js-toggle",
"borderColorPickerNew": ".t--property-control-bordercolor input",
"selectedTextSize": ".t--property-control-textsize .bp3-popover-target .sub-text",
"colorPickerV2Popover": ".t--colorpicker-v2-popover",
"colorPickerV2Color": ".t--colorpicker-v2-color",
"colorPickerV2PopoverContent": "[data-testid=\"color-picker\"]",
"colorPickerV2TailwindColor": ".t--tailwind-colors .t--colorpicker-v2-color",
"modalCloseButton": ".t--draggable-iconbuttonwidget .bp3-button",
"filepickerwidgetv2": ".t--widget-filepickerwidgetv2",
"filepickerwidgetv2CancelBtn": "button.uppy-DashboardContent-back",
"filepickerwidgetv2CloseModalBtn": "button.uppy-Dashboard-close",
"codescannerwidget": ".t--widget-codescannerwidget",
"widgetNameSpan": ".t--widget-propertypane-toggle > .t--widget-name",
"listWidgetv2": ".t--widget-listwidgetv2"
}
Reference in New Issue View Git Blame Copy Permalink