|
| 1 | +import { droppable } from '@pages/Interactions/GX2-4365-Droppable.page'; |
| 2 | +import { removeLogs } from '@helper/RemoveLogs'; |
| 3 | +import data from '../../../fixtures/data/GX2-4365-Droppable.Page.json'; |
| 4 | + |
| 5 | +describe('This is your test project title', () => { |
| 6 | + beforeEach(() => { |
| 7 | + droppable.visit(); |
| 8 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'true'); |
| 9 | + }); |
| 10 | + |
| 11 | + it('4366 | TC 1: Validate Tabs “Simple must be shown', () => { |
| 12 | + droppable.SeleccionarSimple(); |
| 13 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'true'); |
| 14 | + droppable.tabAccept().should('have.attr', 'aria-selected', 'false'); |
| 15 | + droppable.tabPropogation().should('have.attr', 'aria-selected', 'false'); |
| 16 | + droppable.tabRevert().should('have.attr', 'aria-selected', 'false'); |
| 17 | + }); |
| 18 | + |
| 19 | + it('4366 | TC 2: Validate tab “Accept” must be shown', () => { |
| 20 | + droppable.SeleccionarAccept(); |
| 21 | + droppable.tabAccept().should('have.attr', 'aria-selected', 'true'); |
| 22 | + droppable.tabPropogation().should('have.attr', 'aria-selected', 'false'); |
| 23 | + droppable.tabRevert().should('have.attr', 'aria-selected', 'false'); |
| 24 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'false'); |
| 25 | + }); |
| 26 | + |
| 27 | + it('4366 | TC 3: Validate Tabs “Prevent Propagation” must be shown', () => { |
| 28 | + droppable.SeleccionarPropogation(); |
| 29 | + droppable.tabPropogation().should('have.attr', 'aria-selected', 'true'); |
| 30 | + droppable.tabRevert().should('have.attr', 'aria-selected', 'false'); |
| 31 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'false'); |
| 32 | + droppable.tabAccept().should('have.attr', 'aria-selected', 'false'); |
| 33 | + }); |
| 34 | + |
| 35 | + it('4366 | TC 4: Validate Tabs “Revert Draggable” must be shown', () => { |
| 36 | + droppable.SeleccionarRevert(); |
| 37 | + droppable.tabRevert().should('have.attr', 'aria-selected', 'true'); |
| 38 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'false'); |
| 39 | + droppable.tabAccept().should('have.attr', 'aria-selected', 'false'); |
| 40 | + droppable.tabPropogation().should('have.attr', 'aria-selected', 'false'); |
| 41 | + }); |
| 42 | + |
| 43 | + it('4366 | TC 5: Validate tab "Simple” is displayed by default', () => { |
| 44 | + droppable.visit(); |
| 45 | + droppable.tabSimple().should('have.attr', 'aria-selected', 'true'); |
| 46 | + }); |
| 47 | + |
| 48 | + it('4366 | TC 6: Validate on tab simple “Drag me” dashed area must be displayed.', () => { |
| 49 | + droppable.SeleccionarSimple(); |
| 50 | + droppable.draggable().should('exist'); |
| 51 | + }); |
| 52 | + |
| 53 | + it('4366 | TC 7: Validate on tab simple “Drop here” bordered area must be displayed.', () => { |
| 54 | + droppable.SeleccionarSimple(); |
| 55 | + droppable.droppable().should('exist').should('have.text', data.drophere); |
| 56 | + }); |
| 57 | + |
| 58 | + it('4366 | TC 8: Validate on tab simple when “Drag me” area is dropped on the “Drop here” area the “Drop here” area changes the background color to blue.', () => { |
| 59 | + droppable.SeleccionarSimple(); |
| 60 | + droppable.draggable().drag(data.Droppable, { |
| 61 | + force: true, |
| 62 | + }); |
| 63 | + droppable.droppable().should('have.css', 'background-color', data.azul); |
| 64 | + }); |
| 65 | + |
| 66 | + it('4366 | TC 9: Validate when “Drag me” area is dropped on the “Drop here” area, text “Dropped!” is displayed', () => { |
| 67 | + droppable.SeleccionarSimple(); |
| 68 | + cy.contains('p', 'Drop here'); |
| 69 | + droppable.draggable().drag(data.Droppable, { |
| 70 | + force: true, |
| 71 | + }); |
| 72 | + droppable.droppable().find('p').should('contain', data.dropped); |
| 73 | + }); |
| 74 | + |
| 75 | + it('4366 | TC 10: Validate “Acceptable” dashed area must be displayed.', () => { |
| 76 | + droppable.SeleccionarAccept(); |
| 77 | + droppable.acceptable().should('exist').should('have.text', data.Acceptable); |
| 78 | + }); |
| 79 | + |
| 80 | + it('4366 | TC 11: Validate “Not Acceptable” dashed area must be displayed.', () => { |
| 81 | + droppable.SeleccionarAccept(); |
| 82 | + droppable.notAcceptable().should('exist').should('have.text', data.NotAcceptable); |
| 83 | + }); |
| 84 | + |
| 85 | + it('4366 | TC 12: Validate “Drop here” bordered area must be displayed.', () => { |
| 86 | + droppable.SeleccionarAccept(); |
| 87 | + droppable.droppable().should('exist').should('have.text', data.drophere); |
| 88 | + }); |
| 89 | + |
| 90 | + it('4366 | TC 13: Validate if “Acceptable” area is dragged then“Drop here” area changes the background color to Green.', () => { |
| 91 | + droppable.SeleccionarAccept(); |
| 92 | + droppable.acceptable().trigger('mousedown', { which: 1 }); |
| 93 | + droppable.accept().trigger('mousemove'); |
| 94 | + droppable.accept().should('have.css', 'background-color', data.verdeclaro); |
| 95 | + }); |
| 96 | + |
| 97 | + it('4366 | TC 14: Validate if “Acceptable” area is dropped in the “Drop here” area then “Drop here” area changes the background color to Blue and text “Dropped!” is displayed.', () => { |
| 98 | + droppable.SeleccionarAccept(); |
| 99 | + droppable.acceptable().drag(data.DatoAccept, { force: true }); |
| 100 | + droppable.accept().should('have.css', 'background-color', data.azul).should('contain', 'Dropped!'); |
| 101 | + }); |
| 102 | + |
| 103 | + it('4366 | TC 15: Validate “Drag me” dashed area must be displayed..', () => { |
| 104 | + droppable.SeleccionarAccept(); |
| 105 | + droppable.droppable().should('exist').should('have.text', data.drophere); |
| 106 | + }); |
| 107 | + |
| 108 | + it('4366 | TC 16: Validate “Outer Droppable” bordered area must be displayed and contains “Inner droppable (not greedy)” area inside.', () => { |
| 109 | + droppable.SeleccionarPropogation(); |
| 110 | + droppable.notGreedyInnerDropBox().should('exist').should('have.text', data.TextInnerDroppable); |
| 111 | + droppable.notGreedyDropBox().should('include.text', data.Outerdroppable); |
| 112 | + }); |
| 113 | + |
| 114 | + it('4366 | TC 17: Validate “Outer Droppable” bordered area must be displayed and contains “Inner droppable (greedy)” area inside.', () => { |
| 115 | + droppable.SeleccionarPropogation(); |
| 116 | + droppable.greedyDropBoxInner().should('exist').should('have.text', data.Innerdroppablegreedy); |
| 117 | + droppable.greedyDropBox().should('include.text', data.Outerdroppable); |
| 118 | + }); |
| 119 | + |
| 120 | + it('4366 | TC 18: Validate on the first “Outer Droppable” area, if “Drag me” area is dragged then “Outer Droppable” area changes the background color to Green and Inner droppable (not greedy) area changes the background color to light Green.', () => { |
| 121 | + droppable.SeleccionarPropogation(); |
| 122 | + droppable.draggable().trigger('mousedown', { which: 1, force: true }); |
| 123 | + droppable.notGreedyInnerDropBox().trigger('mousemove'); |
| 124 | + droppable.notGreedyInnerDropBox().should('have.css', 'background-color', data.verde); |
| 125 | + droppable.notGreedyDropBox().trigger('mousemove', { which: 1, force: true }); |
| 126 | + droppable.notGreedyDropBox().should('have.css', 'background-color', data.verde); |
| 127 | + }); |
| 128 | + |
| 129 | + it('4366 | TC 19: Validate on the second "Outer Droppable" área if “Drag me” area is dragged to “Inner droppable (greedy)” area then the “Inner droppable (greedy)” area changes the background color to Light Green and "Outer Droppable" area changes the background color to green', () => { |
| 130 | + droppable.SeleccionarPropogation(); |
| 131 | + droppable.draggable().trigger('mousedown', { which: 1, force: true }); |
| 132 | + droppable.greedyDropBoxInner().trigger('mousemove', { which: 1, force: true }); |
| 133 | + droppable.greedyDropBoxInner().should('have.css', 'background-color', data.verde); |
| 134 | + droppable.greedyDropBox().trigger('mousemove', { which: 1, force: true }); |
| 135 | + droppable.greedyDropBox().should('have.css', 'background-color', data.verdeclaro); |
| 136 | + }); |
| 137 | + |
| 138 | + it('4366 | TC 20: Validate on “Revert Draggable” tab,“Will Revert” dashed area must be displayed.', () => { |
| 139 | + droppable.SeleccionarRevert(); |
| 140 | + droppable.revert().should('exist').should('have.text', data.WillRevert); |
| 141 | + }); |
| 142 | + |
| 143 | + it('4366 | TC 21: Validate on “Revert Draggable” tab,“Not Revert” dashed area must be displayed.', () => { |
| 144 | + droppable.SeleccionarRevert(); |
| 145 | + droppable.notRevert().should('exist').should('have.text', data.NotRevert); |
| 146 | + }); |
| 147 | + |
| 148 | + it('4366 | TC 22: Validate on “Revert Draggable” tab,“Drop here” bordered area must be displayed.', () => { |
| 149 | + droppable.SeleccionarRevert(); |
| 150 | + droppable.droppable().should('exist').should('have.text', data.drophere); |
| 151 | + }); |
| 152 | + |
| 153 | + it('4366 | TC 23: Validate on “Drop here” if “Will Revert” area is dragged then “Drop here” area changes the background color to Green.', () => { |
| 154 | + droppable.SeleccionarRevert(); |
| 155 | + droppable.revert().trigger('mousedown', { which: 1 }); |
| 156 | + droppable.revertDrop().trigger('mousemove'); |
| 157 | + droppable.revertDrop().should('have.css', 'background-color', data.verde); |
| 158 | + }); |
| 159 | + |
| 160 | + it('4366 | TC 24: Validate on “Drop here” if “Not Revert” area is dragged then “Drop here” area changes the background color to Green.', () => { |
| 161 | + droppable.SeleccionarRevert(); |
| 162 | + droppable.notRevert().trigger('mousedown', { which: 1 }); |
| 163 | + droppable.revertDrop().trigger('mousemove'); |
| 164 | + droppable.revertDrop().should('have.css', 'background-color', data.verde); |
| 165 | + }); |
| 166 | + |
| 167 | + it('4366 | TC 25: Validate if “Will Revert” area is dropped on the “Drop here” area then “Will Revert” area goes back to the initial position and “Drop here” area changes the background color to Blue and text “Dropped” is displayed.', () => { |
| 168 | + droppable.SeleccionarRevert(); |
| 169 | + droppable.revert().drag(data.DatoRevert, { force: true }); |
| 170 | + droppable.revertDrop().should('have.css', 'background-color', data.azul).should('contain', data.dropped); |
| 171 | + droppable.revert().should('have.css', 'position', 'relative').and('have.css', 'left', '0px').and('have.css', 'top', '0px'); |
| 172 | + }); |
| 173 | + |
| 174 | + it('4366 | TC 26: Validate on “Drop here” if “Not Revert” area is dropped on the “Drop here” area then “Not Revert” area cant be removed from the “Drop here” area and “Drop here” area changes the background color to Blue and text “Dropped” is displayed', () => { |
| 175 | + droppable.SeleccionarRevert(); |
| 176 | + droppable.notRevert().drag(data.DatoRevert, { force: true }); |
| 177 | + droppable.revertDrop().should('have.css', 'background-color', data.azul).should('contain', data.dropped); |
| 178 | + droppable.notRevert().should('have.css', 'position', 'relative').and('have.css', 'left', '353px'); |
| 179 | + }); |
| 180 | +}); |
| 181 | + |
| 182 | +removeLogs(); |
0 commit comments