From e4057770f4092543da0a53c55a153b330bad28c9 Mon Sep 17 00:00:00 2001
From: malkja <orlin.malkja@sub.uni-goettingen.de>
Date: Fri, 25 Oct 2024 15:36:19 +0200
Subject: [PATCH 1/5] fix: allocate VariantItems colors after annotations are
 loaded for each item

---
 .../annotations/variants/VariantsView.vue         | 14 --------------
 src/stores/annotations.ts                         |  4 ++++
 src/utils/variants.js                             | 15 +++++++++++++++
 3 files changed, 19 insertions(+), 14 deletions(-)
 create mode 100644 src/utils/variants.js

diff --git a/src/components/annotations/variants/VariantsView.vue b/src/components/annotations/variants/VariantsView.vue
index 5a9f104a..7c67730f 100644
--- a/src/components/annotations/variants/VariantsView.vue
+++ b/src/components/annotations/variants/VariantsView.vue
@@ -13,8 +13,6 @@ import { getVariantAnnotations } from '@/utils/annotations'
 const annotationStore = useAnnotationsStore();
 const contentsStore = useContentsStore();
 
-allocateWitnessColorInVariantItem()
-
 const annotations = computed<Annotation[]>(() => annotationStore.annotations);
 const activeContentUrl = computed<string>(() => contentsStore.activeContentUrl);
 
@@ -88,18 +86,6 @@ const unsubscribe = TextEventBus.on('click', ({ target }) => {
 
 onBeforeUnmount(() => unsubscribe())
 
-
-function allocateWitnessColorInVariantItem() {
-  const colors = {}
-  if (!annotationStore.witnesses) return
-  if (annotationStore.witnesses.length === 0) return;
-
-  annotationStore.witnesses.forEach((witness, i) => {
-    colors[witness.idno] = getItemColorBasedOnIndex(i)
-  })
-  annotationStore.setVariantItemsColors(colors)
-  }
-
 </script>
 
 <template>
diff --git a/src/stores/annotations.ts b/src/stores/annotations.ts
index 90b6a910..8f9ce9a5 100644
--- a/src/stores/annotations.ts
+++ b/src/stores/annotations.ts
@@ -9,6 +9,7 @@ import {useConfigStore} from '@/stores/config';
 import TextEventBus from '@/utils/TextEventBus';
 
 import { getVariantAnnotations } from '@/utils/annotations'
+import { allocateWitnessColorInVariantItem } from '@/utils/variants';
 
 
 export const useAnnotationsStore = defineStore('annotations', () => {
@@ -176,7 +177,9 @@ export const useAnnotationsStore = defineStore('annotations', () => {
   const annotationLoaded = ({ items, refs }) => {
     annotations.value = items
     witnesses.value = refs
+
     preprocessVariants()
+    allocateWitnessColorInVariantItem()
 
     updateAnnotationLoading(false)
   };
@@ -215,6 +218,7 @@ export const useAnnotationsStore = defineStore('annotations', () => {
     annotationStore.setActiveAnnotations(activeAnnotationsList)
 
     const selector = AnnotationUtils.generateTargetSelector(removeAnnotation);
+
     if (selector) {
       if (AnnotationUtils.isVariant(removeAnnotation)) {
         if (AnnotationUtils.getCurrentLevel(document.querySelector(selector)) > 0
diff --git a/src/utils/variants.js b/src/utils/variants.js
new file mode 100644
index 00000000..b8725d19
--- /dev/null
+++ b/src/utils/variants.js
@@ -0,0 +1,15 @@
+import { useAnnotationsStore } from "@/stores/annotations";
+import { getItemColorBasedOnIndex } from '@/utils/color';
+
+
+export function allocateWitnessColorInVariantItem() {
+    const annotationStore = useAnnotationsStore()
+    const colors = {}
+    if (!annotationStore.witnesses) return
+    if (annotationStore.witnesses.length === 0) return;
+  
+    annotationStore.witnesses.forEach((witness, i) => {
+      colors[witness.idno] = getItemColorBasedOnIndex(i)
+    })
+    annotationStore.setVariantItemsColors(colors)
+}
\ No newline at end of file

From e68fc4a7e33d0b626d9469b4444357fe6c05beef Mon Sep 17 00:00:00 2001
From: malkja <orlin.malkja@sub.uni-goettingen.de>
Date: Fri, 25 Oct 2024 17:00:19 +0200
Subject: [PATCH 2/5] test: should switch from an item with no variants to
 another one with variants and show the list correctly

---
 tests/cypress/e2e/variants.cy.js | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/tests/cypress/e2e/variants.cy.js b/tests/cypress/e2e/variants.cy.js
index 954c5e2a..6587c2e3 100644
--- a/tests/cypress/e2e/variants.cy.js
+++ b/tests/cypress/e2e/variants.cy.js
@@ -84,6 +84,19 @@ const selectors = {
           .should("have.length", 11)
       });
 
+      it('Should switch from an item with no variants to another one with variants and show the list correctly', () => {
+        cy
+          .visit('/ahiqar-arabic-karshuni-local.html?tido=m20_i0_p0.0-1.0-2.0-3.2')
+          .reload()
+          .get('.header')                                // go to next item
+          .find('button')
+          .contains('Next Sheet')
+          .click()
+        cy.get(selectors.list)
+          .children()
+          .should('have.length', 11)
+      })
+
       it('select (unselect) a variant item', () => {
         // should select a variant item and add its witness after the highlighted text + the highlighted text should become light blue
         cy

From 0ca802374dc3d403059a8f640293be484f228b2b Mon Sep 17 00:00:00 2001
From: malkja <orlin.malkja@sub.uni-goettingen.de>
Date: Fri, 25 Oct 2024 18:16:47 +0200
Subject: [PATCH 3/5] test: rewrite the test by using visit() for changing item

---
 .../annotations/variants/VariantsView.vue          |  1 -
 tests/cypress/e2e/variants.cy.js                   | 14 ++++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/annotations/variants/VariantsView.vue b/src/components/annotations/variants/VariantsView.vue
index 7c67730f..33c392d5 100644
--- a/src/components/annotations/variants/VariantsView.vue
+++ b/src/components/annotations/variants/VariantsView.vue
@@ -2,7 +2,6 @@
 
 import VariantsTopBar from "@/components/annotations/variants/VariantsTopBar.vue";
 import VariantsList from "@/components/annotations/variants/VariantsList.vue";
-import { getItemColorBasedOnIndex } from '@/utils/color';
 import {useAnnotationsStore} from "@/stores/annotations";
 import {computed, onBeforeUnmount, watch} from "vue";
 import {useContentsStore} from "@/stores/contents";
diff --git a/tests/cypress/e2e/variants.cy.js b/tests/cypress/e2e/variants.cy.js
index 6587c2e3..a41f388f 100644
--- a/tests/cypress/e2e/variants.cy.js
+++ b/tests/cypress/e2e/variants.cy.js
@@ -86,6 +86,18 @@ const selectors = {
 
       it('Should switch from an item with no variants to another one with variants and show the list correctly', () => {
         cy
+          .visit('/ahiqar-arabic-karshuni-local.html?tido=m20_i0_p0.0-1.0-2.0-3.2')
+          .wait(500)
+          .reload()
+          .wait(500)
+          .visit('/ahiqar-arabic-karshuni-local.html?tido=m20_i1_p0.0-1.0-2.0-3.2')
+          .wait(500)
+          .get(selectors.list)
+          .children()
+          .should('have.length', 11)
+        /*
+          this test passes locally, but fails in the github pi
+          cy
           .visit('/ahiqar-arabic-karshuni-local.html?tido=m20_i0_p0.0-1.0-2.0-3.2')
           .reload()
           .get('.header')                                // go to next item
@@ -95,6 +107,8 @@ const selectors = {
         cy.get(selectors.list)
           .children()
           .should('have.length', 11)
+          */
+         
       })
 
       it('select (unselect) a variant item', () => {

From fa62b517deb2c4ca55e5f520e86cb69195e889e9 Mon Sep 17 00:00:00 2001
From: malkja <orlin.malkja@sub.uni-goettingen.de>
Date: Fri, 25 Oct 2024 19:10:31 +0200
Subject: [PATCH 4/5] fix: change the highlight of the target after
 de(selecting) variant item only if target is not null

---
 src/stores/annotations.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/stores/annotations.ts b/src/stores/annotations.ts
index 8f9ce9a5..cea66b4e 100644
--- a/src/stores/annotations.ts
+++ b/src/stores/annotations.ts
@@ -218,10 +218,14 @@ export const useAnnotationsStore = defineStore('annotations', () => {
     annotationStore.setActiveAnnotations(activeAnnotationsList)
 
     const selector = AnnotationUtils.generateTargetSelector(removeAnnotation);
+    const textEl = document.querySelector('#text-content')
+    const target = textEl.querySelector(selector)
 
-    if (selector) {
+
+    // when target is null -> we switched to another item - we don't continue and change the level of highlight of the text
+    if (target) {
       if (AnnotationUtils.isVariant(removeAnnotation)) {
-        if (AnnotationUtils.getCurrentLevel(document.querySelector(selector)) > 0
+        if (AnnotationUtils.getCurrentLevel(target) > 0
           && Object.keys(activeAnnotations.value).findIndex(key => {
             const sel = AnnotationUtils.generateTargetSelector(activeAnnotations.value[key])
             return sel === selector

From e5166fbfb82e795a1add540c6858d6deaaf16061 Mon Sep 17 00:00:00 2001
From: malkja <orlin.malkja@sub.uni-goettingen.de>
Date: Fri, 25 Oct 2024 19:11:42 +0200
Subject: [PATCH 5/5] test: add: when clicking a few variant items and
 switching the item, the new variants list is shown

---
 tests/cypress/e2e/variants.cy.js | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/tests/cypress/e2e/variants.cy.js b/tests/cypress/e2e/variants.cy.js
index a41f388f..44f13e50 100644
--- a/tests/cypress/e2e/variants.cy.js
+++ b/tests/cypress/e2e/variants.cy.js
@@ -111,6 +111,22 @@ const selectors = {
          
       })
 
+      it('Should show the new list of annotations when first selecting a few annotations and then switching the item', () => {
+        cy
+          .get(selectors.list)
+          .children()
+          .eq(0)
+          .click()
+          .next()
+          .click()
+          .get(selectors.panel1)
+          .find('ul[role="tree"]')
+          .find('ul[role="group"]')
+          .find('div').contains('182b')
+          .click()
+          .checkNoAnnotationsAvailable()
+      })
+
       it('select (unselect) a variant item', () => {
         // should select a variant item and add its witness after the highlighted text + the highlighted text should become light blue
         cy