Whenever my onClickSave function calls window.StripoApi.getTemplate() and window.StripoApi.compileEmail(), the Stripo plugin removes the current CKEditor. This prevents the user from continuing to type after hitting the Ctrl+S hotkey.
Here is my code to attempt a workaround of this, but it doesn't work:
// Handle Ctrl+KeyS for Stripo iframe.
React.useEffect(() => {
if (!ready) return;
/** @type {HTMLIFrameElement} */
const iframe = document.getElementsByClassName("stripo-preview-frame")[0];
if (!iframe) return;
const doc = iframe.contentDocument;
/** @param {KeyboardEvent} e */
function handle(e) {
if (e.ctrlKey && e.code === "KeyS") {
e.preventDefault();
const focusEl = doc.activeElement;
onClickSave().then(() => {
iframe.focus();
// console.log("f", focusEl); // <div class="esd-cke-text"></div>
if (focusEl?.focus) {
// The following never works because the input disappears on save...
// focusEl.focus();
}
});
}
}
doc.addEventListener("keydown", handle);
return () => {
doc.removeEventListener("keydown", handle);
};
}, [ready, onClickSave]);
Whenever my
onClickSavefunction callswindow.StripoApi.getTemplate()andwindow.StripoApi.compileEmail(), the Stripo plugin removes the current CKEditor. This prevents the user from continuing to type after hitting theCtrl+Shotkey.Here is my code to attempt a workaround of this, but it doesn't work: