Actions – Add-ons

Last Updated on August 8, 2024 by Parth Parikh

Manual Testing – Sections

  • UI Areas – what user sees in an area before taking any user action
  • Actions – changes that happen when user takes action in the UI
  • Testing Sequences – follow these sequences to test changes & releases
  • Logic – testing CF7 Skins Logic (both Backend & Frontend)
  • Testing Forms – CF7 Skins forms used to help with testing
  • Front End Forms – how CF7 Skins forms display on WordPress website
  • Responsive Styling – WP Backend/Admin at different screen sizes

ACTIONS #

Actions – show changes that happen when user operates the UI

Instructions: Manual Testing
Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\

Checklist #

Logic #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\

Checklist

React Version #

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\React Version\

  1. Logic Item
  2. Logic Statement

Logic Item #

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\React Version\Logic Item\

back to top

Logic Item (Logic Item_v0.1.0_2023-04-16.png)

Checklist #

Add Logic Item #

back to top

Checklist

  • Blank Logic Area
  • Click available Field
  • Drag available Field
  • Logic Item Added
Add Logic Item – Blank Logic Area (Add Logic – Blank Logic Area_v0.1.0_2023-04-16.png)
Add Logic Item – Click available Field (Add Logic -Click available Field_v0.1.0_2023-04-16.png)
Add Logic Item – Drag available Field (Add Logic – Drag available Field_v0.1.0_2023-04-16.png)
Add Logic Item – Logic Item Added (Add Logic – Logic Item Added_v0.1.0_2023-04-16.png)

Delete Logic Item #

back to top

Checklist

  • Click on Delete Logic Item
  • Clicked on Delete Logic Item
Delete Logic Item – Click on Delete Logic Item (Delete Logic Item – Click on Delete_v0.1.0_2023-04-16.png)
Delete Logic Item – Clicked on Delete Logic Item (Delete Logic Item – Clicked on Delete_v0.1.0_2023-04-16.png)

Duplicate Logic Item #

back to top

Checklist

  • Click on Duplicate
  • Clicked on Duplicate
Duplicate Logic Item – Click on Duplicate Duplicate Logic Item – Clicking on Duplicate_v0.1.0_2023-04-16.png)
Duplicate Logic Item – Clicked on Duplicate (Duplicate Logic Item – Clicked on Duplicate_v0.1.0_2023-04-16.png)

Change Visibility #

back to top

Checklist

  • Default Visibility
  • Click on toggle button to hide
  • Clicked on toggle button to hide
  • Click on toggle button to show
  • Clicked on toggle button to show
Change Visibility – Default Visibility (Change Visibility – Default_v0.1.0_2023-04-22.png)
Change Visibility – Click on toggle button to hide (Click on Toggle button to Hide_v0.1.0_2023-04-22.png)
Change Visibility – Clicked on toggle button to hide (Change Visibility – Clicked on Toggle button to Hide_v0.1.0_2023-04-22.png)
Change Visibility – Click on toggle button to show (Change Visibility – Click on Toggle button to Show_v0.1.0_2023-04-22.png)
Change Visibility – Clicked on toggle button to show (Change Visibility – Clicked on Toggle button to Show_v0.1.0_2023-04-22.png)

Change Statement Applicability #

back to top

Checklist

  • Default View
  • Clicked on options
  • Any option selected
  • All option selected
Default View (Change Statement Applicability – Default_v0.1.0_2023-04-19.png)
Clicked on options (Change Statement Applicability – Clicked on options_v0.1.0_2023-04-19.png)
Any option selected (Change Statement Applicability – Any option selected_v0.1.0_2023-04-19.png)
All option selected (Change Statement Applicability – All option selected_v0.1.0_2023-04-19.png)

Logic Statement #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\React Version\Logic Statement\

Checklist #

Add Logic Statement #

back to top

Checklist

  • Blank Logic Statement
  • Click on add Logic Statement
  • Clicked on add Logic Statement
  • Clicked on add Logic Statement Again
Add Statement – Blank Logic Statement (Add Logic Statement – Blank Logic Statement_v0.1.0_2023-04-16.png)
Add Statement – Click on add Logic Statement (Add Logic Statement – Click on add Logic Statement_v0.1.0_2023-04-16.png)
Add Statement – Clicked on add Logic Statement (Add Logic Statement – Clicked on add Logic Statement_v0.1.0_2023-04-16.png)
Add Statement – Clicked on add Logic Statement Again (Add Logic Statement – Clicked on add Logic Statement again_v0.1.0_2023-04-16.)

Delete Logic Statement #

back to top

Checklist

  • Click on delete logic statement
  • Clicked on delete logic statement
Delete statement – Click on delete logic statement (Delete Logic Statement – Click on delete Logic Statement_v0.1.0_2023-04-16.png)
Delete statement – Clicked on delete logic statement (Delete Logic Statement – Clicked on delete Logic Statement_v0.1.0_2023-04-16.png)

Duplicate Logic Statement #

back to top

Checklist

  • Click on Duplicate
  • Clicked on Duplicate
Duplicate Logic Statement – Click on Duplicate (Duplicate Logic Statement – Click on Duplicate_v0.1.0_2023-04-16.png)
Duplicate Logic Statement – Clicked on Duplicate (Duplicate Logic Statement – Clicked on Duplicate_v0.1.0_2023-04-16.png)

Select Logic Criteria #

back to top

Checklist

  • Default View
  • Click on Select Criteria
  • Clicked on Select Criteria
  • Click on Select Criteria Dropdown item
  • Clicked on Select Criteria Dropdown item
Select Logic Criteria – Default View (Select Logic Criteria – Default_v0.1.0_2023-06-07.png)
Select Logic Criteria – Click on Select Criteria (Select Logic Criteria – Click on Select Criteria_v0.1.0_2023-06-07.png)
Select Logic Criteria – Clicked on Select Criteria (Select Logic Criteria – Clicked on Select Criteria_v0.1.0_2023-06-07.png)
Select Logic Criteria – Click on Select Criteria Dropdown item (Select Logic Criteria – Click on Select Criteria Dropdown item_v0.1.0_2023-06-07.png)
Select Logic Criteria – Clicked on Select Criteria Dropdown item (Select Logic Criteria – Clicked on Select Criteria Dropdown item__v0.1.0_2023-06-07.png)

Select Logic Statement Operator #

back to top

Checklist

  • Default View
  • Click on Statement Operator Dropdown
  • Clicked on Statement Operator Dropdown
  • Equal Option Selected
  • Not Equal Option Selected
  • More Than Option Selected
  • More Than Equal Option Selected
  • Less Than Option Selected
  • Less Than Equal Option Selected
  • Changed Option Selected
  • Contains Option Selected
Select Logic Statement Operator – Default View (Select Logic Statement Operator – Default View_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Click on Statement Operator Dropdown (Select Logic Statement Operator – Click on Statement Operator Dropdown_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Clicked on Statement Operator Dropdown (Select Logic Statement Operator – Clicked on Statement Operator Dropdown_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Equal Option Selected (Select Logic Statement Operator – Equal Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Not Equal Option Selected (Select Logic Statement Operator – Not Equal Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – More Than Option Selected Select Logic Statement Operator – More Than Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – More Than Equal Option Selected (Select Logic Statement Operator – More Than Equal Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Less Than Equal Option Selected (Select Logic Statement Operator – Less Than Equal Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Less Than Option Selected (Select Logic Statement Operator – Less Than Option Selected_v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Changed Option Selected (Select Logic Statement Operator – Changed Option Selected__v0.1.0_2023-06-05.png)
Select Logic Statement Operator – Contains Option Selected (Select Logic Statement Operator – Contains Option Selected_v0.1.0_2023-06-05.png)

Add Logic Comparison Value #

back to top

Checklist

  • Default Comparison Field
  • Click on Comparison Field
  • Clicked on Comparison Field
  • Added Value
Add Logic Comparison Value – Default Value (Add Logic Comparison Value – Default_v0.1.0_2023-06-05.png)
Add Logic Comparison Value – Click on Comparison Field (Add Logic Comparison Value – Click on Comparison Field_v0.1.0_2023-06-05.png)
Add Logic Comparison Value – Clicked on Comparison Field (Add Logic Comparison Value – Clicked on Comparison Field_v0.1.0_2023-06-05.png)
Add Logic Comparison Value – Added Value (Add Logic Comparison Value – Added Value_v0.1.0_2023-06-05.png)

jQuery Version #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\

  1. Logic Item
  2. Logic Statement

Logic Item #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Item\

Logic Item (Logic Item_jQuery_v2.6.0_2023-05-29.png)

Checklist #

Add Logic Item #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Item\Add logic Item\

Checklist

  • Blank Logic Area
  • Add available Field
  • Logic Item Added
Add Logic Item – Blank Logic Area (Add Logic -Blank Logic Area_v2.6.0_2023-05-29.png)
Add Logic Item – Click on Select Item Dropdown (Add Logic – before clicking select item dropdown_v2.6.0_2023-05-29.png)
Add Logic Item – Select Item from Dropdown (Add Logic – before selecting item in select item dropdown_v2.6.0_2023-05-29.png)
Add Logic Item – Click Add Field Button (Add Logic – before clicking add field_v2.6.0_2023-05-29.png)
Add Logic Item – Logic Item Added (Add Logic – after clicking add field_v2.6.0_2023-05-29.png)

Delete Logic Item #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Item\Delete Logic Item\jQuery\

Checklist

  • Click on Delete Logic Item
  • Clicked on Delete Logic Item
Delete Logic Item – Click on Delete (Delete Logic Item – Click on Delete_v2.6.0_2023-05-29.png)
Delete Logic Item – Clicked on Logic (Delete Logic Item – Clicked on Delete_v2.6.0_2023-05-29.png)

Change Visibility #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\jQuery Version\Logic\Logic Item\Change Visibility\

Checklist

  • Default Visibility
  • Click on Visibility Dropdown
  • Select Hide in Visibility Dropdown
  • Click on Visibility Dropdown
  • Select Show in Visibility Dropdown
Change Visibility – Default Visibility (Change Visibility – Default_v2.6.0_2023-05-29.png)
Change Visibility – Click on Visibility Dropdown (Change Visibility – Click on dropdown button to Hide_v2.6.0_2023-05-29.png)
Change Visibility – Select Hide in Visibility Dropdown (Change Visibility – Clicked on Hide Dropdown option_v2.6.0_2023-05-29.png)
Change Visibility – Click on Visibility Dropdown (Change Visibility – Click on dropdown button to Show_v2.6.0_2023-05-29.png)
Change Visibility – Select Show in Visibility Dropdown (Change Visibility – Clicked on Show Dropdown option_v2.6.0_2023-05-29.png)

Change Statement Applicability #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Item\Change Statement Applicability\

Checklist

  • Default View
  • Click on applicability options
  • Clicked on applicability options
  • Any option selected
  • All option selected
Change Statement Applicability – Default View (Change Statement Applicability – Default_v2.6.0_2023-05-29.png)
Change Statement Applicability – Click on Applicability Options (Change Statement Applicability – Click on applicability options_v2.6.0_2023-05-29.png)
Change Statement Applicability – Clicked on Applicability Options (Change Statement Applicability – Clicked on applicability options_v2.6.0_2023-05-29.png)
Change Statement Applicability – Any Option Selected (Change Statement Applicability – Any option selected_v2.6.0_2023-05-29.png)
Change Statement Applicability – All Option Selected (Change Statement Applicability – All option selected_v2.6.0_2023-05-29.png)

Logic Statement #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\

Logic Statement (Logic Statement_jQuery_v2.6.0_2023-05-31.png)

Checklist #

Add Logic Statement #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\Add Logic Statement\

Checklist

  • Blank Logic Statement
  • Click on add Logic Statement
  • Clicked on add Logic Statement
  • Clicked on add Logic Statement Again
Add Logic Statement – Blank Logic Statement (Add Logic Statement – Blank Logic Statement_v2.6.0_2023-05-29.png)
Add Logic Statement – Click on add Logic Statement (Add Logic Statement – Click on add Logic Statement_v2.6.0_2023-05-29.png)
Add Logic Statement – Clicked on add Logic Statement
(Add Logic Statement – Clicked on add Logic Statement_v2.6.0_2023-05-29.png)
Add Logic Statement – Clicked on add Logic Statement Again
(Add Logic Statement – Clicked on add Logic Statement again_v2.6.0_2023-05-29.png)

Delete Logic Statement #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\Delete Logic Statement\

Checklist

  • Click on delete logic statement
  • Clicked on delete logic statement
Delete Logic Statement – Click on delete logic statement (Delete Logic Statement – Click on delete Logic Statement_v2.6.0_2023-05-29.png)
Delete Logic Statement – Clicked on delete logic statement
(Delete Logic Statement – Clicked on delete Logic Statement_v2.6.0_2023-05-29.png)

Select Logic Criteria #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\Select Logic Criteria\

Checklist

  • Default View
  • Click on Select Criteria
  • Clicked on Select Criteria
  • Click on Select Criteria Dropdown item
  • Clicked on Select Criteria Dropdown item
Select Logic Criteria – Default View (Select Logic Criteria – Default_v2.6.0_2023-05-28.png)
Select Logic Criteria – Click on Criteria Dropdown (Select Logic Criteria – Click on Select Criteria Dropdown_v2.6.0_2023-05-28.png)
Select Logic Criteria – Clicked on Criteria Dropdown (Select Logic Criteria – Clicked on Select Criteria Dropdown_v2.6.0_2023-05-28.png)
Select Logic Criteria – Click on Select Criteria Dropdown item (Select Logic Criteria – Click on Select Criteria Dropdown item_v2.6.0_2023-05-28.png)
Select Logic Criteria – Clicked on Select Criteria Dropdown item (Select Logic Criteria – Clicked on Select Criteria Dropdown item_v2.6.0_2023-05-28.png)

Select Logic Statement Operator #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\Select Logic Statement Operator\

Checklist

  • Default View
  • Click on Statement Operator Dropdown
  • Clicked on Statement Operator Dropdown
  • Equal Option Selected
  • Not Equal Option Selected
  • More Than Option Selected
  • More Than Equal Option Selected
  • Less Than Option Selected
  • Less Than Equal Option Selected
  • Changed Option Selected
  • Contains Option Selected
Select Logic Statement Operator – Default View(Select Logic Statement Operator – Default View_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – Click on Statement Operator Dropdown (Select Logic Statement Operator – Click on Statement Operator Dropdown__2023-06-05.png)
Select Logic Statement Operator – Clicked on Statement Operator Dropdown (Select Logic Statement Operator – Clicked on Statement Operator Dropdown_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – Equal Option Selected (Select Logic Statement Operator – Equal Option Selected_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – Not Equal Option Selected (Select Logic Statement Operator – Not Equal Option Selected_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – More Than Option Selected (Select Logic Statement Operator – More Than Option Selected_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – More Than Equal Option Selected (Select Logic Statement Operator – More Than Equal Option Selected_v2.6._2023-06-05.png)
Select Logic Statement Operator – Less Than Option Selected (Select Logic Statement Operator – Less Than Option Selected_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – Less Than Equal Option Selected Select Logic Statement Operator – Less Than Equal Option Selected_v2.6._2023-06-05.png)
Select Logic Statement Operator – Changed Option Selected (Select Logic Statement Operator – Changed Option Selected_v2.6.0_2023-06-05.png)
Select Logic Statement Operator – Contains Option Selected (Select Logic Statement Operator – Contains Option Selected_v2.6.0_2023-06-05.png)

Add Logic Comparison Value #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\Logic\jQuery Version\Logic Statement\Add Logic Comparison Value\

Checklist

  • Default Comparison Field
  • Click on Comparison Field
  • Clicked on Comparison Field
  • Added Value
Add Logic Comparison Value – Default Value (Add Logic Comparison Value – Default_v2.6.0_2023-06-05.png)
Add Logic Comparison Value – Click on Comparison Field (Add Logic Comparison Value – Click on Comparison Field_v2.6.0_2023-06-05.png)
Add Logic Comparison Value – Clicked on Comparison Field (Add Logic Comparison Value – Clicked on Comparison Field_v2.6.0_2023-06-05.png)
Add Logic Comparison Value – Added Value (Add Logic Comparison Value – Added Value_v2.6.0_2023-06-05.png)

Multi #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\

Checklist

  1. Add new Multi tab
  2. Move Multi Tab
  3. Remove Multi Tab
  4. Scroll Multi Tabs
  5. Multi Options
  6. Multi Front-end Form

Add New Multi Tab #

back to top

Checklist #

  1. Add New Multi Tab – Hidden Lists
  2. Add New Multi Tab – Visible Lists

Add New Multi Tab – Hidden Lists #

back to top

Checklist #

  1. Click on Add New Tab
  2. New Tab Added
  3. Click Show List
  4. Clicked Show List and Click on New Tab
  5. Clicked on New Tab
  6. Click Hide List
  7. Clicked Hide List
  8. Double Click tab to rename it
  9. Multi Tab Dialogue Box
  10. Rename Tab and Click Done
  11. New Tab Renamed and Added
Click on Add New Tab – Hidden Lists (Hidden Lists_01_Add new Multi Tab – Click on Add new Tab Icon_commit-3c95728_2024-07-23.png)
New Tab Added – Hidden Lists (Hidden Lists_02_Add new Multi Tab – Clicked on Add new Tab Icon_commit-3c95728_2024-07-23.png)
Click Show List – Hidden Lists (Hidden Lists_03_Add new Multi Tab – Click show lists button_commit-3c95728_2024-07-23.png)
Clicked Show List and Click on New Tab – Hidden Lists (Hidden Lists_04_Add new Multi Tab – Clicked show lists button and click on new tab_commit-3c95728_2024-07-23.png)
Clicked on New Tab – Hidden Lists (Hidden Lists_05_Add new Multi Tab – Clicked on new tab_commit-3c95728_2024-07-23.png)
Click Hide List – Hidden Lists (Hidden Lists_06_Add new Multi Tab – Click hide lists button_commit-3c95728_2024-07-23.png)
Clicked Hide List – Hidden Lists (Hidden Lists_07_Add new Multi Tab – Clicked hide lists button_commit-3c95728_2024-07-23.png)
Double Click tab to rename it – Hidden Lists (Hidden Lists_08_Add new Multi Tab – Double Click to Rename Tab_commit-3c95728_2024-07-23.png)
Multi Tab Dialogue Box – Hidden Lists (Hidden Lists_09_Add new Multi Tab – Multi Tab Dialogue Box_commit-3c95728_2024-07-23.png)
Rename Tab and Click Done – (Hidden Lists_10_Add new Multi Tab – Renamed tab and click done_commit-3c95728_2024-07-23.png)
New Tab Renamed and Added – (Hidden Lists_11_Add new Multi Tab – new tab renamed and added_commit-3c95728_2024-07-23.png)

Add New Multi Tab – Visible Lists #

back to top

Checklist

  1. Click on Add New Tab
  2. Clicked on Add New Tab
  3. Click on New Tab
  4. Clicked on New Tab
  5. Double Click tab to rename it
  6. Multi Tab Dialogue Box
  7. Rename Tab and Click Done
  8. New Tab Renamed and Added
Click on Add New Tab – Visible Lists (Visible Lists_12_Add new Multi Tab – Click on Add new Tab Icon_commit-3c95728_2024-07-23.png)
New Tab Added – Visible Lists (Visible Lists_13_Add new Multi Tab – Clicked on Add new Tab Icon_commit-3c95728_2024-07-23.png)
Click on New Tab – Visible Lists (Visible Lists_14_Add new Multi Tab – Click on new tab_commit-3c95728_2024-07-23.png)
Clicked on New Tab – Visible Lists (Visible Lists_15_Add new Multi Tab – Clicked on new tab_commit-3c95728_2024-07-23.png)
Double Click tab to rename it – Visible Lists (Visible Lists_16_Add new Multi Tab – Double Click to Rename Tab_commit-3c95728_2024-07-23.png)
Multi Tab Dialogue Box – Visible Lists (Visible Lists_17_Add new Multi Tab – Multi Tab Dialogue Box_commit-3c95728_2024-07-23.png)
Rename Tab and Click Done – (Visible Lists_18_Add new Multi Tab – Renamed tab and click done_commit-3c95728_2024-07-23.png)
New Tab Renamed and Added – Visible Lists (Visible Lists_19_Add new Multi Tab – new tab renamed and added_commit-3c95728_2024-07-23.png)

Move Multi Tab #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\Move Multi Tab\

Checklist #

  1. Move Multi Tab – Hidden Lists
  2. Move Multi Tab – Visible Lists

Move Multi Tab – Hidden Lists #

back to top

Checklist

  1. Click on Drag to Move Button
  2. Dragging to Move
  3. Tab Moved
Click on Drag to Move Button – Hidden Lists (Hidden Lists_01_Move Multi Tab – Click on Move Tab Icon_commit-3c95728_2024-07-24.png)
(Hidden Lists_02_Move Multi Tab – Dragging to Move_commit-3c95728_2024-07-24.png)
Tab Moved – Hidden Lists (Hidden Lists_03_Move Multi Tab – Dragged and Moved Tab_commit-3c95728_2024-07-24.png)

Move Multi Tab – Visible Lists #

back to top

Checklist

  1. Click on Drag to Move Button
  2. Dragging to Move
  3. Tab Moved
Click on Drag to Move Button – Visible Lists (Visible Lists_04_Move Multi Tab – Click on Move Tab Icon_commit-3c95728_2024-07-24.png)
Dragging to Move – Visible Lists (Visible Lists_05_Move Multi Tab – Dragging to Move_commit-3c95728_2024-07-24.png)
Tab Moved – Visible Lists (Visible Lists_06_Move Multi Tab – Dragged and Moved Tab_commit-3c95728_2024-07-24.png)

Remove Multi Tab #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\Remove Multi Tab\

Checklist #

  1. Remove Multi Tab – Hidden Lists
  2. Remove Multi Tab – Visible Lists

Remove Multi Tab – Hidden Lists #

back to top

Checklist

  1. Click on Remove Tab
  2. Clicked on Remove Tab and Clock on Ok in Alert box
  3. Clicked Ok on Alert box and Tab is Removed
Click on Remove Tab – Hidden Lists (Hidden Lists_01_Remove Multi Tab – Click on Remove Tab Icon_commit-3c95728_2024-07-24.png)
Clicked on Remove Tab and Clock on Ok in Alert box – Hidden Lists (Hidden Lists_02_Remove Multi Tab – Clicked on Remove Tab & click on Ok in Alert box_commit-3c95728_2024-07-24.png)
Clicked Ok on Alert box and Tab is Removed – Hidden Lists (Hidden Lists_03_Remove Multi Tab – Click on Ok in Alert box and tab is removed_commit-3c95728_2024-07-24.png)

Remove Multi Tab – Visible Lists #

back to top

Checklist

  1. Click on Remove Tab
  2. Clicked on Remove Tab and Clock on Ok in Alert box
  3. Clicked Ok on Alert box and Tab is Removed
Click on Remove Tab – Visible Lists (Visible Lists_04_Remove Multi Tab – Click on Remove Tab Icon_commit-3c95728_2024-07-24.png)
Clicked on Remove Tab and Clock on Ok in Alert box – Visible Lists (Visible Lists_05_Remove Multi Tab – Clicked on Remove Tab & click on Ok in Alert box_commit-3c95728_2024-07-24.png)
Clicked Ok on Alert box and Tab is Removed – Visible Lists (Visible Lists_06_Remove Multi Tab – Click on Ok in Alert box and tab is removed_commit-3c95728_2024-07-24.png)

Scroll Multi Tabs #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\Scroll Multi Tabs\

Checklist #

  1. Scroll Multi Tabs – Hidden Lists
  2. Scroll Multi Tabs – Visible Lists

Scroll Multi Tabs – Hidden Lists #

back to top

Checklist

  1. Multi Tabs without Scrollable Tabs
  2. Multi Tabs with Scrollable Tabs
  3. Click on Scroll to Right Button
  4. Clicked on Scroll to Right Button
  5. Click on Scroll to Left Button
  6. Clicked on Scroll to Left Button
Multi Tabs without Scrollable Tabs – Hidden Lists (Hidden Lists_01_Scroll Multi Tabs – without scrollable tabs_commit-3c95728_2024-07-25.png)
Multi Tabs with Scrollable Tabs – Hidden Lists (Hidden Lists_02_Scroll Multi Tabs – with scrollable tabs_commit-3c95728_2024-07-25.png)
Click on Scroll to Right Button – Hidden Lists (Hidden Lists_03_Scroll Multi Tabs – click on scroll right button_commit-3c95728_2024-07-25.png)
Clicked on Scroll to Right Button – Hidden Lists (Hidden Lists_04_Scroll Multi Tabs – clicked on scroll right button_commit-3c95728_2024-07-25.png)
Click on Scroll to Left Button – Hidden Lists (Hidden Lists_05_Scroll Multi Tabs – click on scroll left button_commit-3c95728_2024-07-25.png)
Click on Scroll to Left Button – Hidden Lists (Hidden Lists_06_Scroll Multi Tabs – clicked on scroll left button_commit-3c95728_2024-07-25.png)

Scroll Multi Tabs – Visible Lists #

back to top

Checklist

  1. Multi Tabs without Scrollable Tabs
  2. Multi Tabs with Scrollable Tabs
  3. Click on Scroll to Right Button
  4. Clicked on Scroll to Right Button
  5. Click on Scroll to Left Button
  6. Click on Scroll to Left Button
Multi Tabs without Scrollable Tabs – Visible Lists (Visible Lists_07_Scroll Multi Tabs – without scrollable tabs_commit-3c95728_2024-07-25.png)
Multi Tabs with Scrollable Tabs – Visible Lists (Visible Lists_08_Scroll Multi Tabs – with scrollable tabs_commit-3c95728_2024-07-25.png)
Click on Scroll to Right Button – Visible Lists (Visible Lists_09_Scroll Multi Tabs – click on scroll right button_commit-3c95728_2024-07-25.png)
Clicked on Scroll to Right Button – Visible Lists (Visible Lists_10_Scroll Multi Tabs – clicked on scroll right button_commit-3c95728_2024-07-25.png)
Click on Scroll to Left Button – Visible Lists (Visible Lists_11_Scroll Multi Tabs – click on scroll left button_commit-3c95728_2024-07-25.png)
Click on Scroll to Left Button – Visible Lists (Visible Lists_12_Scroll Multi Tabs – clicked on scroll left button_commit-3c95728_2024-07-25.png)

Multi Options #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\Multi Options\

Checklist

  • item

Multi – Front-end Form #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\MULTI\Front-end Form\

Full Form (01_Multi – Front-end Form – Full Form_v2.6.2_2024-02-07.png)

Checklist #

back to top

Click on Tab 2 Title (02_Multi – Front-end Form – clicking on tab 2_v2.6.2_2024-02-13.png)
Clicked on Tab 2 Title (03_Multi – Front-end Form – clicked on tab 2_v2.6.2_2024-02-13.png)

Checklist

  • Check changing the tab always scrolls to the top of the form on the screen

back to top

Click on Start Button (04_Multi – Front-end Form – clicking on start button_v2.6.2_2024-02-13.png)
Clicked on Start button (05_Multi – Front-end Form – clicked on start button_v2.6.2_2024-02-13.png)
Click on Previous button (06_Multi – Front-end Form – clicking on previous button_v2.6.2_2024-02-13.png)
Clicked on Previous button (07_Multi – Front-end Form – clicked on previous button_v2.6.2_2024-02-13.png)
Click on Next button (08_Multi – Front-end Form – clicking on next button_v2.6.2_2024-02-13.png)
Clicked on Next button (09_Multi – Front-end Form – clicked on next button_v2.6.2_2024-02-13.png)

Checklist

  • Check changing the tab always scrolls to the top of the form on the screen

Filling the Form data #

back to top

Filled Data in Tab 2 (10_Multi – Front-end Form – Filled details in Tab 2_v2.6.2_2024-02-08.png)
Filled data in Tab 3 (13_Multi – Front-end Form – Filled details in Tab 3_v2.6.2_2024-02-08.png)

Submitting the form #

back to top

Click on Submit button (12_Multi – Front-end Form – clicking on submit button_v2.6.2_2024-02-13.png)
Clicked on Submit button (13_Multi – Front-end Form – clicked on submit button_v2.6.2_2024-02-13.png)

Styles – Ready #

back to top

Checklist

Add Ready Grid Component #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\READY\Add Ready Grid Component\

Add Ready Grid Component (09_Add Ready Grid Component_ALL_v2.7.0_2023-11-02.png)

Checklist

  1. Add a List – OL to the form
  2. Add one more List-OL to the List-LI just below the Grid Element
  3. Add Required fields as child elements to the Grid Row
  4. Set Ready Grid to Grid on OL
  5. Set Ready Grid to Grid Row on OL
  6. Set Ready Grid to Grid Field for the wrapper List-LI of child elements
  7. Set Field Span for the wrapper List-LI to Required Relative width of the child field
  8. Demo Form (Field Span 3,3,6 for 3 fields in a row respectively)
  9. Demo Form Frontend

Add a List – OL to the form #

back to top

Add a List – OL to The Form – Add Ready Grid Component (01_Add a List – OL to The Form_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Add one more List-OL to the List-LI just below the Grid Element #

back to top

Add one more List-OL to the List-LI just below the Grid Element – Add Ready Grid Component (02_Add one more List-OL to the List-LI just below the Grid Element_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Add Required fields as child elements to the Grid Row #

back to top

Add Required fields as child elements to the Grid Row – Add Ready Grid Component (03_Add Required fields as child elements to the Grid Row_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Set Ready Grid to Grid on OL #

back to top

Set Ready Grid to Grid on OL – Add Ready Grid Component (04_Set Ready Grid to Grid on First OL_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Set Ready Grid to Grid Row on OL #

back to top

Set Ready Grid to Grid Row on OL_Add Ready Grid Component (05_Set Ready Grid to Grid Row on Second OL_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Set Ready Grid to Grid Field for the wrapper List-LI of child elements #

back to top

Set Ready Grid to Grid Field for the wrapper List-LI of child elements (06_Set Ready Grid to Grid Field for the wrapper List-LI of child elements_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Set Field Span for the wrapper List-LI to Required Relative width of the child field #

back to top

Set Field Span to desired span for field wrapper LI – Add Ready Grid Component (07_Set Field Span to desired span for field wrapper LI_Add Ready Grid Component_v2.7.0_2023-11-02.png)

Demo Form (Field Span 3,3,6 for 3 fields in a row respectively) #

back to top

Add Ready Grid Component – Demo Form (08_Add Ready Grid Component- Field Span 3,3,6 for 3 fields in a row respectively_v2.7.0_2023-11-02.png)

Demo Form Frontend #

back to top

Add Ready Grid Component – Demo Form with 3,3,6 Field Span_frontend (10_Add Ready Grid Component – Demo Form with 3,3,6 Field Span_frontend_v2.7.0_2023-11-02.png)

Change Label Position #

back to top

Images – ..\Sync\..\Testing\Test Site\Manual Testing\ACTIONS\READY\Change Label Position\

Form Options – Label Position – Default (Form Options – Label Position – Default_v2.5.3_2023-04-08.png)
Form Options – Label Position – None (Form Options – Label Position – None_v2.5.3_2023-04-08.png)
Form Options – Label Position – Top (Form Options – Label Position – Top_v2.5.3_2023-04-08.png)
Form Options – Label Position – Right (Form Options – Label Position – Right_v2.5.3_2023-04-08.png)
Form Options – Label Position – Left (Form Options – Label Position – Left_v2.5.3_2023-04-08.png)
Form Options – Label Position – Bottom (Form Options- Label Position – Bottom_v2.5.3_2023-04-08.png)

back to top

Further reading:

NOTES #

Add notes here.