Improved fix for open editors getting carried to different notetypes (#2422)

* Revert "Fix open editors getting carried over to different notetypes (#2393)"

This reverts commit bf5bcd3f52.

* Improved fix for open editors getting carried over to different notetypes

* Run ninja format

qt/aqt/editor.py

@@ -544,6 +544,7 @@ require("anki/ui").loaded.then(() => require("anki/NoteEditor").instances[0].too
             setMathjaxEnabled({json.dumps(self.mw.col.get_config("renderMathjax", True))});
             setShrinkImages({json.dumps(self.mw.col.get_config("shrinkEditorImages", True))});
             setCloseHTMLTags({json.dumps(self.mw.col.get_config("closeHTMLTags", True))});
+            triggerChanges();
             """
 
         if self.addMode:

ts/components/Collapsible.svelte

@@ -16,19 +16,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     function dynamicDuration(height: number): number {
         return 100 + Math.pow(height, 1 / 4) * 25;
     }
-    // If we don't transition, the editor actually takes considerably longer to create all
+    $: duration = dynamicDuration(contentHeight);
-    // the fields. Because of that, we're using an imperceptible duration for the animation
-    // when reduced motion is enabled.
-    $: duration = animated ? dynamicDuration(contentHeight) : 0.01;
 
     const size = tweened<number>(0);
 
     async function transition(collapse: boolean): Promise<void> {
-        // We need to ensure collapsibleElement still exists
-        if (!collapsibleElement) {
-            return;
-        }
-
         if (collapse) {
             contentHeight = collapsibleElement.clientHeight;
             size.set(0, {
@@ -49,7 +41,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 
     $: if (collapsibleElement) {
-        window.requestAnimationFrame(() => transition(collapse));
+        if (animated) {
+            transition(collapse);
+        } else {
+            collapsed = collapse;
+        }
     }
 
     let collapsibleElement: HTMLElement;
@@ -71,6 +67,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 <div
     bind:this={collapsibleElement}
     class="collapsible"
+    class:animated
     class:expanded
     class:full-hide={toggleDisplay}
     class:measuring
@@ -81,26 +78,29 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     <slot {collapsed} />
 </div>
 
-{#if measuring}
+{#if animated && measuring}
     <!-- Maintain document flow while collapsible height is measured -->
     <div class="collapsible-placeholder" />
 {/if}
 
 <style lang="scss">
     .collapsible {
-        &.measuring {
+        &.animated {
-            display: initial;
+            &.measuring {
-            position: absolute;
-            opacity: 0;
-        }
-        &.transitioning {
-            overflow: hidden;
-            height: var(--height);
-            &.expanded {
-                overflow: visible;
-            }
-            &.full-hide {
                 display: initial;
+                position: absolute;
+                opacity: 0;
+            }
+
+            &.transitioning {
+                overflow: hidden;
+                height: var(--height);
+                &.expanded {
+                    overflow: visible;
+                }
+                &.full-hide {
+                    display: initial;
+                }
             }
         }
         &.full-hide {

ts/editor/NoteEditor.svelte

@@ -130,10 +130,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
     let fieldsCollapsed: boolean[] = [];
     export function setCollapsed(defaultCollapsed: boolean[]): void {
-        tick().then(() => {
+        fieldsCollapsed =
-            fieldsCollapsed =
+            sessionOptions[notetypeId!]?.fieldsCollapsed ?? defaultCollapsed;
-                sessionOptions[notetypeId!]?.fieldsCollapsed ?? defaultCollapsed;
-        });
     }
 
     let richTextsHidden: boolean[] = [];
@@ -141,17 +139,28 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     let plainTextDefaults: boolean[] = [];
 
     export function setPlainTexts(defaultPlainTexts: boolean[]): void {
+        const states = sessionOptions[notetypeId!]?.fieldStates;
+        if (states) {
+            richTextsHidden = states.richTextsHidden;
+            plainTextsHidden = states.plainTextsHidden;
+            plainTextDefaults = states.plainTextDefaults;
+        } else {
+            plainTextDefaults = defaultPlainTexts;
+            richTextsHidden = [...defaultPlainTexts];
+            plainTextsHidden = Array.from(defaultPlainTexts, (v) => !v);
+        }
+    }
+
+    export function triggerChanges(): void {
+        // I know this looks quite weird and doesn't seem to do anything
+        // but if we don't call this after setPlainTexts() and setCollapsed()
+        // when switching notetypes, existing collapsibles won't react
+        // automatically to the updated props
         tick().then(() => {
-            const states = sessionOptions[notetypeId!]?.fieldStates;
+            fieldsCollapsed = fieldsCollapsed;
-            if (states) {
+            plainTextDefaults = plainTextDefaults;
-                richTextsHidden = states.richTextsHidden;
+            richTextsHidden = richTextsHidden;
-                plainTextsHidden = states.plainTextsHidden;
+            plainTextsHidden = plainTextsHidden;
-                plainTextDefaults = states.plainTextDefaults;
-            } else {
-                plainTextDefaults = defaultPlainTexts;
-                richTextsHidden = [...defaultPlainTexts];
-                plainTextsHidden = Array.from(defaultPlainTexts, (v) => !v);
-            }
         });
     }
 
@@ -175,7 +184,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 
     export function focusField(index: number | null): void {
-        setTimeout(() => {
+        tick().then(() => {
             if (typeof index === "number") {
                 if (!(index in fields)) {
                     return;
@@ -353,6 +362,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             setInsertSymbolsEnabled,
             setShrinkImages,
             setCloseHTMLTags,
+            triggerChanges,
             ...oldEditorAdapter,
         });
 

ts/editor/rich-text-input/RichTextStyles.svelte

@@ -16,11 +16,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     const stylesDidLoad: Promise<unknown> = Promise.all([userBaseStyle, userBaseRule]);
 
     userBaseStyle.then((baseStyle: StyleObject) => {
-        const sheet = baseStyle.element.sheet;
+        const sheet = baseStyle.element.sheet as CSSStyleSheet;
-        if (sheet) {
+        const baseIndex = sheet.insertRule("anki-editable {}");
-            const baseIndex = sheet.insertRule("anki-editable {}");
+        userBaseRuleResolve(sheet.cssRules[baseIndex] as CSSStyleRule);
-            userBaseRuleResolve(sheet.cssRules[baseIndex] as CSSStyleRule);
-        }
     });
 
     export let color: string;