ankidroid / Anki-Android

AnkiDroid: Anki flashcards on Android. Your secret trick to achieve superhuman information retention.
GNU General Public License v3.0
8.59k stars 2.22k forks source link

[BUG]: 2.17.3 - many complex card templates are broken #15773

Closed du5tmd closed 7 months ago

du5tmd commented 7 months ago

bug_note.zip

Checked for duplicates?

What are the steps to reproduce this bug?

Using the addon "Enhanced Cloze 2.1 v2", make a cloze card with images.

Expected behaviour

Clozes should appear.

ex. Name: {{c1::john doe}} Pic: => Name: [...] Pic: (face.jpg)

Actual behaviour

Clozes don't appear at all.

ex. Name: {{c1::john doe}} Pic: => Name: Pic: (face.jpg)

Debug info

AnkiDroid Version = 2.17.0 (af526585a5270c75db3f6b892d00035ad1ab17e0)

Backend Version = 0.1.34-anki23.12.1 (23.12.1 1a1d4d5419c6b57ef3baf99c9d2d9cf85d36ae0a)

Android Version = 12 (SDK 31)

ProductFlavor = play

Manufacturer = samsung

Model = SM-G973N

Hardware = exynos9820

Webview User Agent = Mozilla/5.0 (Linux; Android 12; SM-G973N Build/SP1A.210812.016; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/121.0.6167.143 Mobile Safari/537.36

ACRA UUID = ae33fd73-ad8b-40ef-9d37-cad4c3375e5b

Crash Reports Enabled = true

(Optional) Anything else you want to share?

No response

Research

david-allison commented 7 months ago

Anki Desktop

Screenshot 2024-03-05 at 02 10 26

AnkiDroid 2.18alpha ea9e966ee6d260c9afbd2458569ca9a2d00856be

Screenshot 2024-03-05 at 02 12 37

02:18:55.059 AbstractFlashcardViewer              I  AbstractFlashcardViewer:: Show answer button pressed
02:18:55.059 AutomaticAnswer                      I  stop: automatically show answer
02:18:55.059 Reviewer                             D  Fullscreen delayed hide in 100ms
02:18:55.060 AbstractFlashcardViewer              D  displayCardAnswer()
02:18:55.097 TypeAnswer                           D  correct answer = null
02:18:55.097                                      D  user answer = 
02:18:55.101 AbstractFlashcardViewer              D  updateCard()
02:18:55.101 SoundPlayer                          I  loading sounds for card 1655468925456
02:18:55.115 AbstractFlashcardViewer              D  fillFlashcard()
02:18:55.117 AbstractFlashcar...gGestureDetector  D  Removing pending touch events for gestures
02:18:55.117 SoundPlayer$playAllSoundsForSide     I  playing sounds for ANSWER
02:18:55.173 chromium                             I  [INFO:CONSOLE(837)] "Uncaught (in promise) ReferenceError: showHintsForPseudoClozes is not defined", source: http://127.0.0.1:32857/ (837)
02:18:55.179                                      I  [INFO:CONSOLE(837)] "Uncaught ReferenceError: showHintsForPseudoClozes is not defined", source: http://127.0.0.1:32857/ (837)
02:18:55.443 Stopwatch                            D  executed page render in 270ms
02:18:55.443 AbstractFlashcar...dViewerWebClient  D  Java onPageFinished triggered: data:text/html;charset=utf-8;base64,
02:18:55.488 rsdroid::logging                     D  STDOUT: [INFO:CONSOLE(837)] "Uncaught (in promise) ReferenceError: showHintsForPseudoClozes is not defined", source: http://127.0.0.1:32857/ (837)
02:18:55.488                                      D  STDOUT: [INFO:CONSOLE(837)] "Uncaught ReferenceError: showHintsForPseudoClozes is not defined", source: http://127.0.0.1:32857/ (837)
**Front template** ```html



{{#Note}}
Note

{{/Note}} {{#Mnemonics}}
Mnemonics

{{/Mnemonics}} {{#Extra}}
Extra

{{/Extra}}
Information

{{cloze:Content}} {{cloze:Cloze99}}
``` **Back template** ```html {{FrontSide}} {{cloze:Content}} ``` **Styling** ```css @font-face { font-family: 'SamsungOneKorean'; src: url('_SamsungOneKorean-500.ttf'); } #card-body { font: 17px/1.65em 'SamsungOneKorean'; text-align: left; margin-top: 38px; margin-bottom: 60px; } .content { padding-left: 0.5em; border-left: 4px solid transparent; } .header { font: bold 17px/1.5em; padding-left: 0.5em; } .header-red { border-left: 4px solid #db4437; color: #db4437; } .header-green { border-left: 4px solid #0f9d58; color: #0f9d58; } .header-blue { border-left: 4px solid #4285f4; color: #4285f4; } .header-yellow { border-left: 4px solid #f4b400; color: #f4b400; } .genuine-cloze[show-state="hint"] { border-bottom: 2px solid #ff5c82; background-color: #ff96af; } .pseudo-cloze[show-state="hint"] { border-bottom: 2px solid #4285f4; background-color: #87b1ff; } #show-one-cloze-left, #show-one-cloze-right, #no-more-cloze { height: 100%; width: 30px; position: fixed; z-index: 9; top: 0; background-color: transparent; } #show-one-cloze-left { left: 0; } #show-one-cloze-right { right: 0; } #no-more-cloze { width: 10px; background-color: #db4437; left: 0; display: none; } #show-all-pseudo-clozes { height: 20px; width: 100%; position: fixed; z-index: 9; top: 0; left: 0; background-color: transparent; } .mobile ol, .mobile ul, .mobile li { margin-left: -0.5em; } .mobile li { margin: 0.1em, inherit; } table { border-collapse: collapse; margin: 0.5em; } thead tr, tfoot tr { border-top: 2px solid #0f9d58; border-bottom: 2px solid #0f9d58; } td, th { border: 1px solid #0f9d58; padding: 0.3em 0.5em; } hr { border-top: 1px solid #aaaaaa; width: 100%; margin: 0; padding: 0; } pre { border-left: 2px solid #0f9d58; padding-left: 10px; } code, kbd, var, samp, tt { background-color: #fdf3d6; } .disable-select { -webkit-touch-callout: none; user-select: none; } ul { margin:0px; } ol { margin:0px; } /*내가 추가*/ sub { font-size:10px; vertical-align: baseline; } sup { font-size:10px; } hl { background-color: yellow; } #rd { background-color: #ff66aa; } #gr { background-color: #8fb; } #bl { background-color: #7bf; } #Y23[data-tags~="23국시"]::before { display: flex; height: 12px; width: fit-content; align-items: center; float:left; margin-right:3px; border: solid #888 1px; border-radius: 9px; background-color: #48bffa; padding: 3px 5px 1px 5px; text-align: center; font-size: 7px; font-weight: bold; color: #ffffff; content: "2023"; } #Y24[data-tags~="24국시"]::before { display: flex; height: 12px; width: fit-content; align-items: center; float:left; margin-right:3px; border: solid #555 1px; border-radius: 9px; background-color: #978dfc; padding: 3px 5px 1px 5px; text-align: center; font-size: 7px; font-weight: bold; color: #ffffff; content: "2024"; } #CPX[data-tags*="증상::"]::before { display: flex; height: 12px; width: fit-content; align-items: center; float:left; margin-right:3px; border: solid #888 1px; border-radius: 9px; background-color: #fcba03; padding: 3px 5px 1px 5px; text-align: center; font-size: 7px; font-weight: bold; color: #ffffff; content: "CPX"; } #Leech[data-tags*="leech"]::before { display: flex; height: 12px; width: fit-content; align-items: center; float:left; margin-right:3px; border: solid #888 1px; border-radius: 9px; background-color: #f56; padding: 3px 5px 1px 5px; text-align: center; font-size: 7px; font-weight: bold; color: #ffffff; content: "Lch"; } .tagsbut { background-color: rgba(245, 245, 245, 0.9); height: 18px; text-align: left; position:fixed; top:0px; left:0px; right:0px; padding: 5px 8px 5px 12px; } .floatimg { float:right; right:20px; padding: 5px 5px; } .replay-button span svg { height: 22px !important; width: 22px !important; min-width: 15px !important; min-height: 15px !important; float:right; } ```
david-allison commented 7 months ago

@du5tmd Thank you! Got it from here

@BrayanDSO parseSourcesToFileScheme strips <script> tags if a substitution takes place.

Introduced: 2.17.3

Cause:

This isn't an exact test case (the output should be changed due to the substitution), but it demonstrates the problem

Index: AnkiDroid/src/test/java/com/ichi2/libanki/TemplateManagerTest.kt
IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
===================================================================
diff --git a/AnkiDroid/src/test/java/com/ichi2/libanki/TemplateManagerTest.kt b/AnkiDroid/src/test/java/com/ichi2/libanki/TemplateManagerTest.kt
--- a/AnkiDroid/src/test/java/com/ichi2/libanki/TemplateManagerTest.kt  (revision 8b4245f8ec407cd1c493eb75ddf2c1226230b3f4)
+++ b/AnkiDroid/src/test/java/com/ichi2/libanki/TemplateManagerTest.kt  (date 1709607117290)
@@ -133,6 +133,48 @@
         assertEquals("""<img src="file:///storage/emulated/0/AnkiDroid@%23$%25/collection.media/magenta.png">""", result)
     }

+
+
+    @Test
+    fun  `parseSourcesToFileScheme - mixed script`() {
+        val input = """
+            <!-- VERSION 1.14 -->
+            <script>
+            var scrollToClozeOnToggle = false
+            var animateScroll = true
+            var showHintsForPseudoClozes = true
+            var underlineRevealedPseudoClozes = false
+            var underlineRevealedGenuineClozes = true
+            var revealPseudoClozesByDefault = false
+            var swapLeftAndRightBorderActions = false
+
+            // Shortcut options
+            var revealNextGenuineClozeShortcut = "W"
+            var revealAllGenuineClozesShortcut = "Shift+W"
+
+            var revealNextPseudoClozeShortcut = "Q"
+            var revealAllPseudoClozesShortcut = "Shift+Q"
+
+            // Touch open ("genuine" or "pseudo")
+            var leftTouchOpen = "genuine"
+            var rightTouchOpen = "genuine"
+            </script>
+
+            <div id="extra-section">
+            
+            <div id="extra" class="content" style="display:none">
+            • type 1 RTA (distal): Sx: nephrocalcinosis, renal stone Hx<br><img src="paste-0f5d2bfd133325a24eb52012f66c8887ef5d79b7.jpg" width="203">&nbsp;<img src="https://www.researchgate.net/publication/258205248/figure/fig1/AS:202727771643906@1425345475421/Ultrasound-of-the-right-kidney-shows-marked-medullary-nephrocalcinosis-The-kidney-is.png" width="193"><br><br>• ECG<br><br><img alt="Hyperkalaemia ECG changes • LITFL • ECG Library" src="PushPull-K-ECG.png" width="500">
+            </div>
+            </div>
+            
+            <!-- ENHANCED_CLOZE -->
+            <span id="enhanced-cloze-content" style="display:none">저칼륨혈증&nbsp;<font size="1">Hypokalemia</font><br>• 정의: plasma K {{c1::&lt; 3.5}}<br>• 증상: {{c1::피로, 근육통, 힘빠짐, 변비, 장폐색, 부정맥, 다음, 다뇨}}<br>• 검사: {{c1::ECG (ST depression)}}<br><br>감별<br>• {{c1::Urine K &gt; 15<br>&nbsp; &nbsp; ∘}} {{c1::Metabolic acidosis:}} {{c1::DKA, RTA(type 1, 2), acetazolamide<br>&nbsp; &nbsp; ∘}} {{c1::Metabolic alkalosis: <br>&nbsp; &nbsp; &nbsp; &nbsp; ▸}} {{c1::BP↑: 고알도스테론(레닌↓), 리들, 신혈관고혈압, 신실질질환, 갈색세포종, ACTH<br>&nbsp; &nbsp; &nbsp; &nbsp; ▸}} {{c1::BP−: 구토, 이뇨제, 바터, 기텔만, 저마그네슘}}<br>• {{c1::Urine K &lt; 15<br>&nbsp; &nbsp; ∘}} {{c1::Acidosis:}} {{c1::설사, 완화제<br>&nbsp; &nbsp; ∘}} {{c1::Alkalosis:}} {{c1::발한}}<br><br>Tx: {{c1::원인제거, 경구 칼륨, KCl IV + N/S<br>&nbsp; &nbsp; ∘ IV KCl: 속도:}} {{c1::≤20meq/L/hr, 농도 ≤40meq/L, 용량 ≤200meq/L/d}}</span>
+            <span style="display:none;" id="edit-clozes">저칼륨혈증&nbsp;<font size="1">Hypokalemia</font><br>• 정의: plasma K <span class="cloze" data-cloze="&amp;lt&#x3B;&#x20;3&#x2E;5" data-ordinal="1">[...]</span><br>• 증상: <span class="cloze" data-cloze="피로&#x2C;&#x20;근육통&#x2C;&#x20;힘빠짐&#x2C;&#x20;변비&#x2C;&#x20;장폐색&#x2C;&#x20;부정맥&#x2C;&#x20;다음&#x2C;&#x20;다뇨" data-ordinal="1">[...]</span><br>• 검사: <span class="cloze" data-cloze="ECG&#x20;&#x28;ST&#x20;depression&#x29;" data-ordinal="1">[...]</span><br><br>감별<br>• <span class="cloze" data-cloze="Urine&#x20;K&#x20;&amp;gt&#x3B;&#x20;15&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;∘" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="Metabolic&#x20;acidosis&#x3A;" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="DKA&#x2C;&#x20;RTA&#x28;type&#x20;1&#x2C;&#x20;2&#x29;&#x2C;&#x20;acetazolamide&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;∘" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="Metabolic&#x20;alkalosis&#x3A;&#x20;&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;▸" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="BP↑&#x3A;&#x20;고알도스테론&#x28;레닌↓&#x29;&#x2C;&#x20;리들&#x2C;&#x20;신혈관고혈압&#x2C;&#x20;신실질질환&#x2C;&#x20;갈색세포종&#x2C;&#x20;ACTH&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;▸" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="BP−&#x3A;&#x20;구토&#x2C;&#x20;이뇨제&#x2C;&#x20;바터&#x2C;&#x20;기텔만&#x2C;&#x20;저마그네슘" data-ordinal="1">[...]</span><br>• <span class="cloze" data-cloze="Urine&#x20;K&#x20;&amp;lt&#x3B;&#x20;15&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;∘" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="Acidosis&#x3A;" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="설사&#x2C;&#x20;완화제&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;∘" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="Alkalosis&#x3A;" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="발한" data-ordinal="1">[...]</span><br><br>Tx: <span class="cloze" data-cloze="원인제거&#x2C;&#x20;경구&#x20;칼륨&#x2C;&#x20;KCl&#x20;IV&#x20;&#x2B;&#x20;N&#x2F;S&lt;br&gt;&amp;nbsp&#x3B;&#x20;&amp;nbsp&#x3B;&#x20;∘&#x20;IV&#x20;KCl&#x3A;&#x20;속도&#x3A;" data-ordinal="1">[...]</span> <span class="cloze" data-cloze="≤20meq&#x2F;L&#x2F;hr&#x2C;&#x20;농도&#x20;≤40meq&#x2F;L&#x2C;&#x20;용량&#x20;≤200meq&#x2F;L&#x2F;d" data-ordinal="1">[...]</span></span>
+        """
+        val result = parseSourcesToFileScheme(input, "/storage/emulated/0/15773/collection.media")
+        assertEquals(input, result)
+    }
+
     /***********************************************************************************************
      * [parseVideos] tests
      **********************************************************************************************/
david-allison commented 7 months ago

doc.head().html() + doc.body().html() fixes this case, but the HTML is an inexact replica (the initial comment is stripped).

This may need a different library