Skip to content

Commit b1ff447

Browse files
thetthet
authored
Merge pull request #986 from Patternslib/pat-tooltip-get-content
Pat tooltip get content
2 parents 89ae588 + 90a10af commit b1ff447

File tree

6 files changed

+370
-210
lines changed

6 files changed

+370
-210
lines changed

‎package.json‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -45,12 +45,12 @@
4545
"@commitlint/cli": "^16.2.3",
4646
"@commitlint/config-conventional": "^16.2.1",
4747
"@release-it/conventional-changelog": "^4.2.2",
48-
"@testing-library/jest-dom": "^5.16.2",
48+
"@testing-library/jest-dom": "^5.16.3",
4949
"babel-loader": "^8.2.4",
5050
"copy-webpack-plugin": "^10.2.4",
5151
"core-js": "3.21.1",
5252
"css-loader": "^6.7.1",
53-
"eslint": "^8.11.0",
53+
"eslint": "^8.12.0",
5454
"eslint-config-prettier": "^8.5.0",
5555
"expose-loader": "^3.0.0",
5656
"husky": "^7.0.4",
@@ -60,10 +60,10 @@
6060
"jest": "^27.5.1",
6161
"jest-raw-loader": "^1.0.1",
6262
"jest-watch-typeahead": "^1.0.0",
63-
"prettier": "^2.6.0",
63+
"prettier": "^2.6.1",
6464
"regenerator-runtime": "^0.13.9",
65-
"release-it": "^14.13.1",
66-
"sass": "^1.49.9",
65+
"release-it": "^14.14.0",
66+
"sass": "^1.49.10",
6767
"sass-loader": "^12.6.0",
6868
"style-loader": "^3.3.0",
6969
"terser-webpack-plugin": "^5.3.1",

‎src/pat/inject/inject.js‎

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -273,10 +273,14 @@ const inject = {
273273
let _confirm = false;
274274
if (cfg.confirm == "always") {
275275
_confirm = true;
276-
} else if (cfg.confirm === "form-data") {
277-
if (cfg.target != "none") _confirm = this.elementIsDirty(cfg.$target);
278-
} else if (cfg.confirm === "class") {
279-
if (cfg.target != "none") _confirm = cfg.$target.hasClass("is-dirty");
276+
} else if (
277+
cfg.confirm === "form-data" &&
278+
cfg.target &&
279+
cfg.target !== "none"
280+
) {
281+
_confirm = this.elementIsDirty(cfg.$target);
282+
} else if (cfg.confirm === "class" && cfg.target && cfg.target !== "none") {
283+
_confirm = cfg.$target.hasClass("is-dirty");
280284
}
281285
if (_confirm) {
282286
should_confirm = true;
@@ -600,7 +604,7 @@ const inject = {
600604
}
601605
cfgs.forEach((cfg, idx1) => {
602606
const perform_inject = () => {
603-
if (cfg.target != "none")
607+
if (cfg.target !== "none")
604608
cfg.$target.each((idx2, target) => {
605609
this._performInjection(
606610
target,
@@ -651,7 +655,7 @@ const inject = {
651655

652656
// Try to get a suitable error message from pre-configured error pages.
653657
const error_page_url = document
654-
.querySelector(`meta[name^=pat-inject-status-${status}]`)
658+
?.querySelector(`meta[name^=pat-inject-status-${status}]`)
655659
?.getAttribute("content", false);
656660
error_page_fragment = error_page_url?.split("#")[1];
657661
error_page_fragment = error_page_fragment ? `#${error_page_fragment}` : null;
@@ -720,16 +724,18 @@ const inject = {
720724
return;
721725
}
722726
$el.data("pat-inject-triggered", true);
723-
// possibility for spinners on targets
724-
cfgs.filter((cfg) => cfg?.loadingClass).forEach((cfg) => {
725-
if (cfg.target != "none") {
727+
728+
for (const cfg of cfgs) {
729+
// Add a execute class on the pat-inject element.
730+
if (cfg?.executingClass) {
731+
$el[0].classList.add(cfg.executingClass);
732+
}
733+
// Add a loading class to the target.
734+
// Can be used for loading-spinners.
735+
if (cfg?.loadingClass && cfg?.target !== "none") {
726736
cfg.$target.addClass(cfg.loadingClass);
727737
}
728-
});
729-
// Put the execute class on the elem that has pat inject on it
730-
cfgs.filter((cfg) => cfg?.executingClass).forEach((cfg) =>
731-
$el.addClass(cfg.executingClass)
732-
);
738+
}
733739

734740
$el.on(
735741
"pat-ajax-success.pat-inject",

‎src/pat/inject/inject.test.js‎

Lines changed: 63 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ describe("pat-inject", function () {
5353

5454
describe("The loading-class argument", function () {
5555
it("has a default value of 'injecting' and gets added to the target while content is still loading", async function () {
56-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
56+
const spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
5757
var $a = $('<a class="pat-inject" href="test.html#someid">link</a>');
5858
var $div = $('<div id="someid" />');
5959
$("#lab").empty().append($a).append($div);
@@ -73,10 +73,12 @@ describe("pat-inject", function () {
7373
await utils.timeout(1); // wait a tick for async to settle.
7474
expect($div.hasClass("injecting")).toBeFalsy();
7575
expect(callback).toHaveBeenCalled();
76+
77+
spy_ajax.mockRestore();
7678
});
7779

7880
it("can be set to another string value which then gets added to the target while content is still loading'", async function () {
79-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
81+
const spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
8082
var $a = $(
8183
'<a class="pat-inject" data-pat-inject="loading-class: other-class;" href="test.html#someid">link</a>'
8284
);
@@ -94,10 +96,12 @@ describe("pat-inject", function () {
9496
answer("<html><body>" + '<div id="someid">repl</div>' + "</body></html>");
9597
await utils.timeout(1); // wait a tick for async to settle.
9698
expect($div.hasClass("other-class")).toBeFalsy();
99+
100+
spy_ajax.mockRestore();
97101
});
98102

99103
it("can be set to an empty string value so that nothing gets added to the target while content is still loading'", function () {
100-
jest.spyOn($, "ajax");
104+
const spy_ajax = jest.spyOn($, "ajax");
101105
var $a = $(
102106
'<a class="pat-inject" data-pat-inject="loading-class: ;" href="test.html#someid">link</a>'
103107
);
@@ -108,6 +112,8 @@ describe("pat-inject", function () {
108112
var cfgs = pattern.extractConfig($a, {});
109113
expect(cfgs[0].loadingClass).toBe("");
110114
expect($div[0].className).toBe("");
115+
116+
spy_ajax.mockRestore();
111117
});
112118
});
113119

@@ -116,7 +122,7 @@ describe("pat-inject", function () {
116122
var $a = $('<a class="pat-inject" href="test.html#someid">link</a>');
117123
var $div = $('<div id="someid" />');
118124
$("#lab").empty().append($a).append($div);
119-
jest.spyOn(pattern, "onTrigger");
125+
const spy_onTrigger = jest.spyOn(pattern, "onTrigger");
120126
var spy_confirm = jest
121127
.spyOn(window, "confirm")
122128
.mockImplementation(() => false);
@@ -133,6 +139,9 @@ describe("pat-inject", function () {
133139
$div.addClass("is-dirty");
134140
$a.trigger("click");
135141
expect(spy_confirm).toHaveBeenCalled();
142+
143+
spy_onTrigger.mockRestore();
144+
spy_confirm.mockRestore();
136145
});
137146

138147
it("can be set to 'never' to never ask for confirmation", function () {
@@ -155,6 +164,9 @@ describe("pat-inject", function () {
155164
$a.trigger("click");
156165
expect(spy_confirm).not.toHaveBeenCalled();
157166
expect(spy_onTrigger).toHaveBeenCalled();
167+
168+
spy_onTrigger.mockRestore();
169+
spy_confirm.mockRestore();
158170
});
159171

160172
it("can be set to 'always' to always ask for confirmation before injecting", function () {
@@ -177,6 +189,9 @@ describe("pat-inject", function () {
177189
$a.trigger("click");
178190
expect(spy_onTrigger).toHaveBeenCalled();
179191
expect(spy_confirm).toHaveBeenCalled();
192+
193+
spy_onTrigger.mockRestore();
194+
spy_confirm.mockRestore();
180195
});
181196

182197
it("can be set to 'form-data' to ask for confirmation before injecting over form fields changed by the user", function () {
@@ -205,6 +220,9 @@ describe("pat-inject", function () {
205220
$a.trigger("click");
206221
expect(window.confirm.mock.calls.length).toBe(1);
207222
expect(spy_onTrigger).toHaveBeenCalled();
223+
224+
spy_onTrigger.mockRestore();
225+
spy_confirm.mockRestore();
208226
});
209227

210228
describe("The confirm-message argument", function () {
@@ -214,8 +232,8 @@ describe("pat-inject", function () {
214232
);
215233
var $div = $('<div id="someid" />');
216234
$("#lab").empty().append($a).append($div);
217-
jest.spyOn(pattern, "onTrigger");
218-
var spy_confirm = jest
235+
const spy_onTrigger = jest.spyOn(pattern, "onTrigger");
236+
const spy_confirm = jest
219237
.spyOn(window, "confirm")
220238
.mockImplementation(() => false);
221239

@@ -228,6 +246,9 @@ describe("pat-inject", function () {
228246
$a.trigger("click");
229247
expect(spy_confirm).toHaveBeenCalled();
230248
expect(spy_confirm).toHaveBeenCalledWith("Hello world");
249+
250+
spy_onTrigger.mockRestore();
251+
spy_confirm.mockRestore();
231252
});
232253
});
233254
});
@@ -260,6 +281,8 @@ describe("pat-inject", function () {
260281
"<a>This is a test</a>"
261282
);
262283
expect(spy_rebaseURL).not.toHaveBeenCalled();
284+
285+
spy_rebaseURL.mockRestore();
263286
});
264287

265288
it("Element with link attribute", function () {
@@ -500,7 +523,7 @@ describe("pat-inject", function () {
500523
beforeEach(function () {});
501524

502525
it("The pat-inject-success get triggered after successful injection", async function () {
503-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
526+
const spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
504527
document.body.innerHTML = `
505528
<a class="pat-inject" href="test.html">link</a>
506529
`;
@@ -512,11 +535,15 @@ describe("pat-inject", function () {
512535
answer("<html><body><div></div></body></html>");
513536
await utils.timeout(1); // wait a tick for async to settle.
514537
expect(callback).toHaveBeenCalled();
538+
539+
spy_ajax.mockRestore();
515540
});
516541

517542
describe("The patterns-injected event", function () {
518543
it("gets triggered after injection has finished'", async function () {
519-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
544+
const spy_ajax = jest
545+
.spyOn($, "ajax")
546+
.mockImplementation(() => deferred);
520547
var $a = $('<a class="pat-inject" href="test.html#someid">link</a>');
521548
var $div = $('<div id="someid" />');
522549
$("#lab").empty().append($a).append($div);
@@ -529,19 +556,26 @@ describe("pat-inject", function () {
529556
);
530557
await utils.timeout(1); // wait a tick for async to settle.
531558
expect(callback).toHaveBeenCalled();
559+
560+
spy_ajax.mockRestore();
532561
});
533562
});
534563

535564
describe("Injection on an anchor element", function () {
536565
var $a, $div;
566+
let spy_ajax;
537567

538568
beforeEach(function () {
539-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
569+
spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
540570
$a = $('<a class="pat-inject" href="test.html#someid">link</a>');
541571
$div = $('<div id="someid" />');
542572
$("#lab").append($a).append($div);
543573
});
544574

575+
afterEach(function () {
576+
spy_ajax.mockRestore();
577+
});
578+
545579
it("fetches url on click", function () {
546580
pattern.init($a);
547581
$a.trigger("click");
@@ -591,14 +625,18 @@ describe("pat-inject", function () {
591625
// It is only needed here, because this is the only test case that makes two ajax() calls.
592626
deferred = new $.Deferred();
593627
$.ajax.mockRestore();
594-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
628+
const spy_ajax2 = jest
629+
.spyOn($, "ajax")
630+
.mockImplementation(() => deferred);
595631

596632
$a.trigger("click");
597633
answer(
598634
'<html><body><div id="someid">new replacement</div></body></html>'
599635
);
600636
await utils.timeout(1); // wait a tick for async to settle.
601637
expect($div.html()).toBe("new replacement");
638+
639+
spy_ajax2.mockRestore();
602640
});
603641

604642
it("takes multiple source-target pairs", async function () {
@@ -708,14 +746,19 @@ describe("pat-inject", function () {
708746

709747
describe("inject on forms", function () {
710748
var $form, $div;
749+
let spy_ajax;
711750

712751
beforeEach(function () {
713-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
752+
spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
714753
$form = $('<form class="pat-inject" action="test.html#someid" />');
715754
$div = $('<div id="someid" />');
716755
$("#lab").append($form).append($div);
717756
});
718757

758+
afterEach(function () {
759+
spy_ajax.mockRestore();
760+
});
761+
719762
it("trigger injection on submit", async function () {
720763
pattern.init($form);
721764
$form.trigger("submit");
@@ -1040,9 +1083,10 @@ describe("pat-inject", function () {
10401083

10411084
describe("Error handling", () => {
10421085
let $a;
1086+
let spy_ajax;
10431087

10441088
beforeEach(() => {
1045-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
1089+
spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
10461090
document.body.innerhtml = `
10471091
<div id="lab">
10481092
<a class="pat-inject" href="test.html#someid">link</a>
@@ -1055,6 +1099,7 @@ describe("pat-inject", function () {
10551099
afterEach(() => {
10561100
document.head.innerHTML = "";
10571101
document.body.innerHTML = "";
1102+
spy_ajax.mockRestore();
10581103
});
10591104

10601105
it("Adds on error a data-error-message to body in standard case.", async () => {
@@ -1337,7 +1382,7 @@ describe("pat-inject", function () {
13371382
// becomes visible.
13381383
// Instead we test the setup, loading, unregistration, etc.
13391384

1340-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
1385+
const spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
13411386
answer("<html><body>OK</body></html>");
13421387

13431388
document.body.innerHTML = `
@@ -1382,10 +1427,12 @@ describe("pat-inject", function () {
13821427
expect(observer._cnt).toBe(3);
13831428
await utils.timeout(10); // wait for delay-time
13841429
expect(el.textContent).toBe("NOT");
1430+
1431+
spy_ajax.mockRestore();
13851432
});
13861433

13871434
it("Test trigger: autoload-visible, default delay time", async () => {
1388-
jest.spyOn($, "ajax").mockImplementation(() => deferred);
1435+
const spy_ajax = jest.spyOn($, "ajax").mockImplementation(() => deferred);
13891436
answer("<html><body>OK</body></html>");
13901437

13911438
document.body.innerHTML = `
@@ -1412,6 +1459,8 @@ describe("pat-inject", function () {
14121459
expect(el.textContent).toBe("test"); // delay time not yet passed
14131460
await utils.timeout(100); // delay time passed, default is 200ms
14141461
expect(el.textContent).toBe("OK");
1462+
1463+
spy_ajax.mockRestore();
14151464
});
14161465
});
14171466

0 commit comments

Comments
 (0)