diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Onboarding/CreateNewApp_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Onboarding/CreateNewApp_spec.js index 8d6999348b..72e9d9e096 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Onboarding/CreateNewApp_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Onboarding/CreateNewApp_spec.js @@ -12,7 +12,7 @@ describe("Creating new app after discontinuing guided tour should not start the cy.get(commonlocators.homeIcon) .click({ force: true }) .wait(8000); //for page to settle! - datasources.CloseReconnectDataSourceModal() // Check if reconnect data source modal is visible and close it + datasources.CloseReconnectDataSourceModal(); // Check if reconnect data source modal is visible and close it cy.get(guidedTourLocators.welcomeTour) .click() .wait(2000); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ThemingTests/Basic_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ThemingTests/Basic_spec.js index 58b18d6230..1cf60401e1 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ThemingTests/Basic_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/ThemingTests/Basic_spec.js @@ -819,8 +819,8 @@ describe("App Theming funtionality", function() { //Change Border & verify - cy.get(".t--button-tab-0px").click(); - cy.get(".t--button-tab-0px") + cy.get(".t--button-group-0px").click(); + cy.get(".t--button-group-0px") .eq(0) .invoke("css", "border-top-left-radius") .then((borderRadius) => { @@ -842,8 +842,8 @@ describe("App Theming funtionality", function() { }); //Change Shadow & verify - cy.get(".t--button-tab-0.10px").click(); - cy.get(".t--button-tab-0.10px div") + cy.get(".t--button-group-0.10px").click(); + cy.get(".t--button-group-0.10px div") .eq(0) .invoke("css", "box-shadow") .then((boxshadow) => { @@ -1051,10 +1051,10 @@ describe("App Theming funtionality", function() { //Change Border & verify - cy.get(".t--button-tab-0\\.375rem") + cy.get(".t--button-group-0\\.375rem") .click() .wait(500); - cy.get(".t--button-tab-0\\.375rem div") + cy.get(".t--button-group-0\\.375rem div") .eq(0) .invoke("css", "border-top-left-radius") .then((borderRadius) => { @@ -1076,10 +1076,10 @@ describe("App Theming funtionality", function() { }); //Change Shadow & verify - cy.get(".t--button-tab-0.1px") + cy.get(".t--button-group-0.1px") .click() .wait(500); - cy.get(".t--button-tab-0.1px div") + cy.get(".t--button-group-0.1px div") .invoke("css", "box-shadow") .then((boxshadow) => { cy.get(widgetsPage.widgetBtn) diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_MenuButton_Width_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_MenuButton_Width_spec.js index f017266157..566a078274 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_MenuButton_Width_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_MenuButton_Width_spec.js @@ -60,7 +60,7 @@ describe("In a button group widget, menu button width", function() { const menuButtonId = "groupButton1"; // Change the first button type to menu cy.editColumn(menuButtonId); - cy.get(".t--button-tab-MENU").click({ force: true }); + cy.get(".t--button-group-MENU").click({ force: true }); cy.get(".t--add-menu-item-btn").click(); // Get the newly converted menu button cy.get(`.appsmith_widget_${widgetId} div.t--buttongroup-widget`) @@ -126,7 +126,7 @@ describe("In a button group widget, menu button width", function() { .click(); cy.moveToStyleTab(); // Change its orientation to vetical - cy.get(".t--button-tab-vertical").click({ force: true }); + cy.get(".t--button-group-vertical").click({ force: true }); // Get the default menu button cy.get(`.appsmith_widget_${widgetId} div.t--buttongroup-widget`) .children() diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_spec.js index 47215225f3..ce45898c1d 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/ButtonGroup_spec.js @@ -97,7 +97,7 @@ describe("Button Group Widget Functionality", function() { it("Update icon alignment and Verify buttons alignments", function() { // align right - cy.get(".t--property-control-position .t--button-tab-left") + cy.get(".t--property-control-position .t--button-group-left") .first() .click(); cy.wait(200); @@ -106,7 +106,7 @@ describe("Button Group Widget Functionality", function() { .eq(1) .should("have.css", "flex-direction", "row"); // align left - cy.get(".t--property-control-position .t--button-tab-right") + cy.get(".t--property-control-position .t--button-group-right") .last() .click(); cy.wait(200); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/Button_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/Button_spec.js index 20f2005983..5a135c3e0b 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/Button_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Button/Button_spec.js @@ -31,7 +31,7 @@ describe("Button Widget Functionality", function() { // Assert if the icon exists cy.get(`${widgetsPage.buttonWidget} .bp3-icon-add`).should("exist"); // Change icon alignment to right - cy.get(`${iconAlignmentProperty} .t--button-tab-right`) + cy.get(`${iconAlignmentProperty} .t--button-group-right`) .last() .click({ force: true, diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/CodeScanner/CodeScanner_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/CodeScanner/CodeScanner_spec.js index 787ca5083e..3e4ad93d8b 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/CodeScanner/CodeScanner_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/CodeScanner/CodeScanner_spec.js @@ -119,7 +119,7 @@ describe("Code Scanner widget's functionality", () => { // Select scanner layout as CLICK_TO_SCAN cy.get( - `${commonlocators.codeScannerScannerLayout} .t--button-tab-CLICK_TO_SCAN`, + `${commonlocators.codeScannerScannerLayout} .t--button-group-CLICK_TO_SCAN`, ) .last() .click({ diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Form/Form_With_CheckBox_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Form/Form_With_CheckBox_spec.js index 2f13d99e96..30a84ec360 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Form/Form_With_CheckBox_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Form/Form_With_CheckBox_spec.js @@ -34,7 +34,7 @@ describe("Checkbox Widget Functionality", function() { ); // align right - cy.get(".t--property-control-alignment .t--button-tab-RIGHT") + cy.get(".t--property-control-alignment .t--button-group-RIGHT") .first() .click(); cy.get(publish.checkboxWidget + " " + ".t--checkbox-widget-label").should( @@ -63,7 +63,7 @@ describe("Checkbox Widget Functionality", function() { .last() .click({ force: true }); cy.wait(200); - cy.get(".t--button-tab-Left").click({ force: true }); + cy.get(".t--button-group-Left").click({ force: true }); cy.wait(200); cy.PublishtheApp(); @@ -110,7 +110,7 @@ describe("Checkbox Widget Functionality", function() { it("6. Checkbox Functionality To change label style of checkbox", function() { cy.openPropertyPane("checkboxwidget"); cy.moveToStyleTab(); - cy.get(".t--property-control-emphasis .t--button-tab-BOLD").click({ + cy.get(".t--property-control-emphasis .t--button-group-BOLD").click({ force: true, }); cy.PublishtheApp(); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/MenuButton_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/MenuButton_spec.js index f42f7770fd..ae6d19f72e 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/MenuButton_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/MenuButton_spec.js @@ -23,7 +23,7 @@ describe("Menu Button Widget Functionality", () => { // Assert if the icon exists cy.get(`${formWidgetsPage.menuButtonWidget} .bp3-icon-add`).should("exist"); // Change its icon alignment to right - cy.get(".t--property-control-position .t--button-tab-right") + cy.get(".t--property-control-position .t--button-group-right") .last() .click({ force: true }); cy.wait(200); @@ -110,7 +110,9 @@ describe("Menu Button Widget Functionality", () => { cy.moveToContentTab(); // Select menu items source as Dynamic - cy.get(`${commonlocators.menuButtonMenuItemsSource} .t--button-tab-DYNAMIC`) + cy.get( + `${commonlocators.menuButtonMenuItemsSource} .t--button-group-DYNAMIC`, + ) .last() .click({ force: true, diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/Progress_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/Progress_spec.js index 2d4ec8fb62..fd0422d13d 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/Progress_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Others/Progress_spec.js @@ -66,7 +66,7 @@ describe("Progress Widget", function() { // Circular progress it("Property: type, Change type to Circular", function() { // Switch to circular mode - cy.get(".t--button-tab-circular").click({ force: true }); + cy.get(".t--button-group-circular").click({ force: true }); cy.get("[data-cy='circular']").should("exist"); }); it("Property: isIndeterminate, Toggle infinite loading", function() { diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/RTE/RichTextEditor_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/RTE/RichTextEditor_spec.js index 699c5627c6..5f27f01583 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/RTE/RichTextEditor_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/RTE/RichTextEditor_spec.js @@ -246,10 +246,10 @@ describe("RichTextEditor Widget Functionality", function() { // Changing the input type to markdown and again testing the cursor position cy.openPropertyPane("richtexteditorwidget"); - cy.get(".t--button-tab-markdown").click({ force: true }); + cy.get(".t--button-group-markdown").click({ force: true }); setRTEContent(testString); testCursorPoistion(testStringLen, tinyMceId); - cy.get(".t--button-tab-html").click({ force: true }); + cy.get(".t--button-group-html").click({ force: true }); }); it("13. Check if different font size texts are supported inside the RTE widget", function() { diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Switch/Switch_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Switch/Switch_spec.js index e166e1c363..726ca6a5ca 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Switch/Switch_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Switch/Switch_spec.js @@ -84,7 +84,7 @@ describe("Switch Widget Functionality", function() { "left", ); // align right - cy.get(".t--property-control-alignment .t--button-tab-RIGHT") + cy.get(".t--property-control-alignment .t--button-group-RIGHT") .first() .click(); cy.wait(200); @@ -106,7 +106,7 @@ describe("Switch Widget Functionality", function() { .last() .click({ force: true }); cy.wait(200); - cy.get(".t--button-tab-Left").click({ force: true }); + cy.get(".t--button-group-Left").click({ force: true }); cy.wait(200); cy.PublishtheApp(); cy.get(publish.switchwidget + " " + ".bp3-align-right").should("exist"); @@ -150,7 +150,7 @@ describe("Switch Widget Functionality", function() { it("11. Switch Functionality To change label style of switch", function() { cy.openPropertyPane("switchwidget"); cy.moveToStyleTab(); - cy.get(".t--property-control-emphasis .t--button-tab-BOLD").click({ + cy.get(".t--property-control-emphasis .t--button-group-BOLD").click({ force: true, }); cy.PublishtheApp(); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Image_resize_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Image_resize_spec.js index 527a108bb6..3862c9f182 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Image_resize_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Image_resize_spec.js @@ -14,17 +14,17 @@ describe("Table Widget Image Resize feature validation", function() { cy.editColumn("image"); cy.moveToStyleTab(); - cy.get(".t--button-tab-MEDIUM").click(); + cy.get(".t--button-group-MEDIUM").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "64px"); }); - cy.get(".t--button-tab-LARGE").click(); + cy.get(".t--button-group-LARGE").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "128px"); }); - cy.get(".t--button-tab-DEFAULT").click(); + cy.get(".t--button-group-DEFAULT").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "32px"); }); @@ -47,17 +47,17 @@ describe("Table Widget Image Resize feature validation", function() { cy.editColumn("image"); cy.moveToStyleTab(); - cy.get(".t--button-tab-MEDIUM").click(); + cy.get(".t--button-group-MEDIUM").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "64px"); }); - cy.get(".t--button-tab-LARGE").click(); + cy.get(".t--button-group-LARGE").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "128px"); }); - cy.get(".t--button-tab-DEFAULT").click(); + cy.get(".t--button-group-DEFAULT").click(); cy.getTableV2DataSelector("1", "3").then((selector) => { cy.get(`${selector} img`).should("have.css", "height", "32px"); }); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Inline_editing_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Inline_editing_spec.js index 4eca007482..e1493cc660 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Inline_editing_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/Inline_editing_spec.js @@ -307,26 +307,26 @@ describe("Table widget inline editing functionality", () => { cy.get(".t--property-control-updatemode .bp3-popover-target") .last() .click(); - cy.get(".t--button-tab-CUSTOM").click({ force: true }); + cy.get(".t--button-group-CUSTOM").click({ force: true }); cy.get("[data-rbd-draggable-id='EditActions1']").should("not.exist"); cy.makeColumnEditable("task"); cy.get("[data-rbd-draggable-id='EditActions1']").should("not.exist"); cy.get(".t--property-control-updatemode .bp3-popover-target") .last() .click(); - cy.get(".t--button-tab-ROW_LEVEL").click({ force: true }); + cy.get(".t--button-group-ROW_LEVEL").click({ force: true }); cy.get("[data-rbd-draggable-id='EditActions1']").should("exist"); cy.get(".t--property-control-updatemode .bp3-popover-target") .last() .click(); - cy.get(".t--button-tab-CUSTOM").click({ force: true }); + cy.get(".t--button-group-CUSTOM").click({ force: true }); cy.get("[data-rbd-draggable-id='EditActions1']").should("not.exist"); cy.makeColumnEditable("step"); cy.makeColumnEditable("task"); cy.get(".t--property-control-updatemode .bp3-popover-target") .last() .click(); - cy.get(".t--button-tab-ROW_LEVEL").click({ force: true }); + cy.get(".t--button-group-ROW_LEVEL").click({ force: true }); cy.get("[data-rbd-draggable-id='EditActions1']").should("not.exist"); }); @@ -787,7 +787,7 @@ describe("Table widget inline editing functionality", () => { cy.openPropertyPane("tablewidgetv2"); cy.makeColumnEditable("step"); - cy.get(".t--button-tab-CUSTOM").click({ force: true }); + cy.get(".t--button-group-CUSTOM").click({ force: true }); cy.wait(1000); // case 1: check if updatedRowIndex is 0, when cell at row 0 is updated. diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_GeneralProperty_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_GeneralProperty_spec.js index 4ec964242f..b589e0213b 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_GeneralProperty_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_GeneralProperty_spec.js @@ -186,7 +186,7 @@ describe("Table Widget property pane feature validation", function() { cy.get(widgetsPage.rowHeight) .last() .click({ force: true }); - cy.get(".t--button-tab-SHORT").click({ force: true }); + cy.get(".t--button-group-SHORT").click({ force: true }); cy.wait(2000); cy.PublishtheApp(); cy.readTableV2dataValidateCSS("0", "1", "height", "29px", true); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_spec.js index bf0ed0cb1d..11cddb29fa 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/TableV2_spec.js @@ -195,7 +195,7 @@ describe("Table Widget V2 Functionality", function() { cy.get(".t--property-pane-back-btn").click(); cy.makeColumnEditable("step"); - cy.get(".t--button-tab-ROW_LEVEL").click(); + cy.get(".t--button-group-ROW_LEVEL").click(); cy.get(".t--table-filter-columns-dropdown").click(); cy.get(".t--dropdown-option").should("not.contain", "Save / Discard"); }); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/checkboxCell_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/checkboxCell_spec.js index 5c5a4c8213..161f8b96e4 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/checkboxCell_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/checkboxCell_spec.js @@ -71,7 +71,7 @@ describe("Checkbox column type funtionality test", () => { .contains("STYLE") .click({ force: true }); // Check horizontal alignment - cy.get(".t--property-control-horizontalalignment .t--button-tab-CENTER") + cy.get(".t--property-control-horizontalalignment .t--button-group-CENTER") .first() .click(); @@ -80,7 +80,7 @@ describe("Checkbox column type funtionality test", () => { }); // Check vertical alignment - cy.get(".t--property-control-verticalalignment .t--button-tab-BOTTOM") + cy.get(".t--property-control-verticalalignment .t--button-group-BOTTOM") .first() .click(); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/switchCell_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/switchCell_spec.js index 9a3b247723..6215e506da 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/switchCell_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/columnTypes/switchCell_spec.js @@ -71,7 +71,7 @@ describe("Switch column type funtionality test", () => { .contains("STYLE") .click({ force: true }); // Check horizontal alignment - cy.get(".t--property-control-horizontalalignment .t--button-tab-CENTER") + cy.get(".t--property-control-horizontalalignment .t--button-group-CENTER") .first() .click(); @@ -80,7 +80,7 @@ describe("Switch column type funtionality test", () => { }); // Check vertical alignment - cy.get(".t--property-control-verticalalignment .t--button-tab-BOTTOM") + cy.get(".t--property-control-verticalalignment .t--button-group-BOTTOM") .first() .click(); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/pagesize_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/pagesize_spec.js index 551394d6fd..5e9b04bce9 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/pagesize_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/TableV2/pagesize_spec.js @@ -11,13 +11,13 @@ describe("Table widget v2", function() { cy.openPropertyPane("tablewidgetv2"); cy.moveToStyleTab(); - cy.get(".t--button-tab-SHORT").click({ force: true }); + cy.get(".t--button-group-SHORT").click({ force: true }); cy.get(".t--widget-textwidget .bp3-ui-text").should("contain", "7"); - cy.get(".t--button-tab-DEFAULT").click({ force: true }); + cy.get(".t--button-group-DEFAULT").click({ force: true }); cy.get(".t--widget-textwidget .bp3-ui-text").should("contain", "5"); - cy.get(".t--button-tab-TALL").click({ force: true }); + cy.get(".t--button-group-TALL").click({ force: true }); cy.get(".t--widget-textwidget .bp3-ui-text").should("contain", "4"); }); }); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_new_feature_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_new_feature_spec.js index d19a4eee98..07057540fb 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_new_feature_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_new_feature_spec.js @@ -137,7 +137,7 @@ describe("Text Widget color/font/alignment Functionality", function() { it("Test to validate enable scroll feature", function() { cy.moveToContentTab(); - cy.get(".t--button-tab-SCROLL").click({ force: true }); + cy.get(".t--button-group-SCROLL").click({ force: true }); cy.wait("@updateLayout"); cy.get(commonlocators.headingTextStyle).trigger("mouseover", { force: true, diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_truncate_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_truncate_spec.js index 24389115c7..fb5b9cdd92 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_truncate_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Text/Text_truncate_spec.js @@ -8,7 +8,7 @@ describe("Text Widget Truncate Functionality", function() { it("Check default overflow property is No overflow", function() { cy.openPropertyPane("textwidget"); - cy.get(".t--button-tab-NONE") + cy.get(".t--button-group-NONE") .last() .should("have.attr", "aria-selected", "true"); cy.closePropertyPane(); @@ -34,7 +34,7 @@ describe("Text Widget Truncate Functionality", function() { it("Enable Truncate Text option and Validate", function() { cy.wait(2000); cy.get("body").type("{esc}"); - cy.get(".t--button-tab-TRUNCATE").click({ force: true }); + cy.get(".t--button-group-TRUNCATE").click({ force: true }); cy.wait("@updateLayout"); cy.get( `.appsmith_widget_${dsl.dsl.children[0].widgetId} .t--widget-textwidget-truncate`, diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/WidgetCopyPaste_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/WidgetCopyPaste_spec.js index ded2d5f201..60f6586f20 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/WidgetCopyPaste_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/WidgetCopyPaste_spec.js @@ -166,4 +166,4 @@ describe("Widget Copy paste", function() { //verify a pasted list widget cy.get(widgetsPage.listWidget).should("have.length", 1); }); -}); \ No newline at end of file +}); diff --git a/app/client/cypress/integration/Smoke_TestSuite/ServerSideTests/OnLoadTests/JSOnLoad_cyclic_dependency_errors_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ServerSideTests/OnLoadTests/JSOnLoad_cyclic_dependency_errors_spec.js index 455ecc4821..4b9a290ea8 100644 --- a/app/client/cypress/integration/Smoke_TestSuite/ServerSideTests/OnLoadTests/JSOnLoad_cyclic_dependency_errors_spec.js +++ b/app/client/cypress/integration/Smoke_TestSuite/ServerSideTests/OnLoadTests/JSOnLoad_cyclic_dependency_errors_spec.js @@ -40,7 +40,7 @@ describe("Cyclic Dependency Informational Error Messagaes", function() { .last() .find(`${datasource.createQuery}`) .click({ force: true }); - + //Step5.1: Click the editing field cy.get(".t--action-name-edit-field").click({ force: true }); @@ -170,4 +170,4 @@ describe("Cyclic Dependency Informational Error Messagaes", function() { 1, ); }); -}); \ No newline at end of file +}); diff --git a/app/client/cypress/locators/Widgets.json b/app/client/cypress/locators/Widgets.json index 0979b26894..d550d7fa5d 100644 --- a/app/client/cypress/locators/Widgets.json +++ b/app/client/cypress/locators/Widgets.json @@ -58,7 +58,7 @@ "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": ".t--property-control-alignment .t--button-tab-CENTER", + "textCenterAlign": ".t--property-control-alignment .t--button-group-CENTER", "ColumnAction": ".t--property-control-rowbutton button", "SearchTextChangeAction": ".t--property-control-onsearchtextchanged button", "tableSearchTextChangeSelected": ".t--property-control-onsearchtextchanged", @@ -86,15 +86,15 @@ "editCreatedColumn": ".t--property-control-createdcolumns input", "alignOpt": ".t--dropdown-option", "tableCol": ".draggable-header ", - "centerAlign": ".t--button-tab-CENTER", - "rightAlign": ".t--button-tab-RIGHT", - "leftAlign": ".t--button-tab-LEFT", - "bold": ".t--button-tab-BOLD", - "italics": ".t--button-tab-ITALIC", - "underline": ".t--button-tab-UNDERLINE", - "verticalTop": ".t--button-tab-TOP", - "verticalCenter": ".t--button-tab-CENTER", - "verticalBottom": ".t--button-tab-BOTTOM", + "centerAlign": ".t--button-group-CENTER", + "rightAlign": ".t--button-group-RIGHT", + "leftAlign": ".t--button-group-LEFT", + "bold": ".t--button-group-BOLD", + "italics": ".t--button-group-ITALIC", + "underline": ".t--button-group-UNDERLINE", + "verticalTop": ".t--button-group-TOP", + "verticalCenter": ".t--button-group-CENTER", + "verticalBottom": ".t--button-group-BOTTOM", "textColor": ".t--property-control-textcolor input", "boadercolorPicker": ".t--property-control-bordercolour input", "boxShadowColorPicker": ".t--property-control-shadowcolor input", diff --git a/app/client/cypress/support/commands.js b/app/client/cypress/support/commands.js index 08d1e2c29d..6efd6291b0 100644 --- a/app/client/cypress/support/commands.js +++ b/app/client/cypress/support/commands.js @@ -1673,7 +1673,7 @@ Cypress.Commands.add("checkLabelForWidget", (options) => { const containerSelector = `${widgetSelector} ${options.containerSelector}`; const labelPositionSelector = ".t--property-control-position"; const labelAlignmentRightSelector = - ".t--property-control-alignment .t--button-tab-right"; + ".t--property-control-alignment .t--button-group-right"; const labelWidth = options.labelWidth; // Drag a widget @@ -1690,17 +1690,17 @@ Cypress.Commands.add("checkLabelForWidget", (options) => { .contains(labelText); // Set the label position: Auto - cy.get(".t--button-tab-Auto").click({ force: true }); + cy.get(".t--button-group-Auto").click({ force: true }); // Assert label position: Auto cy.get(containerSelector).should("have.css", "flex-direction", "column"); // Change the label position to Top - cy.get(".t--button-tab-Top").click({ force: true }); + cy.get(".t--button-group-Top").click({ force: true }); // Assert label position: Top cy.get(containerSelector).should("have.css", "flex-direction", "column"); // Change the label position to Left - cy.get(".t--button-tab-Left").click({ force: true }); + cy.get(".t--button-group-Left").click({ force: true }); // Assert label position: Left cy.get(containerSelector).should("have.css", "flex-direction", "row"); diff --git a/app/client/package.json b/app/client/package.json index 9558fd66c5..112df52f0a 100644 --- a/app/client/package.json +++ b/app/client/package.json @@ -46,7 +46,7 @@ "cypress-log-to-output": "^1.1.2", "dayjs": "^1.10.6", "deep-diff": "^1.0.2", - "design-system": "npm:@appsmithorg/design-system@1.0.41", + "design-system": "npm:@appsmithorg/design-system@1.0.42", "downloadjs": "^1.4.7", "draft-js": "^0.11.7", "exceljs-lightweight": "^1.14.0", diff --git a/app/client/src/ce/pages/AdminSettings/config/authentication/AuthPage.tsx b/app/client/src/ce/pages/AdminSettings/config/authentication/AuthPage.tsx index 516f5ff220..819ca8f274 100644 --- a/app/client/src/ce/pages/AdminSettings/config/authentication/AuthPage.tsx +++ b/app/client/src/ce/pages/AdminSettings/config/authentication/AuthPage.tsx @@ -212,7 +212,7 @@ export function AuthPage({ authMethods }: { authMethods: AuthMethodType[] }) { ) => { if ( - e.detail.component === "ButtonTab" && + e.detail.component === "ButtonGroup" && e.detail.event === DSEventTypes.KEYPRESS ) { emitInteractionAnalyticsEvent(this.componentRef.current, { @@ -80,7 +79,7 @@ class BorderRadiusOptionsControl extends BaseControl< public render() { return ( - { diff --git a/app/client/src/components/propertyControls/BoxShadowOptionsControl.tsx b/app/client/src/components/propertyControls/BoxShadowOptionsControl.tsx index da2e8bb236..ec4cae863e 100644 --- a/app/client/src/components/propertyControls/BoxShadowOptionsControl.tsx +++ b/app/client/src/components/propertyControls/BoxShadowOptionsControl.tsx @@ -1,10 +1,9 @@ import * as React from "react"; import BaseControl, { ControlData, ControlProps } from "./BaseControl"; -import { TooltipComponent } from "design-system"; +import { ButtonGroup, TooltipComponent } from "design-system"; import { boxShadowOptions } from "constants/ThemeConstants"; import CloseLineIcon from "remixicon-react/CloseLineIcon"; -import { ButtonTab } from "design-system"; import { DSEventDetail, DSEventTypes, @@ -58,7 +57,7 @@ class BoxShadowOptionsControl extends BaseControl< handleAdsEvent = (e: CustomEvent) => { if ( - e.detail.component === "ButtonTab" && + e.detail.component === "ButtonGroup" && e.detail.event === DSEventTypes.KEYPRESS ) { emitInteractionAnalyticsEvent(this.componentRef.current, { @@ -74,7 +73,7 @@ class BoxShadowOptionsControl extends BaseControl< public render() { return ( - { diff --git a/app/client/src/components/propertyControls/ButtonTabControl.tsx b/app/client/src/components/propertyControls/ButtonTabControl.tsx index 8b5020647e..1258cf88bd 100644 --- a/app/client/src/components/propertyControls/ButtonTabControl.tsx +++ b/app/client/src/components/propertyControls/ButtonTabControl.tsx @@ -1,6 +1,6 @@ import React from "react"; import BaseControl, { ControlData, ControlProps } from "./BaseControl"; -import { ButtonTab, ButtonTabOption } from "design-system"; +import { ButtonGroup, ButtonGroupOption } from "design-system"; import produce from "immer"; import { DSEventDetail, @@ -28,7 +28,7 @@ class ButtonTabControl extends BaseControl { handleAdsEvent = (e: CustomEvent) => { if ( - e.detail.component === "ButtonTab" && + e.detail.component === "ButtonGroup" && e.detail.event === DSEventTypes.KEYPRESS ) { emitInteractionAnalyticsEvent(this.componentRef.current, { @@ -67,7 +67,7 @@ class ButtonTabControl extends BaseControl { render() { const { options, propertyValue } = this.props; return ( - { } static getControlType() { - return "BUTTON_TABS"; + return "BUTTON_GROUP"; } static canDisplayValueInUI(config: ControlData, value: any): boolean { @@ -98,7 +98,7 @@ class ButtonTabControl extends BaseControl { } export interface ButtonTabControlProps extends ControlProps { - options: ButtonTabOption[]; + options: ButtonGroupOption[]; defaultValue: string; } diff --git a/app/client/src/components/propertyControls/IconTabControl.tsx b/app/client/src/components/propertyControls/IconTabControl.tsx index 50c7aa9aac..cb18d79b02 100644 --- a/app/client/src/components/propertyControls/IconTabControl.tsx +++ b/app/client/src/components/propertyControls/IconTabControl.tsx @@ -1,6 +1,6 @@ import React from "react"; import BaseControl, { ControlData, ControlProps } from "./BaseControl"; -import { ButtonTab, ButtonTabOption } from "design-system"; +import { ButtonGroup, ButtonGroupOption } from "design-system"; import { DSEventDetail, DSEventTypes, @@ -27,7 +27,7 @@ class IconTabControl extends BaseControl { handleAdsEvent = (e: CustomEvent) => { if ( - e.detail.component === "ButtonTab" && + e.detail.component === "ButtonGroup" && e.detail.event === DSEventTypes.KEYPRESS ) { emitInteractionAnalyticsEvent(this.componentRef.current, { @@ -52,7 +52,7 @@ class IconTabControl extends BaseControl { render() { const { fullWidth, options, propertyValue } = this.props; return ( - { } export interface IconTabControlProps extends ControlProps { - options: ButtonTabOption[]; + options: ButtonGroupOption[]; defaultValue: string; fullWidth: boolean; } diff --git a/app/client/src/components/propertyControls/LabelAlignmentOptionsControl.tsx b/app/client/src/components/propertyControls/LabelAlignmentOptionsControl.tsx index ffd8cfd6c5..9d5aa72c68 100644 --- a/app/client/src/components/propertyControls/LabelAlignmentOptionsControl.tsx +++ b/app/client/src/components/propertyControls/LabelAlignmentOptionsControl.tsx @@ -3,7 +3,7 @@ import styled from "styled-components"; import { Alignment } from "@blueprintjs/core"; import BaseControl, { ControlProps } from "./BaseControl"; -import { ButtonTab, ButtonTabOption } from "design-system"; +import { ButtonGroup, ButtonGroupOption } from "design-system"; import { DSEventDetail, DSEventTypes, @@ -22,7 +22,7 @@ const ControlContainer = styled.div` export interface LabelAlignmentOptionsControlProps extends ControlProps { propertyValue?: Alignment; - options: ButtonTabOption[]; + options: ButtonGroupOption[]; defaultValue: Alignment; } @@ -52,7 +52,7 @@ class LabelAlignmentOptionsControl extends BaseControl< handleAdsEvent = (e: CustomEvent) => { if ( - e.detail.component === "ButtonTab" && + e.detail.component === "ButtonGroup" && e.detail.event === DSEventTypes.KEYPRESS ) { emitInteractionAnalyticsEvent(this.componentRef.current, { @@ -70,7 +70,7 @@ class LabelAlignmentOptionsControl extends BaseControl< const { options, propertyValue } = this.props; return ( - {