From a4261a4a31e6db29118c16fef584581865a73d33 Mon Sep 17 00:00:00 2001
From: Michaela Robosova <robosovam@gmail.com>
Date: Sun, 11 Aug 2024 08:24:45 +0200
Subject: [PATCH] Fix tests after migrating from VIcon to KIcon

and related bug fixes.
---
 .../__tests__/contentNodeThumbnail.spec.js     |  5 +----
 .../frontend/shared/views/ContentNodeIcon.vue  |  4 ++--
 .../frontend/shared/views/InfoModal.vue        |  3 ++-
 .../views/__tests__/contentNodeIcon.spec.js    | 18 +++++++++---------
 .../contentNodeLearningActivityIcon.spec.js    |  1 -
 5 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/contentcuration/contentcuration/frontend/channelEdit/views/files/__tests__/contentNodeThumbnail.spec.js b/contentcuration/contentcuration/frontend/channelEdit/views/files/__tests__/contentNodeThumbnail.spec.js
index c13bb4ff60..794a35c50a 100644
--- a/contentcuration/contentcuration/frontend/channelEdit/views/files/__tests__/contentNodeThumbnail.spec.js
+++ b/contentcuration/contentcuration/frontend/channelEdit/views/files/__tests__/contentNodeThumbnail.spec.js
@@ -186,10 +186,7 @@ describe('thumbnail', () => {
   describe('remove workflow', () => {
     it('clicking remove button should emit an input event with a null value', () => {
       wrapper.setProps({ value: testThumbnail });
-      wrapper
-        .find('[data-test="remove"]')
-        .findComponent({ name: 'KIconButton' })
-        .vm.$emit('click');
+      wrapper.find('[data-test="remove"]').vm.$emit('click');
       expect(wrapper.emitted('input')[0][0]).toBe(null);
     });
   });
diff --git a/contentcuration/contentcuration/frontend/shared/views/ContentNodeIcon.vue b/contentcuration/contentcuration/frontend/shared/views/ContentNodeIcon.vue
index 571f91ff42..c70426638e 100644
--- a/contentcuration/contentcuration/frontend/shared/views/ContentNodeIcon.vue
+++ b/contentcuration/contentcuration/frontend/shared/views/ContentNodeIcon.vue
@@ -12,11 +12,11 @@
       :style="{ width: fillWidth ? '100%' : 'unset' }"
       capture-as-image
     >
-      <KIcon :icon="icon" :color="fontColor" />
+      <KIcon :icon="icon" :color="fontColor" data-test="icon" />
       <span v-if="includeText" class="ml-2">{{ text }}</span>
     </VChip>
     <span v-else capture-as-image>
-      <KIcon :icon="icon" :color="fontColor" />
+      <KIcon :icon="icon" :color="fontColor" data-test="icon" />
       <span v-if="includeText" class="ml-2">{{ text }}</span>
     </span>
   </span>
diff --git a/contentcuration/contentcuration/frontend/shared/views/InfoModal.vue b/contentcuration/contentcuration/frontend/shared/views/InfoModal.vue
index e6ee1c78b0..0f4d661607 100644
--- a/contentcuration/contentcuration/frontend/shared/views/InfoModal.vue
+++ b/contentcuration/contentcuration/frontend/shared/views/InfoModal.vue
@@ -1,9 +1,10 @@
 <template>
 
   <div :style="{ display: 'inline' }">
-    <KIcon
+    <KIconButton
       icon="help"
       :color="$themeTokens.primary"
+      size="small"
       data-test="info-icon"
       @click="displayDialog = !displayDialog"
     />
diff --git a/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeIcon.spec.js b/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeIcon.spec.js
index 0c18f65fd4..8ffa7a30ac 100644
--- a/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeIcon.spec.js
+++ b/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeIcon.spec.js
@@ -18,16 +18,16 @@ function makeWrapper(kind) {
 
 describe('ContentNodeIcon', () => {
   const testIcons = [
-    { value: 'topic', icon: 'folder' },
-    { value: 'video', icon: 'ondemand_video' },
-    { value: 'audio', icon: 'music_note' },
-    { value: 'exercise', icon: 'assignment' },
-    { value: 'document', icon: 'class' },
-    { value: 'html5', icon: 'widgets' },
-    { value: 'zim', icon: 'widgets' },
+    { value: 'topic', icon: 'topic' },
+    { value: 'video', icon: 'video' },
+    { value: 'audio', icon: 'audio' },
+    { value: 'exercise', icon: 'exercise' },
+    { value: 'document', icon: 'document' },
+    { value: 'html5', icon: 'html5' },
+    { value: 'zim', icon: 'html5' },
   ];
-  it.each(testIcons)('should display the correct icon $value', kind => {
+  it.each(testIcons)('should pass the correct icon value to KIcon', kind => {
     const wrapper = makeWrapper(kind.value);
-    expect(wrapper.find('.v-icon').text()).toContain(kind.icon);
+    expect(wrapper.find('[data-test="icon"]').props().icon).toBe(kind.icon);
   });
 });
diff --git a/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeLearningActivityIcon.spec.js b/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeLearningActivityIcon.spec.js
index f48e207a1e..de07c22cfd 100644
--- a/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeLearningActivityIcon.spec.js
+++ b/contentcuration/contentcuration/frontend/shared/views/__tests__/contentNodeLearningActivityIcon.spec.js
@@ -9,7 +9,6 @@ document.body.setAttribute('data-app', true); // Vuetify prints a warning withou
 
 describe('ContentNodeLearningActivityIcon', () => {
   let wrapper;
-  // expect(wrapper.find('.v-icon').text()).toContain(kind.icon);
   describe('labeled icons', () => {
     wrapper = mount(ContentNodeLearningActivityIcon, {
       propsData: {