Skip to content

Commit 4b175fb

Browse files
committed
Test changes
- Updated the original tests and helpers, to accommodate new test - Added new simple test for collisions
1 parent 3f5f735 commit 4b175fb

File tree

3 files changed

+89
-45
lines changed

3 files changed

+89
-45
lines changed

tests/Helpers.ts

+8-12
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,7 @@ export class Helper {
7070
tP: CombinedAlignment,
7171
my?: CombinedAlignment,
7272
at?: CombinedAlignment,
73+
onCollision?: (input: number) => number,
7374
) {
7475
let left = 0;
7576

@@ -116,18 +117,16 @@ export class Helper {
116117
}
117118
}
118119

119-
if (this.collision === CollisionHandler.ignore) {
120-
return left;
121-
}
122-
123-
// Work on collision
124-
return left;
120+
return this.collision !== CollisionHandler.ignore && onCollision
121+
? onCollision(left)
122+
: left;
125123
}
126124

127125
getTop(
128126
tP: CombinedAlignment,
129127
my?: CombinedAlignment,
130128
at?: CombinedAlignment,
129+
onCollision?: (input: number) => number,
131130
) {
132131
let top = 0;
133132

@@ -180,12 +179,9 @@ export class Helper {
180179
}
181180
}
182181

183-
if (this.collision === CollisionHandler.ignore) {
184-
return top;
185-
}
186-
187-
// Work on collision
188-
return top;
182+
return this.collision !== CollisionHandler.ignore && onCollision
183+
? onCollision(top)
184+
: top;
189185
}
190186

191187
/**

tests/collision.test.ts

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import { CollisionHandler, position } from '../src/index';
2+
import { allData, Helper, SizeData } from './Helpers';
3+
4+
const windowSize: SizeData = {
5+
height: 1000,
6+
width: 1000,
7+
},
8+
anchorSize: SizeData = {
9+
height: 100,
10+
width: 100,
11+
},
12+
targetSize: SizeData = {
13+
height: 100,
14+
width: 200,
15+
},
16+
helper = new Helper(CollisionHandler.bestFit, anchorSize, targetSize),
17+
leftCollision: (input: number) => number = () => 800;
18+
19+
helper.setupEnvironment(windowSize);
20+
21+
test('Collision changes the output', () => {
22+
const tP = 'center right',
23+
myA = 'top center',
24+
atA = 'bottom center';
25+
26+
helper.setupTest(tP);
27+
28+
const pData = position({
29+
...{ debug: true },
30+
...{
31+
my: myA,
32+
at: atA,
33+
target: document.querySelector<HTMLDivElement>('.target')!,
34+
anchor: document.querySelector<HTMLElement>('.anchor')!,
35+
},
36+
}) as allData;
37+
38+
expect({
39+
left: parseInt(pData.left, 10),
40+
top: parseInt(pData.top, 10),
41+
}).toStrictEqual({
42+
left: helper.getLeft(tP, myA, atA, leftCollision),
43+
top: helper.getTop(tP, myA, atA),
44+
});
45+
});

tests/index.test.ts

+36-33
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { CollisionHandler, CombinedAlignment, position } from '../src/index';
2-
// @ts-ignore
32
import { allData, Helper, SizeData } from './Helpers';
43

54
const windowSize: SizeData = {
@@ -25,79 +24,83 @@ const windowSize: SizeData = {
2524
'bottom center',
2625
'bottom right',
2726
],
28-
helper = new Helper(CollisionHandler.ignore, anchorSize, targetSize);
27+
helper = new Helper(CollisionHandler.ignore, anchorSize, targetSize),
28+
collisionHandler: (input: number) => number = (input) => input + 50;
2929

3030
helper.setupEnvironment(windowSize);
3131

3232
describe('HoverPosition (collisions ignored)', () => {
33-
// Add base style
34-
3533
describe.each(positionArray)('Target Position: %s', (tP) => {
36-
describe.each(positionArray)('options.my: %s', (myAlignment) => {
37-
test.each(positionArray)('options.at: %s', (atAlignment) => {
34+
describe.each(positionArray)('options.my: %s', (myPlacement) => {
35+
test.each(positionArray)('options.at: %s', (atPlacement) => {
3836
helper.setupTest(tP);
3937

4038
const pData = position({
4139
...{ debug: true },
4240
...{
43-
my: myAlignment,
44-
at: atAlignment,
41+
my: myPlacement,
42+
at: atPlacement,
4543
target: document.querySelector<HTMLDivElement>(
4644
'.target',
4745
)!,
4846
anchor: document.querySelector<HTMLElement>('.anchor')!,
4947
collision: CollisionHandler.ignore,
5048
},
5149
}) as allData;
52-
/*
53-
console.log(
54-
`${tP}|${myAlignment}|${atAlignment}`,
55-
pData,
56-
);
57-
*/
50+
5851
expect({
5952
left: parseInt(pData.left, 10),
6053
top: parseInt(pData.top, 10),
6154
}).toStrictEqual({
62-
left: helper.getLeft(tP, myAlignment, atAlignment),
63-
top: helper.getTop(tP, myAlignment, atAlignment),
55+
left: helper.getLeft(tP, myPlacement, atPlacement),
56+
top: helper.getTop(tP, myPlacement, atPlacement),
6457
});
6558
});
6659
});
6760
});
6861
});
6962

7063
test('Window scroll adjusts output', () => {
64+
// Set the window scroll position
7165
window.scrollX = 50;
7266
window.scrollY = 50;
73-
74-
const tP = 'top left',
75-
myA = 'top center',
76-
atA = 'bottom center';
77-
78-
helper.setupTest(tP);
67+
68+
const targetWindowPosition = 'top left',
69+
myPlacement = 'top center',
70+
atPlacement = 'bottom center';
71+
72+
helper.setupTest(targetWindowPosition);
7973

8074
const pData = position({
8175
...{ debug: true },
8276
...{
83-
my: myA,
84-
at: atA,
85-
target: document.querySelector<HTMLDivElement>(
86-
'.target',
87-
)!,
77+
my: myPlacement,
78+
at: atPlacement,
79+
target: document.querySelector<HTMLDivElement>('.target')!,
8880
anchor: document.querySelector<HTMLElement>('.anchor')!,
8981
collision: CollisionHandler.ignore,
9082
},
9183
}) as allData;
92-
84+
9385
expect({
9486
left: parseInt(pData.left, 10),
9587
top: parseInt(pData.top, 10),
9688
}).toStrictEqual({
97-
left: helper.getLeft(tP, myA, atA) + 50,
98-
top: helper.getTop(tP, myA, atA) + 50,
89+
left: helper.getLeft(
90+
targetWindowPosition,
91+
myPlacement,
92+
atPlacement,
93+
collisionHandler,
94+
),
95+
top: helper.getTop(
96+
targetWindowPosition,
97+
myPlacement,
98+
atPlacement,
99+
collisionHandler,
100+
),
99101
});
100-
101-
window.scrollX = 50;
102-
window.scrollY = 50;
102+
103+
// Reset the window scroll position
104+
window.scrollX = 0;
105+
window.scrollY = 0;
103106
});

0 commit comments

Comments
 (0)