Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 35a3b26

Browse files
afshinmafshinm
committed
feat: adding tour step and mode to oncomplete callback (fixes usablica#1385)
1 parent 52fe824 commit 35a3b26

File tree

18 files changed

+718
-520
lines changed

18 files changed

+718
-520
lines changed

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,9 @@
1818
},
1919
"main": "intro.js",
2020
"scripts": {
21-
"prettier": "prettier --write 'src/**/*'",
21+
"prettier": "prettier --write '(src|tests)/**/*.(js|ts|json|html)'",
2222
"test": "run-p test:prettier test:jest test:jshint test:cypress",
23-
"test:prettier": "prettier --check 'src/**/*'",
23+
"test:prettier": "prettier --check '(src|tests)/**/*.(js|ts|json|html)'",
2424
"test:watch": "jest ./tests --verbose --watch",
2525
"test:jest": "jest ./tests --verbose",
2626
"test:jshint": "jshint ./src --verbose && jshint ./tests --verbose",

‎src/core/onKeyDown.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ export default function onKeyDown(e) {
4949
this._introItems.length - 1 === this._currentStep &&
5050
typeof this._introCompleteCallback === "function"
5151
) {
52-
this._introCompleteCallback.call(this);
52+
this._introCompleteCallback.call(this, this._currentStep, "skip");
5353
}
5454

5555
exitIntro.call(this, this._targetElement);

‎src/core/showElement.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -377,7 +377,7 @@ export default function _showElement(targetElement) {
377377
nextStep.call(self);
378378
} else if (/introjs-donebutton/gi.test(nextTooltipButton.className)) {
379379
if (typeof self._introCompleteCallback === "function") {
380-
self._introCompleteCallback.call(self);
380+
self._introCompleteCallback.call(self, self._currentStep, "done");
381381
}
382382

383383
exitIntro.call(self, self._targetElement);
@@ -412,7 +412,7 @@ export default function _showElement(targetElement) {
412412
self._introItems.length - 1 === self._currentStep &&
413413
typeof self._introCompleteCallback === "function"
414414
) {
415-
self._introCompleteCallback.call(self);
415+
self._introCompleteCallback.call(self, self._currentStep, "skip");
416416
}
417417

418418
if (typeof self._introSkipCallback === "function") {

‎src/core/steps.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ export function nextStep() {
7373
//end of the intro
7474
//check if any callback is defined
7575
if (typeof this._introCompleteCallback === "function") {
76-
this._introCompleteCallback.call(this);
76+
this._introCompleteCallback.call(this, this._currentStep, "end");
7777
}
7878
exitIntro.call(this, this._targetElement);
7979
return;

‎tests/core/fetchIntroSteps.test.js‎

Lines changed: 71 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -7,55 +7,62 @@ describe("fetchIntroSteps", () => {
77
const steps = fetchIntroSteps.call(
88
{
99
_options: {
10-
steps: [{
11-
element: '#element_does_not_exist',
12-
intro: 'hello world'
13-
}, {
14-
intro: 'second'
15-
}]
10+
steps: [
11+
{
12+
element: "#element_does_not_exist",
13+
intro: "hello world",
14+
},
15+
{
16+
intro: "second",
17+
},
18+
],
1619
},
1720
},
1821
targetElement
1922
);
2023

2124
expect(steps.length).toBe(2);
2225

23-
expect(steps[0].position).toBe('floating');
24-
expect(steps[0].intro).toBe('hello world');
26+
expect(steps[0].position).toBe("floating");
27+
expect(steps[0].intro).toBe("hello world");
2528
expect(steps[0].step).toBe(1);
2629

27-
expect(steps[1].position).toBe('floating');
28-
expect(steps[1].intro).toBe('second');
30+
expect(steps[1].position).toBe("floating");
31+
expect(steps[1].intro).toBe("second");
2932
expect(steps[1].step).toBe(2);
3033
});
3134

3235
test("should find and add elements from options.steps to the list", () => {
3336
const targetElement = document.createElement("div");
3437

35-
const stepOne = document.createElement('div');
36-
stepOne.setAttribute('id', 'first');
38+
const stepOne = document.createElement("div");
39+
stepOne.setAttribute("id", "first");
3740

38-
const stepTwo = document.createElement('div');
39-
stepTwo.setAttribute('id', 'second');
41+
const stepTwo = document.createElement("div");
42+
stepTwo.setAttribute("id", "second");
4043

4144
document.body.appendChild(stepOne);
4245
document.body.appendChild(stepTwo);
4346

4447
const steps = fetchIntroSteps.call(
4548
{
4649
_options: {
47-
tooltipPosition: 'bottom',
48-
steps: [{
49-
element: '#first',
50-
intro: 'first'
51-
}, {
52-
element: '#second',
53-
intro: 'second',
54-
position: 'top'
55-
}, {
56-
element: '#not_found',
57-
intro: 'third'
58-
}]
50+
tooltipPosition: "bottom",
51+
steps: [
52+
{
53+
element: "#first",
54+
intro: "first",
55+
},
56+
{
57+
element: "#second",
58+
intro: "second",
59+
position: "top",
60+
},
61+
{
62+
element: "#not_found",
63+
intro: "third",
64+
},
65+
],
5966
},
6067
},
6168
targetElement
@@ -64,111 +71,114 @@ describe("fetchIntroSteps", () => {
6471
expect(steps.length).toBe(3);
6572

6673
expect(steps[0].element).toBe(stepOne);
67-
expect(steps[0].position).toBe('bottom');
68-
expect(steps[0].intro).toBe('first');
74+
expect(steps[0].position).toBe("bottom");
75+
expect(steps[0].intro).toBe("first");
6976
expect(steps[0].step).toBe(1);
7077

7178
expect(steps[1].element).toBe(stepTwo);
72-
expect(steps[1].position).toBe('top');
73-
expect(steps[1].intro).toBe('second');
79+
expect(steps[1].position).toBe("top");
80+
expect(steps[1].intro).toBe("second");
7481
expect(steps[1].step).toBe(2);
7582

76-
expect(steps[2].position).toBe('floating');
77-
expect(steps[2].intro).toBe('third');
83+
expect(steps[2].position).toBe("floating");
84+
expect(steps[2].intro).toBe("third");
7885
expect(steps[2].step).toBe(3);
7986
});
8087

8188
test("should find the data-* elements from the DOM", () => {
8289
const targetElement = document.createElement("div");
8390

84-
const stepOne = document.createElement('div');
85-
stepOne.setAttribute('data-intro', 'first');
91+
const stepOne = document.createElement("div");
92+
stepOne.setAttribute("data-intro", "first");
8693

87-
const stepTwo = document.createElement('div');
88-
stepTwo.setAttribute('data-intro', 'second');
89-
stepTwo.setAttribute('data-position', 'left');
94+
const stepTwo = document.createElement("div");
95+
stepTwo.setAttribute("data-intro", "second");
96+
stepTwo.setAttribute("data-position", "left");
9097

9198
targetElement.appendChild(stepOne);
9299
targetElement.appendChild(stepTwo);
93100

94101
const steps = fetchIntroSteps.call(
95102
{
96103
_options: {
97-
tooltipPosition: 'bottom'
104+
tooltipPosition: "bottom",
98105
},
99106
},
100107
targetElement
101108
);
102109

103110
expect(steps.length).toBe(2);
104111

105-
expect(steps[0].position).toBe('bottom');
106-
expect(steps[0].intro).toBe('first');
112+
expect(steps[0].position).toBe("bottom");
113+
expect(steps[0].intro).toBe("first");
107114
expect(steps[0].step).toBe(1);
108115

109-
expect(steps[1].position).toBe('left');
110-
expect(steps[1].intro).toBe('second');
116+
expect(steps[1].position).toBe("left");
117+
expect(steps[1].intro).toBe("second");
111118
expect(steps[1].step).toBe(2);
112119
});
113120

114121
test("should respect the custom step attribute (DOM)", () => {
115122
const targetElement = document.createElement("div");
116123

117-
const stepOne = document.createElement('div');
118-
stepOne.setAttribute('data-intro', 'second');
119-
stepOne.setAttribute('data-step', '5');
124+
const stepOne = document.createElement("div");
125+
stepOne.setAttribute("data-intro", "second");
126+
stepOne.setAttribute("data-step", "5");
120127

121-
const stepTwo = document.createElement('div');
122-
stepTwo.setAttribute('data-intro', 'first');
128+
const stepTwo = document.createElement("div");
129+
stepTwo.setAttribute("data-intro", "first");
123130

124131
targetElement.appendChild(stepOne);
125132
targetElement.appendChild(stepTwo);
126133

127134
const steps = fetchIntroSteps.call(
128135
{
129136
_options: {
130-
tooltipPosition: 'bottom'
137+
tooltipPosition: "bottom",
131138
},
132139
},
133140
targetElement
134141
);
135142

136143
expect(steps.length).toBe(2);
137144

138-
expect(steps[0].intro).toBe('first');
145+
expect(steps[0].intro).toBe("first");
139146
expect(steps[0].step).toBe(1);
140147

141-
expect(steps[1].intro).toBe('second');
148+
expect(steps[1].intro).toBe("second");
142149
expect(steps[1].step).toBe(5);
143150
});
144151

145152
test("should ignore DOM elements when options.steps is available", () => {
146153
const targetElement = document.createElement("div");
147154

148-
const stepOne = document.createElement('div');
149-
stepOne.setAttribute('data-intro', 'first');
155+
const stepOne = document.createElement("div");
156+
stepOne.setAttribute("data-intro", "first");
150157

151-
const stepTwo = document.createElement('div');
152-
stepTwo.setAttribute('data-intro', 'second');
158+
const stepTwo = document.createElement("div");
159+
stepTwo.setAttribute("data-intro", "second");
153160

154161
targetElement.appendChild(stepOne);
155162
targetElement.appendChild(stepTwo);
156163

157164
const steps = fetchIntroSteps.call(
158165
{
159166
_options: {
160-
steps: [{
161-
intro: 'steps-first',
162-
}, {
163-
intro: 'steps-second',
164-
}]
167+
steps: [
168+
{
169+
intro: "steps-first",
170+
},
171+
{
172+
intro: "steps-second",
173+
},
174+
],
165175
},
166176
},
167177
targetElement
168178
);
169179

170180
expect(steps.length).toBe(2);
171-
expect(steps[0].intro).toBe('steps-first');
172-
expect(steps[1].intro).toBe('steps-second');
181+
expect(steps[0].intro).toBe("steps-first");
182+
expect(steps[1].intro).toBe("steps-second");
173183
});
174184
});

‎tests/core/introForElement.test.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ describe("introForElement", () => {
1313

1414
const self = {
1515
_options: {},
16-
_introStartCallback: onstartCallback
16+
_introStartCallback: onstartCallback,
1717
};
1818

1919
introForElement.call(self, document.body);

‎tests/core/refresh.test.js‎

Lines changed: 33 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -9,39 +9,51 @@ describe("refresh", () => {
99
document.body.appendChild(targetElement);
1010

1111
const instance = introJs(targetElement).setOptions({
12-
steps: [{
13-
intro: 'first',
14-
}]
12+
steps: [
13+
{
14+
intro: "first",
15+
},
16+
],
1517
});
1618

1719
instance.start();
1820

1921
expect(instance._introItems.length).toBe(1);
2022
expect(document.querySelectorAll(".introjs-bullets ul li").length).toBe(1);
2123

22-
instance.setOptions({
23-
steps: [{
24-
intro: 'first'
25-
}, {
26-
intro: 'second'
27-
}]
28-
}).refresh();
24+
instance
25+
.setOptions({
26+
steps: [
27+
{
28+
intro: "first",
29+
},
30+
{
31+
intro: "second",
32+
},
33+
],
34+
})
35+
.refresh();
2936

3037
expect(instance._introItems.length).toBe(1);
31-
expect(instance._introItems[0].intro).toBe('first');
38+
expect(instance._introItems[0].intro).toBe("first");
3239
expect(document.querySelectorAll(".introjs-bullets ul li").length).toBe(1);
3340

34-
instance.setOptions({
35-
steps: [{
36-
intro: 'first'
37-
}, {
38-
intro: 'second'
39-
}]
40-
}).refresh(true);
41+
instance
42+
.setOptions({
43+
steps: [
44+
{
45+
intro: "first",
46+
},
47+
{
48+
intro: "second",
49+
},
50+
],
51+
})
52+
.refresh(true);
4153

4254
expect(instance._introItems.length).toBe(2);
43-
expect(instance._introItems[0].intro).toBe('first');
44-
expect(instance._introItems[1].intro).toBe('second');
55+
expect(instance._introItems[0].intro).toBe("first");
56+
expect(instance._introItems[1].intro).toBe("second");
4557
expect(document.querySelectorAll(".introjs-bullets ul li").length).toBe(2);
4658
});
47-
});
59+
});

0 commit comments

Comments
 (0)