Skip to content

Commit ceb42eb

Browse files
MichaelMatejkoMichaelMatejko
authored
Merge pull request #461 from cromatikap/row-resize-feature
Row resize feature
2 parents b1a3412 + 32f9f76 commit ceb42eb

18 files changed

Lines changed: 12244 additions & 6034 deletions

‎cypress/e2e/common/utils.ts‎

Lines changed: 59 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -672,8 +672,12 @@ export class Utilities {
672672
return cy.get(".rg-shadow");
673673
}
674674

675-
resizeHint() {
676-
return cy.get(".rg-column-resize-hint");
675+
resizeHintColumn() {
676+
return cy.get(`.rg-column-resize-hint`);
677+
}
678+
679+
resizeHintRow() {
680+
return cy.get(`.rg-row-resize-hint`);
677681
}
678682

679683
getRightStickyPane() {
@@ -850,7 +854,7 @@ export class Utilities {
850854
});
851855
}
852856
this.getLine().should("exist");
853-
this.resizeHint().should("exist");
857+
this.resizeHintColumn().should("exist");
854858
beforePointerUp();
855859
body.trigger("pointerup", {
856860
clientX: endingPoint + offsetLeft,
@@ -864,6 +868,58 @@ export class Utilities {
864868
cy.wait(200);
865869
}
866870

871+
resizeRow(
872+
startX: number,
873+
startY: number,
874+
distance: number,
875+
options?: ResizeParams
876+
) {
877+
const { log, resizeHandleClickOffset, step, beforePointerUp } = {
878+
log: false,
879+
resizeHandleClickOffset: 4, // probably need check
880+
step: 1,
881+
beforePointerUp: () => null,
882+
...options,
883+
};
884+
const endingPoint = startY + distance + resizeHandleClickOffset;
885+
const scrollableElement = this.getScrollableElement();
886+
scrollableElement.then(($el) => {
887+
const { offsetLeft, offsetTop } = $el[0];
888+
const body = this.getBody();
889+
scrollableElement.trigger(
890+
"pointerdown",
891+
startX + offsetLeft,
892+
startY - resizeHandleClickOffset + offsetTop,
893+
{ log, pointerType: options?.useTouch ? "touch" : "mouse" }
894+
);
895+
for (
896+
let y = startY;
897+
distance < 0 ? y > endingPoint : y < endingPoint;
898+
y += distance > 0 ? step : -step
899+
) {
900+
body
901+
.wait(3, { log: false })
902+
.trigger("pointermove", startX + offsetLeft, y + offsetTop, {
903+
log,
904+
force: true,
905+
pointerType: options?.useTouch ? "touch" : "mouse",
906+
});
907+
}
908+
this.getLine().should("exist");
909+
this.resizeHintRow().should("exist");
910+
beforePointerUp();
911+
body.trigger("pointerup", {
912+
clientX: startX + offsetLeft,
913+
clientY: endingPoint + offsetTop,
914+
force: true,
915+
log,
916+
pointerType: options?.useTouch ? "touch" : "mouse",
917+
});
918+
});
919+
920+
cy.wait(200);
921+
}
922+
867923
reorderColumn(
868924
startX: number,
869925
startY: number,

‎cypress/e2e/tests/columnAndRowSelections/scroll.spec.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,9 @@ context("Scroll", () => {
4343
utils.resizeColumn(config.cellWidth, utils.getCellYCenter(), RESIZE_WIDTH, {
4444
useTouch: true,
4545
beforePointerUp: () => {
46-
utils.resizeHint().should("be.visible");
46+
utils.resizeHintColumn().should("be.visible");
4747
utils
48-
.resizeHint()
48+
.resizeHintColumn()
4949
.and("contain.text", `Width: ${NEW_WIDTH + 5 /* 5px is the resize handle offset */}px`);
5050
},
5151
});
@@ -57,4 +57,5 @@ context("Scroll", () => {
5757
utils.getScrollableElement().should("have.prop", "scrollLeft", 0);
5858
utils.getScrollableElement().should("have.prop", "scrollTop", 0);
5959
});
60+
6061
});

‎cypress/e2e/tests/standard/resize.spec.ts‎

Lines changed: 38 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ context("Resize", () => {
1616
utils.scrollTo(SCROLL, 0);
1717
utils.resizeColumn(SCROLL + (SCROLL % config.cellWidth), 1, RESIZE_WIDTH, {
1818
beforePointerUp: () => {
19-
utils.resizeHint().should("be.visible");
19+
utils.resizeHintColumn().should("be.visible");
2020
// 🟠 TODO - hint should contain exact value
21-
// utils.resizeHint().and('contain.text', `Width: ${config.cellWidth + RESIZE_WIDTH}px`)
21+
// utils.resizeHintColumn().and('contain.text', `Width: ${config.cellWidth + RESIZE_WIDTH}px`)
2222
},
2323
});
2424

@@ -33,9 +33,9 @@ context("Resize", () => {
3333
-RESIZE_WIDTH,
3434
{
3535
beforePointerUp: () => {
36-
utils.resizeHint().should("be.visible");
36+
utils.resizeHintColumn().should("be.visible");
3737
// 🟠 TODO - hint should contain exact value
38-
// utils.resizeHint().and('contain.text', `Width: ${config.cellWidth}px`)
38+
// utils.resizeHintColumn().and('contain.text', `Width: ${config.cellWidth}px`)
3939
},
4040
}
4141
);
@@ -48,9 +48,9 @@ context("Resize", () => {
4848

4949
utils.resizeColumn(config.cellWidth, utils.getCellYCenter(), RESIZE_WIDTH, {
5050
beforePointerUp: () => {
51-
utils.resizeHint().should("be.visible");
51+
utils.resizeHintColumn().should("be.visible");
5252
utils
53-
.resizeHint()
53+
.resizeHintColumn()
5454
.and("contain.text", `Width: ${config.minCellWidth}px`);
5555
},
5656
});
@@ -74,9 +74,9 @@ context("Resize", () => {
7474
{
7575
// 17 px - scroll width
7676
beforePointerUp: () => {
77-
utils.resizeHint().should("be.visible");
77+
utils.resizeHintColumn().should("be.visible");
7878
utils
79-
.resizeHint()
79+
.resizeHintColumn()
8080
.and("contain.text", `Width: ${config.minCellWidth}px`);
8181
},
8282
}
@@ -105,7 +105,7 @@ context("Resize", () => {
105105
// 17 px - scroll width
106106
beforePointerUp: () => {
107107
// 🟠 TODO - hint should contain exact value
108-
utils.resizeHint().and('contain.text', `Width: ${config.cellWidth + RESIZE_WIDTH + 3}px`)
108+
utils.resizeHintColumn().and('contain.text', `Width: ${config.cellWidth + RESIZE_WIDTH + 3}px`)
109109
},
110110
}
111111
);
@@ -115,4 +115,33 @@ context("Resize", () => {
115115
config.cellWidth + RESIZE_WIDTH
116116
);
117117
});
118+
119+
it("Should increase and reduce row height on scrolled view with content in vertical axis", () => { // ✅
120+
const RESIZE_HEIGHT = 100;
121+
const SCROLL = 15;
122+
123+
utils.scrollTo(0, SCROLL);
124+
utils.resizeRow(1, SCROLL + (SCROLL % config.cellHeight), RESIZE_HEIGHT, {
125+
beforePointerUp: () => {
126+
utils.resizeHintRow().should("be.visible");
127+
utils.resizeHintRow().and('contain.text', `Height: ${config.cellHeight + RESIZE_HEIGHT+1}px`)
128+
},
129+
});
130+
131+
utils.assertElementHeightIsEqual(
132+
utils.getCell(0, 0),
133+
config.cellHeight + RESIZE_HEIGHT
134+
);
135+
136+
utils.resizeRow(1, SCROLL + RESIZE_HEIGHT + (SCROLL % config.cellHeight), -RESIZE_HEIGHT, {
137+
beforePointerUp: () => {
138+
utils.resizeHintRow().should("be.visible");
139+
utils.resizeHintRow().and('contain.text', `Height: ${config.cellHeight+3}px`)
140+
},
141+
});
142+
143+
utils.assertElementHeightIsEqual(utils.getCell(0, 0), config.cellHeight);
144+
145+
});
146+
118147
});

‎cypress/e2e/tests/sticky/resize.spec.ts‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -158,4 +158,49 @@ context("Resize", () => {
158158
config.cellWidth + RESIZE_WIDTH
159159
);
160160
});
161+
162+
// rows height
163+
it("should increase and reduce row height on scrolled view with content in vertical axis", () => {
164+
// ✅
165+
const RESIZE_HEIGHT = config.cellHeight;
166+
167+
utils.scrollTo(0, 200);
168+
utils.resizeRow(
169+
utils.getCellXCenter(),
170+
config.cellHeight - 2,
171+
RESIZE_HEIGHT
172+
);
173+
cy.wait(200);
174+
175+
utils.assertElementHeightIsEqual(
176+
utils.getCell(0, 0),
177+
config.cellHeight + RESIZE_HEIGHT
178+
);
179+
180+
utils.resizeRow(
181+
utils.getCellXCenter(),
182+
config.cellHeight + RESIZE_HEIGHT,
183+
-RESIZE_HEIGHT
184+
);
185+
cy.wait(200);
186+
187+
utils.assertElementHeightIsEqual(utils.getCell(0, 0), config.cellHeight);
188+
});
189+
190+
it("should shrink row height to min height", () => {
191+
// ✅
192+
const RESIZE_HEIGHT = -config.cellHeight;
193+
194+
utils.scrollTo(0, 20);
195+
utils.resizeRow(
196+
utils.getCellXCenter(),
197+
config.cellHeight,
198+
RESIZE_HEIGHT
199+
);
200+
cy.wait(200);
201+
202+
utils.assertElementHeightIsEqual(utils.getCell(0, 0), config.minCellHeight);
203+
204+
});
205+
161206
});

0 commit comments

Comments
 (0)