Skip to content

Commit 7011525

Browse files
committed
fix: Align to changes in pat-modal where pat-modal-ready is thrown only once and not on the initiating button but on the injected modal.
1 parent fbda4f6 commit 7011525

File tree

5 files changed

+73
-62
lines changed

5 files changed

+73
-62
lines changed

src/extensions/embed.js

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -105,14 +105,20 @@ function embed_panel({ app }) {
105105

106106
export function init({ app, button }) {
107107
// Initialize modal after it has injected.
108-
button.addEventListener("pat-modal-ready", () => {
109-
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
110-
// If this pat-tiptap instance is not the one which was last
111-
// focused, just return and do nothing.
112-
// This might be due to one toolbar shared by multiple editors.
113-
return;
114-
}
115-
embed_panel({ app: app });
108+
button.addEventListener("click", () => {
109+
document.addEventListener(
110+
"pat-modal-ready",
111+
() => {
112+
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
113+
// If this pat-tiptap instance is not the one which was last
114+
// focused, just return and do nothing.
115+
// This might be due to one toolbar shared by multiple editors.
116+
return;
117+
}
118+
embed_panel({ app: app });
119+
},
120+
{ once: true }
121+
);
116122
});
117123
}
118124

src/extensions/image-figure.js

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -121,14 +121,20 @@ function image_panel({ app }) {
121121

122122
export function init({ app, button }) {
123123
// Initialize modal after it has injected.
124-
button.addEventListener("pat-modal-ready", () => {
125-
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
126-
// If this pat-tiptap instance is not the one which was last
127-
// focused, just return and do nothing.
128-
// This might be due to one toolbar shared by multiple editors.
129-
return;
130-
}
131-
image_panel({ app: app });
124+
button.addEventListener("click", () => {
125+
document.addEventListener(
126+
"pat-modal-ready",
127+
() => {
128+
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
129+
// If this pat-tiptap instance is not the one which was last
130+
// focused, just return and do nothing.
131+
// This might be due to one toolbar shared by multiple editors.
132+
return;
133+
}
134+
image_panel({ app: app });
135+
},
136+
{ once: true }
137+
);
132138
});
133139
}
134140

src/extensions/link.js

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -199,14 +199,20 @@ async function link_panel({ app }) {
199199

200200
export function init({ app, button }) {
201201
// Initialize modal after it has injected.
202-
button.addEventListener("pat-modal-ready", () => {
203-
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
204-
// If this pat-tiptap instance is not the one which was last
205-
// focused, just return and do nothing.
206-
// This might be due to one toolbar shared by multiple editors.
207-
return;
208-
}
209-
link_panel({ app: app });
202+
button.addEventListener("click", () => {
203+
document.addEventListener(
204+
"pat-modal-ready",
205+
() => {
206+
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
207+
// If this pat-tiptap instance is not the one which was last
208+
// focused, just return and do nothing.
209+
// This might be due to one toolbar shared by multiple editors.
210+
return;
211+
}
212+
link_panel({ app: app });
213+
},
214+
{ once: true }
215+
);
210216
});
211217

212218
app.editor.on("selectionUpdate", async () => {

src/extensions/source.js

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -64,13 +64,19 @@ function source_panel({ app }) {
6464

6565
export function init({ app, button }) {
6666
// Initialize modal after it has injected.
67-
button.addEventListener("pat-modal-ready", () => {
68-
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
69-
// If this pat-tiptap instance is not the one which was last
70-
// focused, just return and do nothing.
71-
// This might be due to one toolbar shared by multiple editors.
72-
return;
73-
}
74-
source_panel({ app: app });
67+
button.addEventListener("click", () => {
68+
document.addEventListener(
69+
"pat-modal-ready",
70+
() => {
71+
if (dom.get_data(app.toolbar_el, "tiptap-instance", null) !== app) {
72+
// If this pat-tiptap instance is not the one which was last
73+
// focused, just return and do nothing.
74+
// This might be due to one toolbar shared by multiple editors.
75+
return;
76+
}
77+
source_panel({ app: app });
78+
},
79+
{ once: true }
80+
);
7581
});
7682
}

src/tiptap.test.js

Lines changed: 17 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,13 @@ const mockFetch =
1010
text: () => Promise.resolve(text),
1111
});
1212

13+
const open_panel = (button_selector) => {
14+
document.querySelector(button_selector).click();
15+
document.dispatchEvent(
16+
new Event("pat-modal-ready", { bubbles: true, cancelable: true })
17+
);
18+
};
19+
1320
const SUGGESTION_RESPONSE = `
1421
<!DOCTYPE html>
1522
<html>
@@ -102,9 +109,7 @@ describe("pat-tiptap", () => {
102109
const containers = document.querySelectorAll(".tiptap-container");
103110

104111
containers[0].querySelector("[contenteditable]").focus(); // Set focus to bypass toolbar check
105-
document
106-
.querySelector("#tiptap-external-toolbar-1 .button-link")
107-
.dispatchEvent(new Event("pat-modal-ready"));
112+
open_panel("#tiptap-external-toolbar-1 .button-link");
108113
await utils.timeout(1);
109114

110115
document.querySelector("#link-panel [name=tiptap-href]").value = "https://url1.com/"; // prettier-ignore
@@ -113,9 +118,7 @@ describe("pat-tiptap", () => {
113118
await utils.timeout(1);
114119

115120
containers[1].querySelector("[contenteditable]").focus(); // Set focus to bypass toolbar check
116-
document
117-
.querySelector("#tiptap-external-toolbar-2 .button-link")
118-
.dispatchEvent(new Event("pat-modal-ready"));
121+
open_panel("#tiptap-external-toolbar-2 .button-link");
119122
await utils.timeout(1);
120123

121124
document.querySelector("#link-panel [name=tiptap-href]").value = "https://url2.com/"; // prettier-ignore
@@ -314,9 +317,7 @@ describe("pat-tiptap", () => {
314317

315318
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
316319

317-
document
318-
.querySelector("#tiptap-external-toolbar .button-link")
319-
.dispatchEvent(new Event("pat-modal-ready"));
320+
open_panel("#tiptap-external-toolbar .button-link");
320321
await utils.timeout(1);
321322

322323
document.querySelector("#link-panel [name=tiptap-href]").value = "https://patternslib.com/"; // prettier-ignore
@@ -356,9 +357,7 @@ describe("pat-tiptap", () => {
356357

357358
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
358359

359-
document
360-
.querySelector("#tiptap-external-toolbar .button-image")
361-
.dispatchEvent(new Event("pat-modal-ready"));
360+
open_panel("#tiptap-external-toolbar .button-image");
362361
await utils.timeout(1);
363362

364363
document.querySelector("#image-panel [name=tiptap-src]").value = "https://path/to/image.png"; // prettier-ignore
@@ -404,9 +403,7 @@ describe("pat-tiptap", () => {
404403

405404
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
406405

407-
document
408-
.querySelector("#tiptap-external-toolbar .button-image")
409-
.dispatchEvent(new Event("pat-modal-ready"));
406+
open_panel("#tiptap-external-toolbar .button-image");
410407
await utils.timeout(1);
411408

412409
document.querySelector("#image-panel [name=tiptap-src]").value = "https://path/to/image.png"; // prettier-ignore
@@ -445,9 +442,7 @@ describe("pat-tiptap", () => {
445442

446443
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
447444

448-
document
449-
.querySelector("#tiptap-external-toolbar .button-image")
450-
.dispatchEvent(new Event("pat-modal-ready"));
445+
open_panel("#tiptap-external-toolbar .button-image");
451446
await utils.timeout(1);
452447

453448
document.querySelector("#image-panel [name=tiptap-src]").value =
@@ -523,9 +518,7 @@ describe("pat-tiptap", () => {
523518

524519
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
525520

526-
document
527-
.querySelector("#tiptap-external-toolbar .button-embed")
528-
.dispatchEvent(new Event("pat-modal-ready"));
521+
open_panel("#tiptap-external-toolbar .button-embed");
529522
await utils.timeout(1);
530523

531524
document.querySelector("#embed-panel [name=tiptap-src]").value = "https://www.youtube.com/embed/j8It1z7r1g4"; // prettier-ignore
@@ -567,9 +560,7 @@ describe("pat-tiptap", () => {
567560

568561
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
569562

570-
document
571-
.querySelector("#tiptap-external-toolbar .button-embed")
572-
.dispatchEvent(new Event("pat-modal-ready"));
563+
open_panel("#tiptap-external-toolbar .button-embed");
573564
await utils.timeout(1);
574565

575566
document.querySelector("#embed-panel [name=tiptap-src]").value = "https://www.youtube.com/watch?v=j8It1z7r1g4"; // prettier-ignore
@@ -608,9 +599,7 @@ describe("pat-tiptap", () => {
608599

609600
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
610601

611-
document
612-
.querySelector("#tiptap-external-toolbar .button-embed")
613-
.dispatchEvent(new Event("pat-modal-ready"));
602+
open_panel("#tiptap-external-toolbar .button-embed");
614603
await utils.timeout(1);
615604

616605
document.querySelector("#embed-panel [name=tiptap-src]").value = "https://player.vimeo.com/video/9206226"; // prettier-ignore
@@ -652,9 +641,7 @@ describe("pat-tiptap", () => {
652641

653642
document.querySelector(".tiptap-container [contenteditable]").focus(); // Set focus to bypass toolbar check
654643

655-
document
656-
.querySelector("#tiptap-external-toolbar .button-embed")
657-
.dispatchEvent(new Event("pat-modal-ready"));
644+
open_panel("#tiptap-external-toolbar .button-embed");
658645
await utils.timeout(1);
659646

660647
document.querySelector("#embed-panel [name=tiptap-src]").value = "https://vimeo.com/9206226"; // prettier-ignore

0 commit comments

Comments
 (0)