Fix return behavior on Mathjax decorated element

This commit is contained in:
Henrik Giesel 2021-08-07 03:37:03 +02:00
parent 4576ce8cc3
commit 9ef4bb15c6

View file

@ -40,12 +40,25 @@ function placeCaretAfter(node: Node): void {
function moveNodesInsertedOutside(element: Element, allowedChild: Node): () => void { function moveNodesInsertedOutside(element: Element, allowedChild: Node): () => void {
const observer = new MutationObserver(() => { const observer = new MutationObserver(() => {
if (element.childNodes.length === 1) {
return;
}
const childNodes = [...element.childNodes]; const childNodes = [...element.childNodes];
const allowedIndex = childNodes.findIndex((child) => child === allowedChild); const allowedIndex = childNodes.findIndex((child) => child === allowedChild);
const beforeChildren = childNodes.slice(0, allowedIndex); const beforeChildren = childNodes.slice(0, allowedIndex);
const afterChildren = childNodes.slice(allowedIndex + 1); const afterChildren = childNodes.slice(allowedIndex + 1);
// Special treatment for pressing return after mathjax block
if (
afterChildren.length === 2 &&
afterChildren.every((child) => (child as Element).tagName === "BR")
) {
const first = afterChildren.pop();
element.removeChild(first!);
}
let lastNode: Node | null = null; let lastNode: Node | null = null;
for (const node of beforeChildren) { for (const node of beforeChildren) {
@ -140,6 +153,7 @@ export const Mathjax: DecoratedElementConstructor = class Mathjax
decorate(): void { decorate(): void {
const mathjax = (this.dataset.mathjax = this.innerText); const mathjax = (this.dataset.mathjax = this.innerText);
this.innerHTML = ""; this.innerHTML = "";
this.style.whiteSpace = "normal";
this.component = new Mathjax_svelte({ this.component = new Mathjax_svelte({
target: this, target: this,
@ -150,6 +164,7 @@ export const Mathjax: DecoratedElementConstructor = class Mathjax
undecorate(): void { undecorate(): void {
this.innerHTML = this.dataset.mathjax ?? ""; this.innerHTML = this.dataset.mathjax ?? "";
delete this.dataset.mathjax; delete this.dataset.mathjax;
this.removeAttribute("style");
this.component?.$destroy(); this.component?.$destroy();
this.component = undefined; this.component = undefined;